Efecto flip con una carta

Buenas.
Estoy usando Flash Builder 4.6 (Flex).

Me gustaría hacer el efecto flip vertical de una carta. Es decir, tendría una carta que no es visible, se vería la imagen trasera de la carta y cuando hagamos click sobre ella se daría la vuelta durante x segundos y luego se volvería de nuevo a la posición original.

¿Alguien sabe como hacerlo? He estado buscando pero no he sacado nada en claro.

Saludos

La forma mas simple es por animación en línea de tiempo usando un skew, una mitad es siempre la misma, la otra varía con la carta. Eso lo armas en Flah y luego te traes los SWF a Flex. La forma mas complicada es usar alguna librería 3D en las cuales apliques las texturas para luego usar rotación.

Jorge

solisarg escribió:

Jorge, es que no tengo ni idea de usar Flash. ¿Algún ejemplo simple? De todas formas, era para intentar luego más adelante un juego en el que habría muchas cartas y no tengo claro si me serviría o no.

He encontrado este otro link. He conseguido compilar perfecto incluyendo una librería en la que supuestamente incluye import fl.transitions.easing.*; etc pero aún así no aparece nada en pantalla.

El código completo de mi aplicación es el siguiente:

Código Flex :

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
            xmlns:s="library://ns.adobe.com/flex/spark" 
            xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
            creationComplete="init()">
   
   <fx:Script>
      <![CDATA[
         import fl.transitions.easing.*;
         import flashandmath.as3.TweenFlipCS4;
         
         public var card1:TweenFlipCS4;
         public var card2:TweenFlipCS4;
      
      private function init():void {
         
         card1 = new TweenFlipCS4("assets/pics/bkimage.jpg","assets/pics/bkcard.jpg","horizontal");
         this.addChild(card1);
         setCardsPosAndProps();
      }
      
      private function setCardsPosAndProps():void {
            card1.x=25;
            card1.y=85;
            card1.setURL("http://www.math.uri.edu/~bkaskosz/");
            card1.setFunc(Back.easeOut);
            card1.setSpeed(1.5);
      }      
      ]]>
   </fx:Script>
            
</s:Application>

Cuando ejecuto no se muestra nada en pantalla pero sin embargo cuando hago el debug obtengo este error
Error: addChild() is not available in this class. Instead, use addElement() or modify the skin, if you have one.
at spark.components.supportClasses::SkinnableComponent/addChild()[E:\dev\4.y\frameworks\projects\spark\src\spark\components\supportClasses\SkinnableComponent.as:1123]
at xx/init()[C:\Users\ec4410\Adobe Flash Builder 4.6\xx\src\xx.mxml:18]
at xx/___xx_Application1_creationComplete()[C:\Users\ec4410\Adobe Flash Builder 4.6\xx\src\xx.mxml:5]
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at mx.core::UIComponent/dispatchEvent()[E:\dev\4.y\frameworks\projects\framework\src\mx\core\UIComponent.as:13152]
at mx.core::UIComponent/set initialized()[E:\dev\4.y\frameworks\projects\framework\src\mx\core\UIComponent.as:1818]
at mx.managers::LayoutManager/doPhasedInstantiation()[E:\dev\4.y\frameworks\projects\framework\src\mx\managers\LayoutManager.as:842]
at mx.managers::LayoutManager/doPhasedInstantiationCallback()[E:\dev\4.y\frameworks\projects\framework\src\mx\managers\LayoutManager.as:1180]


¿Alguna idea de como usar esta clase? La verdad es que esté muy gracioso el ejemplo de este link que os he dejado.

Saludos

El error te lo dice. Donde pones

this.addChild(card1);

usa

this.addElement(card1);

Y mira si tienes uevos errores

Jorge

Gracias Jorge por tus respuestas.

Eso lo probé ayer y entonces ya no dejaba ni compilar ya que aparecía el aspita roja de error indicando que:
1067: Implicit coercion of a value of type flashandmath.as3:TweenFlipCS4 to an unrelated type mx.core:IVisualElement.

El caso es que ayer ya estaba espeso pero hoy gracias a tu respuesta he empezado a googlear, jeje.

Al final en este link de Adobe he hallado la solución.

Se trata de meter un elemento s:SpriteVisualElement asignándole un id (por ejemplo mySprite) para luego asignar lo siguiente:

Código Flex :

mySprite.addChild(card1);

Me ha funcionado correctamente.

Muchísimas gracias.