Flex 2. Ejemplo de menú hecho con Papervision3D 2
15 dic
Cuando pulsamos sobre un cubo la cámara realiza un travelling hacia su cara frontal. Para volver a la vista general pulsa de nuevo sobre la figura.
![]()
Ver ejemplo y descargar código fuente >>
Recuerda que tienes que configurar la ruta de clases para el paquete GreatWhite de Papervision3D. La aplicación utiliza Tweener para hacer el zoomin/zoomout de la cámara.
Flex 2. Efecto gotas de lluvia.
2 dic
En este ejemplo vamos a utilizar el filtro de Flash “ConvolutionFilter” para simular gotas de lluvia cayendo sobre agua. Si pulsas sobre la imagen se genera un foco de ondas, y si arrastrar el ratón se crea una estela.
Flash CS3. Barra de botones Flash que se conecta con una función javascript.
30 nov
Se trata de una barra de botones realizada en Flash que obtiene las imágenes de los distintos estados de los botones de un xml.
Al pulsar sobre un botón se llama a la función javascript “onClick()” que aparece dentro del código html de la página web. Esta función sólo emite un mensaje de alerta con la cadena de texto que le pasa la barra de botones.
La conexión entre el archivo swf (la barra de botones) y la función javascript la realizamos a través de la clase estática ExternalInterface, que viene a sustituir en AS3 al antiguo fscommand().
Ver ejemplo y código fuente >>
Para ver el código fuente y descargarlo, entra en el ejemplo y pulsa con el botón derecho del ratón sobre la barra de botones (no sobre el resto de la página) y elige la opción “View Source” que aparecerá en el menú emergente.
Flex 2. Efecto de ondas sobre el agua.
25 nov
En este ejemplo vamos a simular el efecto que produce la caída de un objeto sobre la superficie del agua.
Ver ejemplo y código fuente >>
Hemos utilizado el filtro DisplacementMapFilter para distorsionar la imagen y darle un aspecto de superficie de agua.
El filtro de Flash que aplicamos distorsiona la imagen dándole un relieve que obtiene de un mapa de escala de grises: cuanto más blanco es el pixel que se procesa, más relieve da a la imagen final.
Como mapa de relieve (también conocido como bump map), hemos utilizado un gradiente radial con forma de onda, jugando con el nivel alpha del mismo. Este gradiente lo hemos aplicado a una shape llamada “fondo_shp”.
Para conseguir el efecto deseado aplicamos el filtro DisplacementMapFilter a la imagen, utilizando fondo_shp como mapa de relieve.
Flex 2. Gráficas de barras con Flex
17 nov
Este ejemplo no utiliza las gráficas para mostrar datos estadísticos de Flex. Las gráficas de barras que aparecen están implementadas directamente.
Eventos en ActionScript 3.0
12 nov
Un capítulo del libro de Colin Moock, Essential ActionScript 3.0.
A mi me ha parecido una pasada. Explica un montón de historias de esas que están ahí pero no sabes porqué.
http://www.adobe.com/devnet/actionscript/articles/ora_essential_as3/ora_essential_as3_ch21.pdf
Propiedad BlendMode
11 nov
Ahí va un ejemplo sobre la propiedad ‘blendMode’.
Esta propiedad afecta a la apariencia de un movieclip cuando se encuentra en una capa superior que otro objeto en la pantalla. Existen 14 modos “normal”, “layer”, “multiply”, “screen”, “lighten”, “darken”, “difference”, “add”, “subtract”, “invert”, “alpha”, “erase”, “overlay”, “hardlight”.
He modificado el ejemplo de la ayuda de flash y lo he pasado a actionscript 3.
Ver Ejemplo>>
Descargar Código>>
Este es el código de la clase Main.
[ftf w="640" h="230"]/* Main.as */
package {
import flash.display.MovieClip;
import fl.controls.Label;
import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.geom.Matrix;
public class Main extends MovieClip {
var mc1:MovieClip = new MovieClip();
var mc2:MovieClip = new MovieClip();
var blendLabel:Label = new Label();
var blendModeIndex:int = 0;
var modes:Array = ["normal","layer","multiply","screen","lighten","darken","difference",
"add","subtract","invert","alpha","erase","overlay","hardlight"];
var timer:Timer = new Timer(1000);
public function Main() {
blendLabel.text = “”;
blendLabel.x = 80;
blendLabel.y = 25;
this.addChild(blendLabel);
mc1.x = 32;
mc1.y = 50;
this.addChild(mc1);
mc2.x = 65;
mc2.y = 83;
this.addChild(mc2);
fillClip(mc1, 0x00AA00, 0x22FFFF, 100, 100)
fillClip(mc2, 0xFF0000, 0x2211FF, 100, 50)
timer.addEventListener(TimerEvent.TIMER, changeBlendMode);
timer.start();
}
function changeBlendMode(e:TimerEvent) {
mc2.blendMode = modes[blendModeIndex];
blendLabel.text = modes[blendModeIndex];
blendModeIndex++;
if(blendModeIndex == 14)
blendModeIndex = 0;
}
function fillClip(mc:MovieClip, color1:Number, color2:Number, alpha1:Number, alpha2: Number) {
var spreadMethod:String = “reflect”;
var interpolationMethod:String = “linearRGB”;
var focalPointRatio:int = 0.9;
var matrix:Matrix = new Matrix();
matrix.createGradientBox(100, 100, Math.PI, 0, 0);
mc.graphics.beginGradientFill(“linear”, [color1, color2], [alpha1, alpha2], [0, 0xFF], matrix,spreadMethod, interpolationMethod, focalPointRatio);
mc.graphics.lineStyle(8,0×888888,100)
mc.graphics.moveTo(0, 0);
mc.graphics.lineTo(0, 100);
mc.graphics.lineTo(100, 100);
mc.graphics.lineTo(100, 0);
mc.graphics.lineTo(0, 0);
mc.graphics.endFill();
}
}
}
/* Main.as */[/ftf]
Flex Skin
7 nov
Aquí os dejo una serie archivos para que cambiéis el estilo de vuestras aplicaciones flex.


Y si queréis diseñar los vuestros, esta plantilla os viene que ni pintado.
Plantilla Photoshop [ZIP, 1.56mb]
Puedes descargar muchos styles mas de la pagina http://www.scalenine.com/
Flex 2. Motor de físicas APE
5 nov
Ejemplo de utilizacion del motor de físicas APE para Actionscript, en Flex.
Ver ejemplo y código fuente >>
En el archivo zip del ejemplo puedes encontrar todas las clases necesarias para compilar la aplicación, pero si quieres bajarte la última versión de este motor de físicas puedes hacerlo desde su página APE Actionscript Physics Engine.
Flex 2. Flex 3. Puzzle
4 nov
Juego de puzzle consistente en ensamblar las piezas que componen una imagen oculta.
Descargar proyecto Flex completo (lleva PV3D 1.7 incluído) >>
El menú para elegir la imagen del puzzle está hecho con Papervision3D 1.7. Si no te has descargado las clases de este proyecto, puedes hacerlo desde su página.
Descargar biblioteca compilada (swc) Papervision 3D 1.7 >>
Si te interesa AIR, en este segundo enlace puedes encontrar el archivo zip del proyecto exportado con Flex 3. Una vez que lo hayas descargado en tu disco duro elige File/Import/Flex Project… y dale la ruta a dicho zip.
Descargar proyecto Flex 3/AIR completo >>
Al comenzar un nuevo juego el programa distribuye las piezas aleatoriamente y las gira. Para colocar una pieza llévala al tablero hasta la zona en la que crees que debe estar y gírala utilizando la rueda central del ratón: hacia delante gira a la izquierda, hacia atrás gira a la derecha.















