Diaporama

On souhaite réaliser un diaporama avec effets graphiques. L’effet de base est illustré dans la vidéo suivante : exemple. La réalisation est en deux parties :

  1. réaliser une composition Quartz permettant d’animer l’affichage d’un ensemble d’images
  2. intégrer et piloter cette composition depuis une application MacOSX

Première partie : Quartz

Une animation d’image simple comme dans cette vidéo.

  1. Lancer Quartz Composer et créer une composition vierge. Modifier la couleur du fond de la composition en modifiant les paramètres du patch Clear.
  2. Dans un premier temps on essaie d’afficher une simple image. Pour cela dans la bibliothèque rechercher « image » et retrouver un patch adéquat permettant de charger une image.
  3. Dans les patchs de type Render trouver un patch permettant de prendre en entrée une image affin de l’afficher. Connecter vos patchs de sorte que l’image chargée soit affichée.
  4. Modifier les paramètres du patch de visualisation afin d’observer l’usage de chacun d’entre eux. Si le patch ne permet pas de faire tourner l’image autour d’un axe vertical, c’est que ce n’est pas le bon patch…
  5. À l’aide d’un patch Interpolation animer l’image de sorte qu’elle tourne autour de son axe vertical sans discontinuer (le tout avec une vitesse raisonnable).
  6. Rechercher le patch Gradient l’ajouter à la composition. Normalement les affichages précédents disparaissent… Dans chaque patch de rendering (patchs bleus) modifier le numéro d’ordre situé en haut à droite qui permet d’indiquer l’ordre d’affichage des patchs… Trouver un ordre correct permettant d’afficher votre image qui tourne sur un fond dégradé (peut importe les couleurs du dégradé).
  7. Sauver la composition pour la garder bien au chaud.

Seconde partie : Quartz — le retour

Une animation contrôlée par le temps voir : vidéo

  1. Reprendre la composition précédente. Remplacer le patch Interpolation par un Patch Time et utiliser un patch Mathematical Expression de sorte que l’image tourne sur elle-même à la fréquence d’un tour par seconde.
  2. Dupliquer ce qui est nécessaire de sorte que l’on fasse tourner une seconde image en même temps que la première.
  3. Ajouter les patchs mathématiques nécessaires de sorte que pour les tours paris la première image soit affichée et l’autre pour les tours impairs. Pour cela utiliser l’entrée Enable
  4. Ajouter un paramètre (une expression mathématique) permettant de régler la vitesse de rotation. 1 – un tour/sec., 2 – un tour/2sec., etc.

Troisième partie : Quartz — le retour de la vengeance qui tue

Cette fois on cherche à charger une image différente en fonction du temps. Trois images sont disponibles i0.pngi1.pngi2.png.

  1. Modifier le chargeur d’image (en trouver un autre) permettant de charger une image depuis un URL.
  2. Introduire des patchs de sorte que l’un d’entre eux soit le numéro d’une des trois images, la composition devant simplement charger l’image de numéro donné.

Quatrième partie : Arnold Quartzenegger is back

Optimiser afin d’éviter le chargement incessant d’images… Utiliser les itérations…