Ajout d'un UIVisualEffectView au bouton

Question

J'ai un transparent supprimer UIButton ajouté à une scène de story-board, qui a une image comme arrière-plan, et j'ai ajouté quelques contraintes de mise en page automatique. Je voulais que l'arrière-plan du bouton soit UIVisualEffectView, donc je pensais à ajouter la vue à l'endroit où se trouve le bouton, puis à enlever le bouton et à le rajouter afin qu'il soit au-dessus du UIVisualEffectView. Question 1) est-ce une bonne idée - ou devrais-je trouver la position dans la hiérarchie de la vue et le placer à un niveau avant le bouton?

Voici ce que j'ai jusqu'ici. pour le UIButton:

@IBOutlet weak var delete: UIButton! { 
    didSet { 
     let borderAlpha = CGFloat(0.7) 
     let cornerRadius = CGFloat(5.0) 
     delete.setTitle("Delete", forState: UIControlState.Normal) 
     delete.setTitleColor(UIColor.redColor(), forState: UIControlState.Normal) 
     delete.backgroundColor = UIColor.clearColor() 
     delete.layer.borderWidth = 1.0 
     delete.layer.borderColor = UIColor(white: 1.0, alpha: borderAlpha).CGColor 
     delete.layer.cornerRadius = cornerRadius 
    } 
} 

et pour la UIVisualEffectView:

override func viewDidLoad() { 
    super.viewDidLoad() 

    let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light)) 
    visualEffectView.frame = delete.frame 
    visualEffectView.bounds = delete.bounds 
    view.addSubview(visualEffectView) 
} 

ce produit une vue floue, la même taille que le bouton, mais pas au-dessus du bouton. Question 2) Est-ce que je dois aussi réussir les contraintes de mise en page automatique?

merci d'avance pour toute aide.

Answer 1

Voici un exemple simple que vous pourriez utiliser pour insérer UIVisualEffectView avec effet de vibration.

let button = UIButton(frame: CGRect(x: 0, y: 0, width: 500, height: 100)) 
button.setTitle("Visual Effect", forState: .Normal) 

let gradientLayer = CAGradientLayer() 
gradientLayer.colors = [UIColor.blueColor().CGColor, UIColor.redColor().CGColor, UIColor.brownColor().CGColor, UIColor.greenColor().CGColor, UIColor.magentaColor().CGColor, UIColor.purpleColor().CGColor, UIColor.cyanColor().CGColor] 
gradientLayer.locations = [0.125, 0.25, 0.375, 0.5, 0.625, 0.75, 0.875, 1] 
button.layer.insertSublayer(gradientLayer, atIndex: 0) 
gradientLayer.frame = button.bounds 

let containerEffect = UIBlurEffect(style: .Dark) 
let containerView = UIVisualEffectView(effect: containerEffect) 
containerView.frame = button.bounds 

containerView.userInteractionEnabled = false // Edit: so that subview simply passes the event through to the button 

button.insertSubview(containerView, belowSubview: button.titleLabel!) 
button.titleLabel?.font = UIFont.boldSystemFontOfSize(30) 

let vibrancy = UIVibrancyEffect(forBlurEffect: containerEffect) 
let vibrancyView = UIVisualEffectView(effect: vibrancy) 
vibrancyView.frame = containerView.bounds 
containerView.contentView.addSubview(vibrancyView) 

vibrancyView.contentView.addSubview(button.titleLabel!) 

Et, voici ce que je l'ai fait,

• Créer un bouton.
• Créez un calque de dégradé et ajoutez-le à l'index 0 du bouton.
• Créer une vue de conteneur avec effet de UIBlurEffectDark.
• Ajoutez la vue conteneur au bouton.
• Créez une vue dynamique avec le même effet et ajoutez-la au contentView du containerView ci-dessus.
• Déplacer l'étiquette du bouton pour le titre de vue de vibrance

Et, voici le résultat final. Le texte titleLabel se marie bien avec le dynamisme et l'effet appliqué.