Entries Tagged as ''

Galería de imagenes

Hay varias formas de crear aplicaciones en Flex una de ella es tener el IDE con el que podemos arrastrar los controles y crear nuestra aplicación, usando el Tag
<mx : El_control_a_utilizar>

Pero también podemos crear controles en tiempo de ejecución usando AS3. En este pequeño ejemplo crearemos una galería de imagenes distribuido de manera circular en nuestra aplicación.

Iniciamos nuestro aplicación
asegurandonos que cuando termine de cargar se ejecute nuestra funcion “onInitApplication”

<mx:Application
xmlns:mx=”http://www.adobe.com/2006/mxml”
layout=”absolute”
applicationComplete=”onInitApplication();”>

Seguimos y ahora creamos nuestro bloque de Script (que será en AS3).

<mx:Script>
<![CDATA[
// Importando clases
import mx.containers.Panel;
import mx.controls.Image;

Declaramos nuestras variables para la creación del menú

// Declarando variables
private var radio:int = 150;
private var centerX:int = 160;
private var centerY:int = 160;
private var angulo:Number = -Math.PI/2;
private var offSetAngle:Number = ( 45 * Math.PI ) / 180;
private var xPos:Number;
private var yPos:Number;

// Funcion principal esta se ejecutara una vez cargada nuestra aplicacion
public function onInitApplication():void {
createPanel();
};

Continuamos creando nuestros Elementos (en este caso 8 que estaran en bloque del “FOR”) para ello utilizaremos las clases:

import mx.containers.Panel;
import mx.controls.Image;

Tambien tendremos añadir cada control a un respectivo contenedor con el metodo “addChild” quedando la jerarquia de la siguiente manera:

Application -> Panel -> Image
Con el control de “Image” cargaremos nuestras imagenes a traves de la propiedad “source”

// Esta funcion nos permitira crear los paneles
private function createPanel():void {
for (var k:int=0; k<8; k++) {
var panel:Panel = new Panel();
panel.title = “Clon_”+(k+1);
panel.width = 80;
panel.height = 100;

var imagen:Image = new Image();
imagen.source = “kakashi.jpg”;
imagen.width = 60;
imagen.height = 60;
panel.addChild(imagen);
Application.application.addChild(panel);

angulo += offSetAngle;
xPos = ( Math.cos( angulo ) * radio ) + centerX;
yPos = ( Math.sin( angulo ) * radio ) + centerY;

panel.x = xPos;
panel.y = yPos;
}

};

]]>
</mx:Script>

</mx:Application>

Aquí les dejo una imagen de como quedará el ejemplo y también les dejo los archivos de este ejemplo menuCircular.rar un poco modificado para que lo compilen con el IDE de Adobe o el SDK .

Ahora con un poco de creatividad puedes lograr aplicaciones interesantes como esto

Saludos a todos

Distancia entre puntos

Hola atodos de nuevo.

En este ejemplo recodaremos un poco de matematica de colegio.

Tenemos dos puntos:
P1(P1x, P1y) y P2(P2x, P2y)

Hallamos nuestros componentes en los respectivos ejes:
dx = P2x - P1x;
dy = P2y - P1y;

Con las estos valores podemos hallar la distacia entre los dos puntos que será:
Distancia = Math.sqrt( dx * dx + dy * dy );

Donde Math.sqrt es una funcion en AS3(y en la mayoria de lenguajes de programación) que nos permite hallar la raíz cuadrada de un número.

Gracias a eso he creado este ejemplo que hallamos la distancia entre la posición del Mouse y cada letra de nuestro texto para aplicarle una pequeña fuerza de atracción o repulsión (pasa el mouse sobe el texto).

Bueno aquí les dejo el ejemplo “textEffect.rar” y no se olviden de buscar en google el texto completo del ejemplo “Desiderata” es muy bueno.

Saludos :)