Principes de base de l’interaction utilisateurFlash Player 9 et ultérieur, Adobe AIR 1.0 et ultérieur Votre application prend en charge l’interactivité en utilisant ActionScript 3.0 pour réagir à une action utilisateur. Cette section suppose que vous maîtrisez le modèle d’événement d’ActionScript 3.0. Pour plus d’informations, voir Gestion des événements. Capture des données saisies par l’utilisateurL’interaction utilisateur, au moyen du clavier, de la souris, de la caméra ou d’une combinaison de ces périphériques, est à la base de l’interactivité. Dans ActionScript 3.0, l’identification et la réponse à l’interaction utilisateur impliquent principalement l’écoute d’événements. La classe InteractiveObject, une sous-classe de la classe DisplayObject, fournit la structure d’événements courante et la fonctionnalité nécessaire à la gestion de l’interaction utilisateur. Vous ne créez pas directement une occurrence de la classe InteractiveObject. Affichez plutôt des objets tels SimpleButton, Sprite, TextField et ainsi des composants divers de l’outil de programmation Flash et de Flex héritent leur modèle d’interaction utilisateur à partir de cette classe. Ils partagent alors une structure commune. Cela signifie que les techniques que vous apprenez et le code que vous écrivez pour gérer l’interaction utilisateur dans un objet dérivé de InteractiveObject sont applicables à tous les autres. Concepts importants et terminologieIl est important que vous vous familiarisiez avec les termes d’interaction utilisateur suivants avant de poursuivre :
Gestion du focusUn objet interactif peut recevoir le focus, soit par programmation, soit par le biais d’une action utilisateur. En outre, si la propriété tabEnabled a la valeur true, l’utilisateur peut transmettre le focus d’un objet à un autre en appuyant sur la touche Tabulation. La valeur tabEnabled est false par défaut, excepté dans les cas suivants :
Dans chacune de ces situations, vous pouvez ajouter un écouteur pour FocusEvent.FOCUS_IN ou FocusEvent.FOCUS_OUT pour étendre les comportements possibles lors du changement de focus. Si cette technique est pratique pour les champs texte et les formulaires, vous pouvez aussi l’utiliser avec les sprites, les clips et tout autre objet qui hérite de la classe InteractiveObject. L’exemple suivant montre comment activer le changement de focus avec la touche de tabulation et comment répondre à l’événement focus qui en découle. Dans ce cas, chaque carré change de couleur lorsqu’il reçoit le focus. Remarque : Flash Professional utilise des raccourcis clavier pour gérer le focus. Par conséquent, pour simuler correctement la gestion du focus, les fichiers SWF doivent être testés dans un navigateur ou dans AIR plutôt que dans Flash.
var rows:uint = 10; var cols:uint = 10; var rowSpacing:uint = 25; var colSpacing:uint = 25; var i:uint; var j:uint; for (i = 0; i < rows; i++) { for (j = 0; j < cols; j++) { createSquare(j * colSpacing, i * rowSpacing, (i * cols) + j); } } function createSquare(startX:Number, startY:Number, tabNumber:uint):void { var square:Sprite = new Sprite(); square.graphics.beginFill(0x000000); square.graphics.drawRect(0, 0, colSpacing, rowSpacing); square.graphics.endFill(); square.x = startX; square.y = startY; square.tabEnabled = true; square.tabIndex = tabNumber; square.addEventListener(FocusEvent.FOCUS_IN, changeColor); addChild(square); } function changeColor(event:FocusEvent):void { event.target.transform.colorTransform = getRandomColor(); } function getRandomColor():ColorTransform { // Generate random values for the red, green, and blue color channels. var red:Number = (Math.random() * 512) - 255; var green:Number = (Math.random() * 512) - 255; var blue:Number = (Math.random() * 512) - 255; // Create and return a ColorTransform object with the random colors. return new ColorTransform(1, 1, 1, 1, red, green, blue, 0); } Découverte des types de saisieLes versions de Flash Player 10.1 et d’Adobe AIR 2 ont introduit la capacité de tester l’environnement d’exécution pour vérifier s’il prend en charge des types de saisie donnés. ActionScript permet de tester si le périphérique sur lequel le moteur d’exécution est actuellement déployé :
Les API de découverte de la saisie d’ActionScript sont les suivantes :
Les API de découverte de saisie permettent d’exploiter les capacités du périphérique de l’utilisateur ou proposent une autre solution lorsque ces capacités n’existent pas. Ces API s’avèrent particulièrement utiles pour développer des applications tactiles et mobiles. Ainsi, si l’interface d’un périphérique mobile possède des boutons de petite taille adaptés à un stylet, vous pouvez proposer une autre interface dotée de boutons de taille supérieure que l’utilisateur peut toucher du doigt. Le code suivant se rapporte à une application dont la fonction createStylusUI() affecte un jeu d’éléments d’interface utilisateur adaptés à l’interaction avec un stylet. Une autre fonction, appelée createTouchUI(), affecte un autre jeu d’éléments d’interface utilisateur adaptés à l’interaction tactile : if(Capabilities.touchscreenType == TouchscreenType.STYLUS ){ //Construct the user interface using small buttons for a stylus //and allow more screen space for other visual content createStylusUI(); } else if(Capabilities.touchscreenType = TouchscreenType.FINGER){ //Construct the user interface using larger buttons //to capture a larger point of contact with the device createTouchUI(); } Lorsque vous développez des applications destinées à des environnements de saisie différents, tenez compte du tableau de compatibilité suivant :
Remarque : diverses plates-formes gèrent un grand nombre de combinaisons de types de saisie. Référez-vous à ce tableau à titre de référence.
|
|