Ir al contenido principal

Entradas

Usando Componentes de Flash: Paleta de Colores / Using the Flash Components: Color PIcker

NOTA: Si te interesa aprender de manera presencial los temas fundamentales AS3 y vives en la Ciudad de México, puedes inscribirte aquí al curso sabatino que daré los sabados.

Al desarrollar en Flash Professional encontraremos un sinfin de ventajas, una de ellas son las prestaciones visuales, es decir la calidad visual de los elementos que se pueden integrar y también la interactividad y diversidad de ellos.

Cuando es necesario podemos crear nosotros mismos los elementos que necesitemos dependiendo de las características, comportamientos, vista, etc. Para nuestra fortuna existen ya varios elementos de antemano fabricados y diseñados para su correcto funcionamiento e implementación, dichos elementos se llaman "Componentes" y los podemos encontrar en el panel del mismo nombre.

Este es el primer post de una serie donde se platicará de manera práctica acerca de lo sdiferentes componentes que ya incluye Flash. En esta ocasión hablaremos del Color Picker o "Seleccionador de Co…
Entradas recientes

Uso de XML con Flash y Actionscript 3.0 / Using XML with Flash and Actionscript 3.0

NOTA: Si te interesa aprender de manera presencial los temas fundamentales AS3 y vives en la Ciudad de México, puedes inscribirte aquí al curso sabatino que daré los sabados.

En el manejo de tecnologías web, existe una muy importante que nos permite organizar y visualizar información, esta tecnología es el XML que significa algo así como Lenguaje de Marcas (ó etiquetas mas bien) Extensible, si quieren conocer un poco más del tema aquí hay un link (español) y aquí otro (inglés).

Una ventaja de usa esta tecnología es que la información que coloquemos es este tipo de archivos se puede usar para visualizarse en diferentes interfaces con diferente tecnología, por ejemplo: un mismo archivo XML nos puede servir para almacenar el inventario de una tienda y que sea visualizado en una página web usando HTML, al mismo tiempo en una aplicación de escritorio usando AIR ( proximamente un post al respecto ) y hasta un archivo swf local, todas estas aplicaciones utilizando el mismo XML de manera qu…

Transiciones con CSS3

NOTA: Si te interesa aprender de manera presencial los temas fundamentales AS3 y vives en la Ciudad de México, puedes inscribirte aquí al curso sabatino que daré los sabados.

En el post previo se comentó la manera de hacer Animaciones con CSS3, en esta ocasión hablaremos de otra forma de generar cambios visuales: Transiciones con CSS3. A diferencia de las animaciones, las transiciones no utilizan "keyframes", sino mas bien son indicaciones de cómo queremos visualizar los cambios (tiempo, propiedades, "easing"), dichos cambios se pueden activas utilizando pseudoselectores CSS como "hover". En el cuadro siguiente se aplicó un efecto donde la anchura y el color cambia al ubicar el mouse sobre el.

Pasa el mouse sobre mi
Realicemos entonces los pasos para implementar las transiciones.

1.- Coloquemos el elemento al que queremos aplicarle las transiciones y le damos un ID:

<body>
     <div id="miDiv">
     Este es mi DIV
     </div>
</…

Animación con CSS3

NOTA: Si te interesa aprender de manera presencial los temas fundamentales AS3 y vives en la Ciudad de México, puedes inscribirte aquí al curso sabatino que daré los sabados.

Bueno ya todos sabemos que entre HTML5 y CSS3 han generado en combinación grandes herramientas para hacer tareas que antes solamente con Flash o Javascript eran posibles. Una de estas en hacer una pequeña animación como la que se muestra a continuación (Internet Explorer y Opera no funcionan con estas características).


Lo que tenemos arriba es solamente un objeto DIV al que con aplicarle ÚNICAMENTE estilos CSS3 hemos logrado este efecto. Vamos pues a crearlo.

1.- Crear el objeto:

Solo es necesario crear dentro del body de nuestro HTML una etiqueta DIV:


<body>

<div></div>

</body>

Nota: en este ejemplo usamos un DIV, pero podemos utilizar el elemento que queramos, inclusive podemos usar clases (?) o id (?) para asignarle estas propiedades.

2.- Aplicare estilo:

Crearemos una etiqueta STYLE y de…

Efecto "Colorear" en Flash

NOTA: Si te interesa aprender de manera presencial los temas fundamentales AS3 y vives en la Ciudad de México, puedes inscribirte aquí al curso sabatino que daré los sabados.

Hace un par de meses tuve que generar para un banner el efecto de una imagen en tonos de grises que al pasar el mouse encima se vaya "coloreando", este ejercicio me pareció divertido e interesante y por esta razón decidí colocarlo en este blog.

Puedes comenzar a iluminar la imagen de la tortuga en cuanto aparezca.

Para generar este sencillo efecto utilizaremos elementos de: máscaras dinámicas, Sprite, UILoader, además claro de MovieClips y Listeners.

Bueno, pues definamos y acotemos el problema:


Permitir que el usuario pueda "colorear" una imagen con el mouse.Se debe mostrar una imagen inicial y una final ( mo importa si son iguales o no ).Las imágenes deben de ser externas al flash para optimizar su tamaño.Cuando el usuario presione el mouse y luego lo mueva sobre la imagen inicial deberá ir …

Galería de videos AS3

NOTA: Si te interesa aprender de manera presencial los temas fundamentales AS3 y vives en la Ciudad de México, puedes inscribirte aquí al curso sabatino que daré los sabados.

A petición del público (mas bien al amigo Fernando Rojas): una galería de videos!


Bueno primero definamos y delimitemos el problema:

I. Hacer una galería de videos que sea "fácil" de actualizar

II. Que los botones de los videos, tengan una imagen a manera de thumbnail.

III. Pare este ejemplo usaremos 4 videos en formato FLV con sus 4 imagenes respectivas.

Perfecto, en este ejemplo usaremos el componente FLVPlayback de Flash, que es el reproductor de videos nativo de flash, si desean saber un poco más acerca de este componente lo pueden revisar en este link.

Primer Paso: Generar Los Botones.

Debemos crear un MovieClip que llamaremos video_btn, que será la base para los botones de los diferentes videos. en este MC, dibujaremos un cuadro con las esquinas redondeadas de 150x120 y agregamos un UILOADER (¿?…

Animación en Actionscript 3.0

NOTA: Si te interesa aprender de manera presencial los temas fundamentales AS3 y vives en la Ciudad de México, puedes inscribirte aquí al curso sabatino que daré los sabados.

Flash es un software que fue creado con el propósito de hacer animaciones (banners) para internet, sin saberlo ese fue el principio del desarrollo de esta herramienta que actualmente nos permite generar una interacción mucho mayor con el usuario.



En esta publicación se mostrará una forma básica de hacer animaciones utilizando el lenguaje de Flash: Actionscript, en su versión 3.0 (AS3). Debemos comprender que el AS3 es un lenguaje orientado a objetos (Object Oriented Programming...OOP ó POO en español), por lo que los elementos tienen características de objetos "reales"; es decir propiedades como su posición en X, Y, rotación, transparencia, tamaño, etc.


Bueno pues comencemos:

1.- Necesitamos un Objeto!!!!

Debemos crear un objeto que sea posible de animar, en este caso crearemos un MovieClip que llamare…