I have a UICollectionView with 3 cells (cells' width is self.collectionView.frame.size.width / 3).
The collectionView is placed inside a UIVisualEffectView with dark blur effect.
I want to add a 1px vibrancy gap between every cell, I've tried:
let divider1 = UIVisualEffectView(frame: CGRect(x: self.collectionView.frame.size.width / 3, y: 0, width: 1, height: self.collectionView.frame.size.height))
divider1.effect = UIVibrancyEffect(blurEffect: UIBlurEffect(style: .dark))
let divider2 = UIVisualEffectView(frame: CGRect(x: (self.collectionView.frame.size.width / 3) * 2, y: 0, width: 1, height: self.collectionView.frame.size.height))
divider2.effect = UIVibrancyEffect(blurEffect: UIBlurEffect(style: .dark))
self.collectionView.addSubview(divider1)
self.collectionView.addSubview(divider2)
but it doesn't present anything. If I set the divider's backgroundColor to a color it does work, so it's probably something with the vibrancy effect.
Any idea why?
Thanks!
Try this code:
Note: Tested in Swift 3
override func viewDidLoad() {
super.viewDidLoad()
// Add a background view to the collectionView
let backgroundImage = UIImage(named: "Set your image file here")
let imageView = UIImageView(image: backgroundImage)
self.collectionView.backgroundView = imageView
//To get a balance look from collectionView background
collectionView.backgroundColor = UIColor(patternImage: backgroundImage!)
// To setup a blurView background
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.light)
let blurView = UIVisualEffectView(effect: blurEffect)
blurView.frame = view.bounds
imageView.addSubview(blurView)
}
Output:
To make it works you need to create UIVibrancyEffect using blur effect you use in your collection view.
Related
i want a blurred background. i have a subview for the main view . and i want the subview to not be affected by blur. What should i do?
Code:
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = view.bounds
let vibrancyEffect = UIVibrancyEffect(blurEffect: blurEffect)
let vibrancyEffectView = UIVisualEffectView(effect: vibrancyEffect)
vibrancyEffectView.frame = view.bounds
view.addSubview(blurEffectView)
view.addSubview(vibrancyEffectView)
FrameView = UIView()
if let FrameView = FrameView {
FrameView.layer.borderColor = UIColor.white.cgColor
FrameView.layer.borderWidth = 2
FrameView.frame=CGRect(x:30,y:(view.frame.height/2-50),width:view.frame.width-60,height:100)
blurEffectView.contentView.addSubview(FrameView)
}
So i want the view to be blurred and the FrameView to be clear.
This is what my app currently looks like.
I had try a test project , and i add the blur to mainView first , then i add the frameView to mainView , i seems good and the frameView is not blur.
let mainView = UIImageView.init(frame: self.view.bounds);
mainView.image = UIImage.init(named: "a.png");
let blurEffect = UIBlurEffect.init(style: .dark);
let effectView = UIVisualEffectView.init(effect: blurEffect);
effectView.frame = mainView.bounds;
effectView.alpha = 1;
let frameView = UIImageView.init(frame: CGRect.init(x: 0, y: 0, width: 200, height: 50));
frameView.image = UIImage.init(named: "b.png");
frameView.center = self.view.center;
//add the blur view first
mainView.addSubview(effectView);
self.view.addSubview(mainView);
self.view.addSubview(frameView);
You have to add the frame upper in you hiearchy, as you see, the BlurEffectView blurs every subview within it, so check that you are adding the subView to the main View of viewController and use func bringSubView to front... :)
I'm trying to add a blur effect to my view. I created the blur effect like so
let blurLabel: UIVisualEffectView = {
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
return blurEffectView
}()
Then I add it to the subview like so, and set up the constraints with it as well
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: .subtitle, reuseIdentifier: reuseIdentifier)
let view = tableViewCell
addSubview(view)
view.addSubview(blurLabel)
blurLabel.leftAnchor.constraint(equalTo: self.leftAnchor,constant:0).isActive = true
//blurLabel.topAnchor.constraint(equalTo: self.topAnchor, constant: 178).isActive = true
blurLabel.widthAnchor.constraint(equalToConstant: 375).isActive = true
blurLabel.heightAnchor.constraint(equalToConstant: 180).isActive = true
But when I run the application it doesn't appear at all
Edit: As suggested by #HAS & #Fogmeister, you can also use translatesAutoResizingMaskIntoConstraints = false as it is better solution to use Auto Layout without specifying explicit frames.
You will have to assign frame to UIVisualEffectView like this:
let blurLabel: UIVisualEffectView = {
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = CGRect(x: 0, y: 0, width: 60, height: 40) //give desirable frame
return blurEffectView
}()
If you would like, instead of giving explicit frames you can also provide your blurView's to any of your view or, subviews.
let blurLabel: UIVisualEffectView = {
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = myMainview.bounds //Blur effect's frame
return blurEffectView
}()
override func viewDidLoad() {
super.viewDidLoad()
// Use it somewhere using
self.view.insertSubview(blurEffectView, belowSubview: myAnotherView)
// You may also use any of the subviews too, instead of the self.view
/// self.myView.insertSubview(blurEffectView, belowSubview: myAnotherView)
}
To fix this you just have to stop it automatically creating constraints. Like this...
let blurLabel: UIVisualEffectView = {
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
// this line will stop constraints being added for a zero frame
blurEffectView.translatesAutoResizingMaskIntoConstraints = false
return blurEffectView
}()
In storyBoard, I added separate UIView as First responder in view controller.Then I added that view as subview of self.view. But I want self.view should be blurred when subview is shown. How can i do this?
I tried by applying
let imageView = UIImageView(image: UIImage(named: "blur2.jpg"))
imageView.frame = self.view.bounds
imageView.contentMode = .scaleAspectFit
self.view.addSubview(imageView)
let blurEffect = UIBlurEffect(style: .regular)
let blurredEffectView = UIVisualEffectView(effect: blurEffect)
blurredEffectView.frame = imageView.bounds
self.view.addSubview(blurredEffectView)
self.view.addSubview(view_Message)
view_Message.center = self.view.center
view_Message.alpha = 1
view_Message.layer.cornerRadius = 0.3
view_Message.transform = CGAffineTransform.init(scaleX: 1.3, y: 1.3)
view_Message is UIView which is taken as FirstResponder in storyBoard.
But my self.view content goes invisible. I want My self.view should get blur(but should be shown lightly) at the same time I want my subview is shown.
i suggest you to
1. Take a UIView(let say myView) of frame self.view.bounds with clear as backgroundcolor
2. Add imageView into it of same frame
3. set backgroundcolor for imageView white,alpha nearly 0.7,and blur effect.
4. Now add your view_Message into myView as SubView.
5. Atlast add myView to self.view
or you can go by using UIVisualEffectBlur class either in storyboard or programmatically available for iOS 8+.
You can also use visualEffectView rather than blurEffect like this:
let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
visualEffectView.frame = view.bounds
visualEffectView.alpha = 0.7
self.view.addSubview(visualEffectView)
You can do like this
let frame = CGRectMake(0, 0, self.view.frame.size.width,self.view.frame.size.height )
blurview = UIView.init(frame: frame)
blurview.backgroundColor = UIColor.blackColor()
blurview.layer.opacity = 0.5
self.view.addSubview(blurview)
Check 3D view. It seems That your ImageView is On Top Of all views. This will hide all your views behind it.
Try
self.view.sendSubviewToBack(imageView)
at the end, This will send imagview at back an your all subviews will be visible.
I have UIImage which is blurred like this:
myImageView.image = UIImage(named: imageSet[0])
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Light)
blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView?.frame = view.bounds
myImageView.addSubview(blurEffectView!)
and then I want to fade in new UIImage like this:
UIView.transitionWithView(self.backgroundImageView,
duration:1.0,
options: UIViewAnimationOptions.TransitionCrossDissolve,
animations: { self.myImageView.image = UIImage(named: self.imageSet[randomInt]
},
completion: nil)
and the problem is, new image simply appears, rather than fade in. If I disable blur, images fade in and out. What I am doing wrong?
You add your blurEffectView as a subview of myImageView but you can not change alpha or give animation to UIBlurEffect nor UIVisualEffectView. Instead of that, add new UIView with same frame and constraints as your imageView object then add your effects as a subview of a UIView object ;
myImageView.image = UIImage(named: imageSet[0])
let animationView = UIView(frame: myImageView.bounds)
animationView.backgroundColor = .clearColor()
blurEffectView = UIVisualEffectView(effect: UIBlurEffect(style:.Light))
blurEffectView?.frame = animationView.bounds
view.addSubview(animationView)
animationView.addSubview(blurEffectView!)
I have applied my function applyVibrancy on the viewDidLoad method of my mainViewController for my Today Widget application.
override func viewDidLoad() {
applyVibrancy()
}
func applyVibrancy()
{
let oldView = self.view
var effectView = UIVisualEffectView(effect: UIVibrancyEffect.notificationCenterVibrancyEffect())
effectView.frame = oldView.bounds
effectView.autoresizingMask = oldView.autoresizingMask;
effectView.userInteractionEnabled = true
effectView.contentView.addSubview(oldView)
self.view.tintColor = UIColor.clearColor()
self.view = effectView
}
This successfully applies this visual effect into my entire widget. But I would like to have some of my nested views (Labels, Buttons, Images, etc) to NOT be affected by this effect.
How can I achieve this?
To achieve the effect you desire, for the views that you want to has this effect, add them to the contentView of a UIVisualEffectView, which then is added as subview of self.view. For other views not to be affected, add them to self.view directly.
When I run your code, I get a black screen.
UIVibrancyEffect amplifies and adjusts the color of content layered
behind the view, allowing content placed inside the contentView to
become more vivid. It is intended to be placed over, or as a subview
of, a UIVisualEffectView that has been configured with a UIBlurEffect.
This effect only affects content added to the contentView.
notificationCenterVibrancyEffect is a kind of UIVibrancyEffect, but in your code there is no UIVisualEffectView with a UIBlurEffect configured, you should create one, and place your effectView over that view or add your effectView as subview of that view's contentView. Otherwise you will not see any vibrancy.
Here is some test code.
let label = UILabel()
label.frame = CGRectMake(0, 0, 130, 30)
label.text = "Has Vibracy!"
let effectView = UIVisualEffectView(effect: UIVibrancyEffect.notificationCenterVibrancyEffect())
effectView.frame = CGRectMake(0, 0, 130, 30)
effectView.backgroundColor = UIColor.clearColor()
effectView.userInteractionEnabled = true
effectView.contentView.addSubview(label)
let blurView = UIVisualEffectView(effect: UIBlurEffect(style: .Dark))
blurView.contentView.addSubview(effectView)
blurView.frame = CGRectMake(80, 20, 130, 30)
self.view.tintColor = UIColor.clearColor()
let label1 = UILabel()
label1.frame = CGRectMake(80, 60, 130, 30)
label1.text = "No Vibracy!"
self.view.addSubview(blurView)
self.view.addSubview(label1)