| Package | spark.effects |
| Classe | public class AnimateTransitionShader |
| Héritage | AnimateTransitionShader  Animate Effect EventDispatcher Object |
| Sous-classes | CrossFade, Wipe |
| Version du langage: | ActionScript 3.0 |
| Version du produit: | Flex 4 |
| Versions du moteur d’exécution: | Flash Player 10, AIR 1.5 |
 | L’effet AnimateShaderTransition utilise Pixel Bender, qui n’est pas pris en charge par les applications mobile AIR. |
L’effet AnimateShaderTransition anime une transition entre deux images bitmap, l’une d’entre elles représentant l’état de début (
bitmapFrom), l’autre l’état de fin (bitmapTo).
L’animation est réalisée en exécutant un programme pixel shader, spécifié par la propriété shader, et en utilisant comme entrée les deux images bitmap. Les images bitmap sont représentées par une instance de la classe flash.display.BitmapData. Vous pouvez créer votre propre programme pixel shader à l’aide d’Adobe Pixel Bender Toolkit.
Si l’une des deux images bitmap n’est pas fournie, cette valeur est déterminée de façon dynamique, soit à partir de l’état approprié de la cible dans le cas d’une transition, soit directement à partir de la cible si l’effet ne fait pas partie d’une transition. Si l’effet fait partie d’une transition et que l’objet cible disparaît ou apparaît pendant ce changement d’état, une image bitmap entièrement transparente est utilisée pour représenter l’objet manquant.
Cet effet peut uniquement être exécuté sur des cibles de type UIComponent ou GraphicElement, car l’acquisition de l’image bitmap de l’objet nécessite de disposer d’informations sur l’objet qui sont présentes uniquement dans ces classes.
Comme l’effet s’appuie sur des images bitmap et que le programme pixel shader sous-jacent suppose que la taille des deux images est identique, l’effet fonctionne correctement uniquement si les deux images bitmap sont de la même taille. Par conséquent, si l’objet cible change de taille ou d’orientation et que cela entraîne une modification de la taille du cadre de sélection, il se peut que l’effet ne soit pas lu correctement.
Cet effet et ses sous-classes diffèrent des autres effets de Flex, dans la mesure où ils sont destinés à fonctionner de façon autonome. Par conséquent, leur résultat est imprévisible s’ils sont exécutés parallèlement à d’autres effets. Cette contrainte est due au fait que les deux images bitmap avant/après sont collectées avant le début de l’effet. Ainsi, si l’objet cible subit une quelconque modification après le calcul de ces images bitmap, par exemple si un autre effet modifie les propriétés de la cible, ces modifications ne sont pas prises en compte dans l’image bitmap précalculée et les résultats sont alors imprévisibles. Pour assurer le bon déroulement de ces effets bitmap, ils doivent être lus de façon exclusive sur leurs objets cible.
Syntaxe MXML
Afficher la syntaxe MXML
Masquer la syntaxe MXMLThe <s:AnimateTransitionShader> tag
inherits all of the tag attributes of its superclass,
and adds the following tag attributes:
<s:AnimateTransitionShader
Properties
id="ID"
bitmapFrom="no default"
bitmapTo="no default"
shaderByteCode="no default"
sahderProperties="no default"
/>
Propriété MXML par défautmotionPaths
Eléments de l’API associés
spark.effects.supportClasses.AnimateTransitionShaderInstance
spark.primitives.supportClasses.GraphicElement
| Propriété | Défini par | ||
|---|---|---|---|
| bitmapFrom : BitmapData
Données bitmap représentant l’état de départ de cet effet. | AnimateTransitionShader | ||
| bitmapTo : BitmapData
Données bitmap représentant l’état de fin de cet effet. | AnimateTransitionShader | ||
 | className : String [lecture seule]
Le nom de la classe d’effet, tel que « Fade ». | Effect | |
| constructor : Object
Référence à l’objet de classe ou à la fonction constructeur d’une occurrence donnée d’un objet. | Object | |
| customFilter : mx.effects:EffectTargetFilter
Spécifie un objet filtre personnalisé, de type EffectTargetFilter, utilisé par l’effet pour déterminer les cibles sur lequel lire l’effet. | Effect | |
| disableLayout : Boolean
Si la valeur est true, l’effet désactive la mise en page des conteneurs parent de ses cibles, définissant la propriété autoLayout des conteneurs sur false, et désactive également toute contrainte de mise en page sur les objets cible. | Animate | |
| duration : Number
Durée de l’effet en millisecondes. | Effect | |
| easer : IEaser
Comportement d’accélération de cet effet. | Animate | |
| effectTargetHost : mx.effects:IEffectTargetHost
Propriété qui permet d’accéder au contrôle à base de liste de la cible d’un effet data. | Effect | |
| filter : String
Spécifie un algorithme de filtrage des cibles d’un effet. | Effect | |
| hideFocusRing : Boolean
Détermine si l’effet doit masquer l’anneau de focus lors du démarrage. | Effect | |
| instanceClass : Class
Objet de type Class qui spécifie la classe de l’instance d’effet de cette classe d’effets. | Effect | |
| interpolator : IInterpolator
Interpolateur utilisé par cet effet pour calculer les valeurs situées entre les valeurs de début et de fin d’une propriété. | Animate | |
| isPlaying : Boolean [lecture seule]
Indicateur de lecture seule défini sur true si les instances de l’effet sont en cours de lecture et sur false si aucune instance n’est définie. | Effect | |
| motionPaths : Vector.<MotionPath>
Un vecteur d’objets MotionPath contenant chacun le nom d’une propriété animée et les valeurs prises par la propriété au cours de l’animation. | Animate | |
| perElementOffset : Number
Autre délai, en millisecondes, pour les cibles d’effet suivant la première cible de l’effet. | Effect | |
| playheadTime : Number
Temps de position actuelle de l’effet. | Effect | |
| relevantProperties : Array
Tableau de noms de propriété à utiliser pour effectuer le filtrage. | Effect | |
| relevantStyles : Array
Tableau des noms de style à utiliser pour effectuer le filtrage. | Effect | |
| repeatBehavior : String
Comportement d’un effet répété, c’est-à-dire d’un effet dont la valeur repeatCount est égale à 0 ou supérieure à 1. | Animate | |
| repeatCount : int = 1
Nombre de fois que l’effet doit être répété. | Effect | |
| repeatDelay : int = 0
Intervalle (en millisecondes), qui s’écoule avant de répéter l’effet. | Effect | |
| shaderByteCode : Object
Pseudo-code binaire du programme pixel shader utilisé par l’effet pour réaliser l’animation entre les deux images bitmap. | AnimateTransitionShader | ||
| shaderProperties : Object
Mappage de paires de paramètres nom/valeur transmis au programme pixel shader avant la lecture. | AnimateTransitionShader | ||
| startDelay : int = 0
Intervalle (en millisecondes), qui s’écoule avant de commencer l’effet. | Effect | |
| target : Object
Objet auquel s’applique cet effet. | Effect | |
| targets : Array
Tableau d’objets représentant des cibles de l’effet. | Effect | |
| triggerEvent : Event
Objet Evénement transmis à cet Effet par le gestionnaire EffectManager lorsqu’un effet est déclenché, ou nul si l’effet n’est pas exécuté par le gestionnaire EffectManager. | Effect | |
| Méthode | Défini par | ||
|---|---|---|---|
AnimateTransitionShader(target:Object = null)
Constructeur. | AnimateTransitionShader | ||
| addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void
Enregistre un objet écouteur d’événement auprès d’un objet EventDispatcher afin que l’écouteur soit averti d’un événement. | EventDispatcher | |
|
Capture les valeurs actuelles des propriétés correspondantes sur les cibles de l’effet et les enregistre en tant que valeurs d’arrivée. | Effect | |
|
Capture les valeurs actuelles des propriétés correspondantes d’un autre ensemble de cibles. Flex utilise cette fonction lorsqu’un effet de modifications de données est exécuté.
| Effect | |
|
Capture les valeurs actuelles des propriétés correspondantes sur les cibles de l’effet. | Effect | |
|
Crée une seule instance d’effet et l’initialise. | Effect | |
|
Prend un tableau d’objets cible et invoque la méthode createInstance() sur chaque cible. | Effect | |
|
Supprime les écouteurs d’événement d’une instance et les retire de la liste d’instances. | Effect | |
|
Distribue un événement dans le flux d’événements. | EventDispatcher | |
|
Interrompt un effet en cours de lecture et passe immédiatement à la fin de l’effet. | Effect | |
|
Renvoie un tableau de chaînes, où chaque chaîne correspond au nom d’une propriété modifiée par cet effet. | Effect | |
|
Vérifie si des écouteurs sont enregistrés auprès de l’objet EventDispatcher pour un type spécifique d’événement. | EventDispatcher | |
|
Indique si la propriété spécifiée d’un objet est définie. | Object | |
|
Indique si une occurrence de la classe Object figure dans la chaîne de prototype de l’objet spécifié en tant que paramètre. | Object | |
|
Interrompt momentanément l’effet jusqu’à un appel de la méthode resume(). | Effect | |
|
Commence la lecture de l’effet. | Effect | |
|
Indique si la propriété spécifiée existe et est énumérable. | Object | |
|
Supprime un écouteur de l’objet EventDispatcher. | EventDispatcher | |
|
Reprend l’effet après une interruption demandée par un appel de la méthode pause(). | Effect | |
|
Exécute l’effet en sens inverse, si l’effet est en cours de lecture, à partir de sa position actuelle. | Effect | |
|
Définit la disponibilité d’une propriété dynamique pour les opérations en boucle. | Object | |
|
Arrête l’effet, en laissant les cibles de l’effet dans leur état actuel. | Effect | |
|
Renvoie la représentation de chaîne de cet objet, formatée selon les paramètres régionaux en vigueur. | Object | |
|
Renvoie la représentation sous forme de chaîne de l’objet spécifié. | Object | |
|
Renvoie la valeur primitive de l’objet spécifié. | Object | |
|
Vérifie si un écouteur d’événement est enregistré auprès de cet objet EventDispatcher ou de ses ancêtres pour le type d’événement spécifié. | EventDispatcher | |
bitmapFrom | propriété |
public var bitmapFrom:BitmapData| Version du langage: | ActionScript 3.0 |
| Version du produit: | Flex 4 |
| Versions du moteur d’exécution: | Flash Player 10, AIR 1.5 |
Données bitmap représentant l’état de départ de cet effet. Si cette propriété n’est pas définie, elle est calculée automatiquement lors de la lecture de l’effet, en prenant un instantané de l’objet cible ou en utilisant une image bitmap transparente si l’objet n’existe pas dans l’état d’affichage de départ d’une transition.
bitmapTo | propriété |
public var bitmapTo:BitmapData| Version du langage: | ActionScript 3.0 |
| Version du produit: | Flex 4 |
| Versions du moteur d’exécution: | Flash Player 10, AIR 1.5 |
Données bitmap représentant l’état de fin de cet effet. Si cette propriété n’est pas définie, elle est calculée automatiquement lors de la lecture de l’effet, en prenant un instantané de l’objet cible ou en utilisant une image bitmap transparente si l’objet n’existe pas dans l’état d’affichage de fin d’une transition.
shaderByteCode | propriété |
public var shaderByteCode:Object| Version du langage: | ActionScript 3.0 |
| Version du produit: | Flex 4 |
| Versions du moteur d’exécution: | Flash Player 10, AIR 1.5 |
Pseudo-code binaire du programme de pixel shader utilisé par l’effet pour réaliser l’animation entre les deux images bitmap. Cette propriété peut être représentée par un objet ByteArray ou un objet Class représentant un objet ByteArray (cet objet Class est obtenu lorsque vous imbriquez une ressource).
Le programme pixel shader peut disposer de fonctions et d’entrées arbitraires, mais il doit au minimum posséder trois entrées image4. La première entrée, dont le nom n’a pas d’importance, n’est normalement pas utilisée par le code de votre programme pixel shader : elle sert uniquement à satisfaire la première exigence de Flash, qui nécessite d’affecter un objet filtré à la première entrée. Les entrées qui ne sont pas du tout utilisées dans un programme pixel shader peuvent être optimisées en sortie. Par conséquent, le code doit faire référence au moins une fois à cette entrée.
Au moins deux autres entrées d’images bitmap doivent être définies. Celles-ci doivent être appelées from et to et correspondre respectivement aux images avant et après. Enfin, vous devez définir un paramètre float appelé progress, qui doit contenir la fraction écoulée de l’effet.
Deux paramètres facultatifs peuvent être définis : width et height. Lorsqu’ils sont définis, ils prennent automatiquement les valeurs de largeur et de hauteur de la cible de l’effet.
Pour plus d’informations sur la création de programmes pixel shader pour Flash, voir la documentation de Pixel Bender Toolkit. Le code source du fichier CrossFade.pbk est disponible dans le répertoire frameworks\projects\flex4\src\spark\effects du code source de Flex.
shaderProperties | propriété |
public var shaderProperties:Object| Version du langage: | ActionScript 3.0 |
| Version du produit: | Flex 4 |
| Versions du moteur d’exécution: | Flash Player 10, AIR 1.5 |
Mappage de paires de paramètres nom/valeur transmis au programme pixel shader avant la lecture. Par exemple, pour définir un paramètre appelé direction dans un shader à l’aide d’un fichier Pixel Bender pbj dans Wipe.pbj, le code d’appel peut se présenter comme suit :
[Embed(source="Wipe.pbj", mimeType="application/octet-stream")]
private var WipeCodeClass:Class;
var shaderEffect = new AnimateTransitionShader();
shaderEffect.shaderByteCode = WipeCodeClass;
shaderEffect.shaderProperties = {direction : 1};
AnimateTransitionShader | () | Constructeur |
<?xml version="1.0" encoding="utf-8"?>
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:states>
<s:State name="default"/>
<s:State name="flipped"/>
</s:states>
<s:transitions>
<s:Transition id="t1">
<s:AnimateTransitionShader
target="{holder}"
duration="1000"
shaderByteCode="@Embed(source='assets/twist.pbj', mimeType='application/octet-stream')"/>
</s:Transition>
</s:transitions>
<s:Panel title="AnimateTransitionShader Example"
width="75%" height="75%" horizontalCenter="0" verticalCenter="0">
<s:HGroup width="100%" height="100%" top="5" left="5" right="5">
<s:Group id="holder">
<s:BitmapImage
source="@Embed('assets/back2.png')"
visible="true" visible.flipped="false"/>
<s:BitmapImage
source="@Embed('assets/c2.png')"
visible="false" visible.flipped="true"/>
</s:Group>
<!-- Directions -->
<s:VGroup id="detailsBox"
width="50%"
left="0">
<s:Label
width="99%"
color="blue"
text="AnimateShaderTransition animates a shader between two images. Click the 'Animate Shader' button to see the effect."/>
</s:VGroup>
</s:HGroup>
<s:Rect left="0" right="0" bottom="0" height="30">
<s:fill>
<s:LinearGradient rotation="90">
<s:GradientEntry color="0xE2E2E2" />
<s:GradientEntry color="0xD9D9D9" />
</s:LinearGradient>
</s:fill>
</s:Rect>
<s:Button id="playButton"
left="5" bottom="5"
label="Animate Shader"
click="currentState = (currentState == 'flipped') ? 'default' : 'flipped';"/>
</s:Panel>
</s:Application>
Tue Jun 12 2018, 09:30 AM Z