PDF (adobe.com)

Prototypage d’applications Flex

Le processus de prototypage pour Flex est semblable au flux de production utilisé pour les sites Web et les interfaces logicielles (voir la section Flux de production de prototypage). Avec Fireworks, vous avez la possibilité de faire glisser des composants Flex dans la zone de travail, de spécifier leurs propriétés et d’exporter l’interface utilisateur résultante vers MXML. Vous pouvez ensuite améliorer l’interface utilisateur dans Flex Builder.

1. Création d’une interface utilisateur Flex

A l’aide du panneau Pages, créez le nombre d’écrans d’interface nécessaires à la réalisation de votre projet initial.

2. Insertion de composants de conception Flex dans la disposition

Dans la zone de travail, insérez des composants Flex depuis le dossier Flex dans le panneau Bibliothèque commune. Ces symboles de composant sont spécifiquement utilisés avec l’exportation MXML de façon à obtenir les résultats souhaités. Lors de l’exportation de votre document en tant que MXML, chacun de ces symboles est respectivement converti en la balise MXML qui lui correspond. Les objets qui ne sont pas reconnus comme composants Flex sont exportés en tant que bitmaps, qui sont liés au MXML via une balise <mx:Image> (voir la section Création et utilisation de symboles de composant).
Lors de la modification d’un composant de conception Flex dans Fireworks, vous pouvez copier le code XML modifié dans votre projet Flex. Vous gagnez ainsi du temps si vous souhaitez répliquer le comportement du composant modifié dans votre projet.

Les symboles Curseur, BarreDeDéfilement, Onglet et Info-bulle sont ignorés pendant une sortie MXML étant donné que ces composants ne sont pas directement convertis depuis Fireworks vers MXML. Par exemple, le symbole BarreDeDéfilement s’affiche automatiquement dans les instances du conteneur Flex lorsqu’il est possible de faire défiler leur contenu. Dans Fireworks, ces symboles font simplement office d’indicateurs sur le mode de fonctionnement des parties d’une conception d’interface.

Remarque : les tranches d’image, les survols et les zones sensibles s’appliquent uniquement aux prototypes HTML. Evitez ces objets Web lors de la création de prototypes Flex.

3. Partage de composants Flex communs entre plusieurs pages

Si un composant Flex est commun à plusieurs pages, toute modification met automatiquement à jour toutes les pages (ou écrans) affecté(e)s. Servez-vous d’un gabarit pour partager tous les composants Flex qu’il contient ou partagez les calques pour copier des sous-ensembles des composants (voir les sections Utilisation d’un gabarit et Partage des calques).

4. Spécification de propriétés pour les composants Flex

Dans le panneau Propriétés du symbole (Fenêtre > Propriétés du symbole), spécifiez les propriétés et les événements de chaque composant Flex inséré dans la zone de travail.

5. Exportation de la disposition Flex au format MXML

Exportez la disposition d’interface utilisateur Flex, puis ouvrez le fichier MXML résultant dans Flex. Fireworks exporte le MXML requis tout en conservant le style et le positionnement absolu. Les développeurs Flex peuvent utiliser cette interface sans avoir à recréer la disposition dans Flex.