Comunidad de diseño web y desarrollo en internet online

Efectos en componentes heredados [Flex]

Citar            
MensajeEscrito el 20 Dic 2008 04:16 pm
Buenas! Tengo un problemilla con un tema de efectos del Flex. Veréis: tengo varios componentes que heredan de canvas:
  1. Unos cuantos contenedores, a los que llamo ColumnaPissarraComponent (está en catalán :cool:).
  2. Unos cuantos items, a los que llamo PostItComponent.

Los postits son algo más densos, pero la parte xml de los contenedores es básicamente ésta:

Código Flex :

<?xml version="1.0" encoding="utf-8"?>
<ColumnaPissarra
   xmlns="pg.*"
   xmlns:mx="http://www.adobe.com/2006/mxml"
   width="100%" height="100%" 
   dragComplete="dragCompleteHandler(event);"
   dragOver="dragOverHandler(event);"
   dragEnter="dragEnterHandler(event);"
   dragDrop="dragDropHandler(event);"
   backgroundColor="#FFFFFF" backgroundAlpha="0.0">
   <mx:Script source="pg/DnDLib.as"/>
</ColumnaPissarra>

Como veis toma una clase de Actionscript, pero es bastante tonta:

Código Flex :

package pg
{
   import mx.containers.Canvas;

   public class ColumnaPissarra extends Canvas
   {
      public function ColumnaPissarra()
      {
         super();
      }
      
   }
}

Simplemente he hecho un componente igual al canvas, pero que tiene "de serie" unos comportamientos drag and drop, y ya adaptado para que funcionen (fondo de un color, y alfa al 0). Luego de esto, PostIt es:

Código Flex :

<?xml version="1.0" encoding="utf-8"?>
<PostIt
   xmlns:mx="http://www.adobe.com/2006/mxml"
   width="100" height="80"
   xmlns="pg.*"
   mouseMove="mouseOverHandler(event);"
   moveEffect="brillaPostit()">
//Aquí van los demás componentes del Postit
</PostIt>

Y brillaPostit() es ésto:

Código Flex :

private function brillaPostit():Effect
{
   var brillar:Glow = new Glow();
   brillar.blurXFrom = 0;
   brillar.blurXTo = 25;
   brillar.blurYFrom = 0;
   brillar.blurYTo = 25;
   brillar.color = 0xfde716;
   brillar.duration = 800;
   return brillar;
}

La interacción entre un componente y otro es la siguiente:
El stage tiene varias ColumnaPissarra, y éstas en su interior contienen Postits, que puedes arrastrar de una Columna a otra. Al mover un Postit, éste brilla ligeramente.

Después de la puesta en materia, os comento el problema:
Antes de convertir el canvas en concreto a un componente ColumnaPissarra que heredase de él, cuando movía los Postits (de eso ya me encargo yo, ya funcionan a la perfección), el componente Postit brillaba perfectamente. No obstante, y para ahorrarme pasos, hice este nuevo componente contenedor. El problema es que ahora ya no brilla el Postit al moverlo. Desde luego, ningún efecto funciona (he probado blur, move, fade y ya he desistido). Vamos, que el tema es que en Canvas funciona, pero en un componente heredado de Canvas ya no. ¿Sabéis qué puede ser?

PD: otra cosa que también enlaza con el tema de los contenedores... Me habría gustado que se pudiera ver el movimiento de una columna a otra, pero como en el drag and drop hago algo un poco "pescao" (cuando muevo de un lado a otro, clono el Postit, lo borro de una columna y lo posiciono en otra), el movimiento siempre parte de la x-y correcta, peeeero de la Columna de destino. no sé si me expliqué bien, pero no es de vital importancia este aspecto.

Gracias antemano clabers!

Por Kor

8 de clabLevel



 

firefox
Citar            
MensajeEscrito el 21 Dic 2008 09:34 pm
Vale, admito que me extendí mucho demasiado la ostia ligeramente y puede dar palo leerlo todo todo xD, así que voy a resumir con una frase:

¿Los efectos que funcionaban bien dentro de un Canvas, deben seguir funcionando igual en un componente heredado de Canvas?

PD: responder "Sí" es eficaz, pero desalentador.
PD: gracias xD!

Por Kor

8 de clabLevel



 

firefox
Citar            
MensajeEscrito el 22 Dic 2008 06:10 pm
Quita el tag moveEffect de tu componente y trata así

Código ActionScript :

private function brillaPostit():Effect 
{ 
   var brillar:Glow = new Glow(); 
   brillar.blurXFrom = 0; 
   brillar.blurXTo = 25; 
   brillar.blurYFrom = 0; 
   brillar.blurYTo = 25; 
   brillar.color = 0xfde716; 
   brillar.duration = 800; 
   this.setStyle("moveEffect", brillar)
}


Para crear tu propio efecto deberías un factory y una instancia a través del factory sobreescribiendo una serie de métodos

Jorge

Por solisarg

BOFH

13451 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 22 Dic 2008 07:11 pm
Vaya, no había planteado esa solución, pero muchas gracias :D . El caso... es que era una señora estupidez, y probablemente de tu forma se soluciona el problema de raiz, pero lo escribo por si acaso:

En el código, puse esto:

Código Flex :

moveEffect="brillaPostit()">

Pero tenía que ser así:

Código Flex :

moveEffect="{brillaPostit()}">

Esas malditas llaves, menudo desliz más invisible (y con Canvas sí funcionaba). Bueno, muchas gracias! ^o^

Por Kor

8 de clabLevel



 

firefox

   Página 1 de 1

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.