简体   繁体   中英

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?

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 :
在此输入图像描述
Then you can set the Blur Tint Color to activate the translucent effect :
在此输入图像描述
Note: the blur will only appear at runtime.

Result

BlurView

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

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]; 

You can add a blur layer from UIToolBar to the view which you want it to be translucent.

Look at this open source project: https://github.com/JagCesar/iOS-blur

我推荐这个: https//github.com/ivoleko/ILTranslucentView它提供原生iOS 7+模糊(半透明)效果

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM