Ceux qui ont déjà ouvert des programme comme Flash ou Adobe Premiere (ou n'importe quel autre programme de montage) ne seront pas trop dépaysés en ouvrant Director.

L'interface contient les éléments suivant :
- Une scène (stage en anglais) qui sert à visualiser le travail encours
- Une ligne du temps (timeline) constituée de sprites (couches) et de frames (images)
- Une distribution (cast en anglais) qui contient tous les acteurs (members en anglais) qui sont les fichiers importés.
- Une barre d'outils
- Une barre de propriétés

Ainsi, Director porte bien son nom puisque nous plaçons des acteurs sur la scène, qui évolueront dans le temps.

Parmis tous les types d'acteurs possibles, il existe les scripts. Ce sont ces derniers qui contiennent les instructions de programmation.
Il en existe 3 types :
- scripts d'animation (movie) qui affectent toute l'application
- scripts de comportement (behavior) qui affectent un sprite
- scripts parent, qui ne sont utilisés qu'en programmation complexe (POO)

Pour spécifier le type d'un script, il suffit de modifier la valeur dans le panneau de propriétés (à droite). Ceci modifiera visuellement l'icone attribuée au script.
Il est très important de bien définir le type de script, car il détermine les évènements Director disponibles.

Director peut donc s'utiliser de plusieurs manières que je vais citer avant de développer :
- de manière très simple, en plaçant les éléments sur la timeline, avec très peu de code
- toujours en utilisant la timeline, mais en programmant certains comportements
- n'utilisant plus de timeline, en programmant le tout
- en programmant le tout, en utilisant la POO (programmation orientée objet)

Pour ce tutorial, je vais prendre comme exemple une scène avec un bouton et un texte. Et lorsque l'utilisateur clique sur le bouton, l'opacité du texte changera (passera de 100 à 10 pourcents).

Bien, nous commençons. La scène est encore vide mais vous avez déjà créé ou importé un bouton (que nous nommerons “bouton_btn”) et un texte (que nous nommerons “texte_txt”).

Pour placer le bouton sur la timeline, il suffit de faire un drag&drop.
Placez le sur le sprite 1, en commençant à la frame 1, puis ajustez la longueur (drag&drop sur la dernière image du sprite) pour que la dernière image soit à 50.
Faites ensuite de même pour le texte, mais sur le deuxième sprite.

Les éléments sont placés, mais rien ne se passe encore, il nous reste à préparer le changement d'opacité.
Faites un clic droit sur le sprite 2 (contenant notre texte) à la frame 25 et cliquez sur “Insérez une image clés”, puis refaites l'opération à la frame 50.
Vous remarquerez que vous avez créé des petits ronds sur ces images.
Cliquez sur le petit rond à la frame 50, puis dans l'inspecteur de propriétés modifiez le pourcentage d'opacité de l'encre (que vous pouvez laisser en copy) pour l'amener à 10.

Si vous appuyez sur play, vous verrez que l'animation tourne en boucle. C'est normal, il manque les stop. Nous allons programmer un script de comportement que nous appelerons “stop”.
Cliquez sur l'avant dernière icone du menu supérieur “Fenêtre de script” et écrivez le code suivant :

on exitframe me
   go to the frame
end

Ce qui signifie “lorsque je quitte cette frame, je reviens dessus”…

Placez ensuite ce script de comportement (vérifiez bien qu'il est défini comme tel dans l'inspecteur de propriétés) sur la timeline, sur le sprite 0 (sprite réservé au code seul) à la frame 25 et 50.

Relancez l'application, la tête de lecture s'arrête bien à la frame 25, il ne reste plus qu'à coder le bouton.

Créez un nouveau script de comportement appelé “bouton_script” et qui contiendra le code suivant :

on mouseup me
  -- Envois la tête de lecture à la frame 26 --
  go to frame(26)
end

Placez ensuite ce script sur le sprite 1 (contenant notre bouton).

Désormais, l'application fonctionne correctement ; lorsque l'on clique sur le bouton, le texte disparait peu à peu.

Vous venez donc de créer votre première application Director !
En utilisant plusieurs “go to frame()” à diverses endroit vous pourrez déjà créer facilement des présentations interactives.

Note : Il est tout à fait possible d'utiliser Director sans écrire de script et programmer.
En effet, il existe également de nombreux comportements pré-existants dans Director, utilisables à partir de la bibliothèque.
Nous aurions donc pu réaliser cet exemple sans devoir programmer le “stop” et le “go to”.

Repartez d'un fichier vierge contenant uniquement votre bouton, votre texte et un script stop.

Préparez votre scène en plaçant à nouveau le bouton en sprite 1 de la frame 1 à 50, le texte sur le sprite 2 de la frame 1 à 50 et le stop à la frame 50 (le nombre de frame n'a aucune importance, mais nous resterons cohérents et visuels en utilisant ce chiffre).

Nous allons ensuite programmer le comportement de notre texte, appelé “texte_script”, comme ceci :

property pActivated
 
on beginsprite me
  -- initialise la variable de propriété pActivated --
  pActivated = false
end
 
on changeStatut me
 
  -- change le statut de la variable de propriété pActivated --
 
  if pActivated = true then
    pActivated = false
  else
    pActivated = true
  end if
 
end
 
on exitframe me
 
  -- Boucle d'animation --
 
  if pActivated = true then
 
    if sprite(me.spritenum).blend > 10 then
      -- tant que l'opacité est plus élevée que 10, on la diminue --
      sprite(me.spritenum).blend = sprite(me.spritenum).blend - 5
    end if
 
  else
 
    if sprite(me.spritenum).blend < 100 then
      -- tant que l'opacité est plus petite que 100, on l'augmente --
      sprite(me.spritenum).blend = sprite(me.spritenum).blend + 5
    end if
 
  end if
 
end

Reste à programmer le script du bouton, toujours appelé “bouton_script”, pour qu'il appelle la fonction “changeStatut” :

on mouseup me
  sendSprite(2, #changeStatut)
end

Voilà, le tout fonctionne correctement, et ce dans les deux sens !
En effet, puisque nous avons programmé un simple changement de statut, il était assez simple de gérer l'apparition/disparition du texte avec le même bouton.

Tout ce que nous allons faire dans cette exemple, c'est tout retirer de la timeline (sauf le stop) et remplacer cette phase manuelle par de la programmation.

Pour ce faire nous allons utiliser un script de movie, appelé “global” que nous allons compléter comme ceci :

global gTexteSprite
 
on startmovie
 
  -- place le bouton --
  tSp = findEmptyChannel(1)  
  channel(tSp).makescriptedsprite(member("bouton_btn"), point(320,160))
  -- place le script sur le bouton --
  tScript = script("bouton_script").new()
  sprite(tSp).scriptInstanceList.add(tScript)
 
  -- place le texte --
  tSp = findEmptyChannel(tSp)
  channel(tSp).makescriptedsprite(member("text_txt"), point(62,231))
  -- place le script sur le texte --
  tScript = script("texte_script").new()
  sprite(tSp).scriptInstanceList.add(tScript)  
 
  -- Retiens le numéro du sprite du texte dans une variable globale --
  gTexteSprite = tSp
 
end
 
on findEmptyChannel tStart
 
  -- Fonction trouve le premier sprite vide et retourne sa valeur --
 
  tSprite = 0
 
  repeat with i = tStart to 150
 
    if sprite(i).membernum = 0 then
      if sprite(i).puppet = false then
 
        tSprite = i
        exit repeat
 
      end if
    end if
 
  end repeat
 
  return tSprite
 
end

Et pour enfin pouvoir se détacher complètement de la gestion des sprites, nous devons modifier le bouton_script comme ceci :

global gTexteSprite
 
on mouseup me
  -- utilisation de la variable globale plutôt qu'un integer fixe --
  sendSprite(gTexteSprite, #changeStatut)
end

Voilà, votre application fonctionne, et vous n'avez plus à gérer vous même les sprites. Ceci peut s'avérer très pratique lors de programmes complexes qui créent et effacent de nombreux sprites à la volée.

La POO est une programmation particulière, je vous invite à parcourir les tutoriaux dédiés uniquement à ce sujet.

Pour cette exemple, nous aurions probablement créé un objet “texte” et un objet “bouton” que nous aurions pu faire interagir entre eux utilisant des assesseurs et des mutateurs.

Sources MX2004