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!)
Related
I have a UITableViewController (static table) to which I add a background image with (in viewDidLoad):
tableView.backgroundView = UIImageView(image: UIImage(named: "login_bg.jpg"))
How do I add the blurred effect to that background image?
I tried with: (in viewDidLoad)
let blurEffect = UIBlurEffect(style: .light)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = self.view.bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
self.tableView.backgroundView = blurEffectView
It works but it does not catch the background image.
You need to add the blur effect view as a subview instead of setting it as the background view.
self.tableView.backgroundView?.addSubview(blurEffectView)
Step 1 :
Set the background image.
tableView.backgroundView = UIImageView(image: UIImage(named: "img"))
Step 2:
Create blur effect view and add it as subview.
let blurEffect = UIBlurEffect(style: .light)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = self.view.bounds
blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
self.tableView.backgroundView?.addSubview(blurEffectView)
Here is how it looks.
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've been trying to add a blur effect behind an image after I tap on it, however, it is not going away after I dismiss the image. The blur doesn't disappear.
func didTapImageView(_ sender: UITapGestureRecognizer) {
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = self.view.frame
let imageView = sender.view as! UIImageView
let newImageView = UIImageView(image: imageView.image)
newImageView.frame = self.view.frame
newImageView.layer.masksToBounds = true
//newImageView.backgroundColor = UIColor.black.withAlphaComponent(1)
newImageView.contentMode = UIViewContentMode.scaleAspectFit
newImageView.isUserInteractionEnabled = true
let tap = UITapGestureRecognizer(target: self, action: #selector(dismissFullscreenImage))
newImageView.addGestureRecognizer(tap)
//blurEffectView.addGestureRecognizer(tap)
self.view.addSubview(blurEffectView)
self.view.addSubview(newImageView)
}
func dismissFullscreenImage(_ sender: UITapGestureRecognizer) {
sender.view?.removeFromSuperview()
}
How can I remove the blur after the tap? and also, how do I make it full screen? it doesn't seem to be working that either.
It looks to me like when you call dismissFullScreenImage you are only removing the UIImageView from the superview. The blurEffectView is a separate subview entirely. You'll have to set a property for the effect view and then remove it when you call for the image to be removed. At the top of your class say something like like:
var blurEffectView:UIVisualEffectView!
Then in your didTapImageView:
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = self.view.frame
Then when you call dismissFullScreenImage, you need to say something like :
func dismissFullscreenImage(_ sender: UITapGestureRecognizer) {
sender.view?.removeFromSuperview()
blurEffectView.removeFromSuperview()
}
I don't know what you mean "how do I make it fullscreen?" .. The visual effect already is fullscreen. At least it looks that way on your screenshot.
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 been trying to get an effect of having my scrollView appear under the navigationBar slightly blurred as is the case in the apple messages app. I have tried the following methods and none of them has worked:
1:
self.navigationController?.navigationBar.isTranslucent = true
2:
self.navigationController?.navigationBar.barStyle = UIBarStyle.blackTranslucent
3:
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
4:
self.navigationController?.navigationBar.backgroundColor = UIColor.clear()
I have read many posts with variations of the above methods and have tried most of them but to no avail. I thought the point of setting isTranslucent = true was to get exactly that effect. Is there something else I should be trying? Basically I just want my navigationBar to be slightly see-through.
UIVisualEffectView is what you are looking for, and well demonstrated here:
let bounds = self.navigationController?.navigationBar.bounds as CGRect!
let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light))
visualEffectView.frame = bounds
self.navigationController?.navigationBar.addSubview(visualEffectView)
That said, use your method 1 and 2 together should also work:
self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.topItem.title = #"Contacts";
self.navigationController.navigationBar.barStyle = UIBarStyleBlack;
Here you can add this code for your navigation bar blur effect this function is perfect for you
func navigationBlurEffect() {
// Add blur view
let bounds = self.navigationController?.navigationBar.bounds as CGRect!
let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light))
visualEffectView.frame = bounds
visualEffectView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
//here you can choose one
self.navigationController?.navigationBar.addSubview(visualEffectView)
// Or
/*
If you find that after adding blur effect on navigationBar, navigation buttons are not visible then add below line after adding blurView code.
*/
self.navigationController?.navigationBar.sendSubviewToBack(visualEffectView)
// Here you can add visual effects to any UIView control.
// Replace custom view with navigation bar in above code to add effects to custom view.
}
//**This is only for Image Blur code
And this code you can use for Image Blur effect
func getImageBlur(image:UIImageView){
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Light)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = (image.bounds)
blurEffectView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
image.addSubview(blurEffectView)
}
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = (self.navigationController?.navigationBar.bounds)!
self.navigationController?.navigationBar.addSubview(blurEffectView)