web-dev-qa-db-fra.com

Comment implémenter des vues d'effets visuels dans Interface Builder?

Comment utilisez-vous les vues d'effets visuels avec flou et dynamisme dans Interface Builder?

J'ai fait glisser cet élément dans la vue, puis j'ai fait glisser un UILabel sur la dernière vue de la hiérarchie - le contentView de l'effet dynamique, je suppose. Il en résulte une vue floue au-dessus, mais aucune étiquette n'est visible. Partout où je place l'étiquette dans la hiérarchie, elle devient visible mais c'est juste du texte noir uni.

enter image description here

37
Jordan H

Enfin compris.

  1. Dans un UIViewController changez l'arrière-plan de la vue en bleu
  2. Faites glisser une vue d'effets visuels avec un objet Flou et Vibration dans la vue, de sorte qu'elle soit ajoutée en tant que sous-vue
  3. Dans la première vue d'effet visuel, définissez des contraintes de disposition automatique sur sa vue contenant: début, fin, haut et bas (pour que l'effet de flou remplisse l'écran).
  4. Développez la vue qui est une sous-vue de la première vue d'effet visuel pour révéler une deuxième vue d'effet visuel
  5. Configurez les contraintes de mise en page automatique pour cette vue d'effet visuel, définissez à nouveau toutes les arêtes sur sa vue contenant pour remplir l'écran - assurez-vous de changer les constantes à 0
  6. Développez la deuxième vue d'effet visuel pour révéler la vue finale
  7. Faites glisser un UILabel dans la scène en tant que sous-vue de la dernière vue
  8. Configurer les contraintes de mise en page automatique pour cette étiquette dans sa vue contenant - peut-être en tête et en haut avec des constantes de 15
  9. Changez la couleur du texte de l'étiquette en blanc pur avec 0,5 alpha
  10. Changez le style en foncé pour les deux vues d'effets visuels dans l'inspecteur d'attributs (juste pour mieux montrer l'effet)
  11. Exécutez l'application sur un appareil prenant en charge l'effet dynamique complet (iPhone 5+, iPad Air +)

Voila!
iPhone 6 screenshot
Et voici à quoi cela ressemble dans Interface Builder:

enter image description here

52
Jordan H