Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make translucent to UIView in iOS7

In navigation bar, i can make translucent navigation bar style. But i can not make in UIView like that. How can I make translucent style in UIView?

like image 223
SukruK Avatar asked Nov 19 '13 14:11

SukruK


2 Answers

A hack would be using a UIToolBar just like you would use a normal UIView, since in iOS 7 it does the blur for you, better than any other attempts of a blur effect custom UIView. (This will only work in iOS7, for iOS 6 just add a normal alpha)

 UIToolbar *toolBar = [[UIToolBar alloc] init];
 [toolBar setFrame:kYourFrame];
 if (floor(NSFoundationVersionNumber) <= NSFoundationVersionNumber_iOS_6_1) {
      [toolBar setAlpha:0.9];
 }
 [self.view addSubview:toolBar]; 
like image 61
Durican Radu Avatar answered Oct 16 '22 22:10

Durican Radu


Solution in Swift, compatible with Interface Builder

Create a file named BlurView.swift in your Xcode project :

import UIKit
@IBDesignable class BlurView : UIView {
    // Use the following property to set the tintColor. Set it to nil to reset.
    @IBInspectable var blurTintColor: UIColor! {
        set {
            toolbar.barTintColor = blurTintColor
        }
        get {
            return toolbar.barTintColor
        }
    }
    lazy var toolbar:UIToolbar = {
        // If we don't clip to bounds the toolbar draws a thin shadow on top
        self.clipsToBounds = true
        
        let toolbar = UIToolbar(frame: self.bounds)
        toolbar.translatesAutoresizingMaskIntoConstraints = false
        self.insertSubview(toolbar, atIndex: 0)
        let views = ["toolbar": toolbar]
        self.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[toolbar]|", options: [], metrics: nil, views: views))
        self.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[toolbar]|", options: [], metrics: nil, views: views))
        
        return toolbar
    }()
}

Then you can use it programmatically or directly in IB.


Programmatically

Create and use a BlurView the same way you use any UIVIew.

var myView:BlurView // ...

// Activate the translucent effect by setting `blurTintColor`
myView.blurTintColor = UIColor.redColor() // Or any color
// If you need to desactivate the effect later
// myView.blurTintColor = nil

##With Interface Builder Add a UIView and set its custom view to BlurView :
enter image description here
Then you can set the Blur Tint Color to activate the translucent effect :
enter image description here
Note: the blur will only appear at runtime.

##Result

BlurView

Inspired by https://github.com/JagCesar/iOS-blur

like image 28
Axel Guilmin Avatar answered Oct 16 '22 22:10

Axel Guilmin