Muela Blog

viernes, noviembre 24, 2006

Nos Mudamos ^^

Weno desde ahora el blog se muda :)

esperemos qles guste, sigan visitandonos y dandonos sus opiniones y comentaroios ^^

el nuevo blog esta ahora en

http://www.muelalab.com/blog/

Saludos y Suerte!!!!!!!!!

martes, noviembre 14, 2006

Trasladando.. y Trabajo o.o :P

Wenas wenas, aqui toy otra ves denuevo ^^.
Me esfume por unos dias ya q ando con mucho trabajo...
Estoy diseñando en este momento una web.. para HiTech (hitech.com).. q me esta llevando muco trabajo.. :D wena pagaa jeje y va a ser uno de mis mejores diseños hasta ahora ^^!! asi q cuando te lista se ls presumo :P!!
Weno ademas de eso.. estoy con la escuela examenes y todo eso u.u...
y la otra es q estoy diseñando (tambien O.o) para MuelaLab.com (osea yo o.o).. :D!

asi q weno me decidi y ahora toy disepñando mi web.. va a ser algo con wenos efectos... :D
Y su funcion principal seria "dar a conocer mis trabajos" (para conseguir mas trabajo o.o :P).. asi es ^^, claro q habra mas tutoriales y todo.. asi q esperen a qla termine, denme unos dias plzz :D!

Weno para q se sepan un poquito mas :P, yo soy de chihuahua chi... y aca weno pues e trabajado "solitariamente", e hecho ya algunas webs (5) con dinero de por medio (trabajo... :P), y muchas mas (muchas o.o) gratis... jeje asi se empiesa...., weno pues ahora quiero volver esto "formal" asi q de ahora en adelante muelalab no sere yo solo.. ^^, ya consegui un wen ekipo de diseño :D (amigos mios jejej).
Asi q va a mejorar mucho(espremos :P)..... Asi q si queiren una web avisenme ç:P!!!!

WEeno solo queda esperar a q termine la web.. :D
Cuando tenga la web lista.. el blog sera trasladado al host.. para darle un mejor uso y rendimiento... y espermos en un tiempo tener foros y demas ^^

Asi q proximamete muelalab.com!!!
Saludos y hasta la proxima ^^

sábado, noviembre 11, 2006

PHP-Flash Los inicios ^^

Weno ahora veremos la forma de comunicarnos con php desde flash..
se trata de q enviaremos unas variables y obtendremos otras desde el php...
Sera algo asi como el siguiente ejemplo :D





Weno ahora veamos como hacerlo.. :)
1.- Dibujamos 3 cajas de texto, dos dinamicas y una de entrada (input), selecionamos la caja de texto de entrada y le ponemos como nombre de instnacia "men2" en el panel de propiedades (Ctrl+F3), y a las otras dos cajas de texto (dinamicas), les ponemos nombre de instancia "mensaje" y "mensaje2"..
2.- Creamos un boton (dibujas una forma, la selecionas y presionas F8, selecionas como tipo "boton" y le pones cualquier nombre..), luego de crearlo lo selecionas y en el panle de acciones (F9) pegas el siguiente codigo:

on(release){mensaje.text = "Cargando Datos.";
_root.cargardatos();}

Explicacion: Al precionarlo, la caja de texto "mensaje" mostrara "cargando D...", y ademas llamamos a la funcion "cargardatos"... Q crearemos mas adelante..
3.- Ahora crearemos la funcion cargar datos... para esto selecionamos el primer frame de nuestra pelicula, y pegamos el siguiente codigo en el panel de acciones:
function cargardatos(){
obj1 = new LoadVars();
obj1.mensaje2 = men2.text;
obj1.sendAndLoad("info.php", obj1, "POST");
obj1.onLoad = function(){ mensaje.text = obj1.mensaje1;
mensaje2.text = obj1.mensaje2; }}
Explicacion: Weno esto es muy parecido a cargar datos de un .txt de hecho es igual.. primero creamos un objeto q contendra las variables (obj1), le asignamos una variable a este objeto q contendra el texto escrito en la caja de texto "men2" [obj1.mensaje2 = men2.text;], cargamos y enviamos esas variables a el archivo "info.php", le indicamos q es por el metodo POST, y q recojera las variables regresas en el mismo objeto (obj1), por ultimo cuando se carguen esas variables se ejecuta uan funcion, q a la caja de texto "mensaje" le asigna la variable "mensaje1" del obj1, a la caja de texto "mensaje2" le asigna la variable "mensaje2" del obj1.
Ok estas "variables del obj1" por ejmplo la de obj1.mensaje2, se obtiene desde el php...
entonces creamos el php, en su editor de texto (dreamweaber, frontpage,etc..) pegamos el siguiente codigo, y lo guardamos con el nombre "info.php"
$meenviaste = $_POST['mensaje2'];
print "&mensaje1=Mensaje Recibido Desde PHP&&mensaje2=$meenviaste&"
?>
Explicacion: recojemos la variable enviada "mensaje2" y se la asignamos a "meenviaste".... luego imprimos de forma igual a un .txt, el mensaje1 y el mensaje2 (este con la variable recojida).
Y listo!! ^^, si prueban su pelicula les funcionara bien.. (si la prueban en local en la caja de texto "mensaje2" recibiran $meenviaste)...
Weno la verdad se me hace muy sencillo y creo q a todos se les ahra sencillo.. asi q con esto creo q es suficiente para q puedan empesar a experimentar ^^
Hasta la proxima y suerte!!! ^^

viernes, noviembre 10, 2006

Clase SharedObject :)

Wenas wenas :)
Para empesar veremos q es un shared object y un poco hacerca de sus propiedades y metodos..
Un sharedObject es como una "cookie", es decir q es un archivo q guarda cierta informacion(nosotros le decimos q) en la computadora donde se esta visulizando el swf...
Veamos los metodos y propiedades.

METODOS
DESCRIPCION
SharedObject.clear()Resetea toda los datos del objeto y elimina este objeto.
SharedObject.flush()Obliga a escribir los datos enviados por el usuario en el objeto.
SharedObject.getLocal()Busca y carga el objeto indicado en la maquina del usuario.
SharedObject.getSize()Obtiene el tamaño actual del objeto compartido, expresado en bytes.
PPROPIEDADES
DESCRIPCION
SharedObject.dataSirve para llamar a los datos guardados.

En el siguiente ejemplo veremos q si guardamos los datos... y actualizamos la pagina automaticamente nos llevara a la parte donde a estan los datos..., pero si cerramos (en el swf) y actulizamos, como no hay datos se queda ahi...., este sharedobject si dejas losdatos sin cerrar permaneceran ahi po siempre :)





Weno ahora para aprender a usar esta clase, creareos desde 0 en este tutorial flash este ejemplo.. :D

1.-En el primer frame de nuestra pelicula colocamos 2 cuadros de texto, selecionamos el primero y en el panel de propiedades (Ctrl+F3) le ponemos de tipo "Input", con nombre de instancia "usuario" y el otro "input" nombre de instancia "pass".
2.- ahi mismo (primer frame) dibuja un circulo o lo q quieras... y lo conviertes en Boton (seleconas tu figura, presionas F8, elijes boton y le pones cualquier nombre...), luego lo selecionas y en el panel de propiedades (Ctrl+F3) le pones nombre de instancia "entrar_btn"
3.- Ahora creas una nueva capa y la llamas AS (en esta pondremos lso codigos para no reborujarnos..), selecionas el primer frame abres el panel de acciones (F9) y escribes el sig codigo:

stop();
nuevo_so = SharedObject.getLocal("Usuario");
if(nuevo_so.data.user == undefined && nuevo_so.data.pass == undefined){
trace("No Hay Datos");}
else {trace("Si Hay Datos");
gotoAndPlay(2);}
//Funcion Del Boton-----------------
entrar_btn.onRelease = function(){
nuevo_so.data.user = usuario.text;
nuevo_so.data.pass = pass.text;
nuevo_so.flush();
gotoAndPlay(2);}

Explicacion: Detenemos la pelicual en ese frame,- creamos un nuevo SahredObject y lo llamos "nuevo_so", buscamos el archivo llamado "usuario", luego decimos: Si!! nuestro sharedObject (nuevo_so) .data.user (osea q llamamos al dato "user"), es igual a undefined (no definido) y el dato pass tampoco esta definido, nos muestra q no hay datos, pero si estos dos datos si existen entonces!! (else) nos manda al frame2.
Lafuncion del Boton: Al presionar el btn a nuestro sharedobject (nuevo_so) le asigna un dato llamada user como ven este dato es el texto q tengamos en nuestra caja de texto "usuario".. y lo mismo asigna otro datao llamado "pass" con el texto de la caja "pass", y obligamos a q grave (Flush) estos datos en nuestro SO(sharedObject), y luego de grabar nos manda al frame 2.. :D

Hasta aqui todo bien no??, esta siendo claro??, weno un repasa rapido, si en el objeto q cargamos ("usuario") hay datos guardados nos manda al frame 2 si no, os deja en el frame1, y cuando rpeionemos el btn de "entrar_btn", nos guarda los nuevos datos y nos manda al frame2.. ^^

Ahora q pasa en el frame 2 o.o... weno lo q ahremos ahi es cargar los datos en un campo de texto y listo ... :D
1.- Para esto creamos una nueva capa, nos vamos al segundo frame y presionamos F6 (para crear un keyFrame), en ese segundo frame creamos un campo de texto tipo "dinamico", con nombre de instancia "datos" (esto se hace en el panel de propiedades [Ctrl+F3]).

2.- En esta misma capa hacemos otro boton (dibujamos uan forma, selecionamos, F8, tipo boton y con cualquier nombre...), y le ponemos cmo nombre de instancia (en el panel de propiedades) "cerrar_btn".

3.- y en la capa AS, en el frame 2 presionamos F6, y en ese keyframe (el segundo), abrimos el panel de acciones (F9), y escribimso el sig codigo..

stop();
usuario = nuevo_so.data.user;
pass = nuevo_so.data.pass;
datos.text = "Bienvenido "+ usuario + ". Tu Clave Es: "+ pass;
cerrar_btn.onRelease = function(){ nuevo_so.clear(); gotoAndPlay(1);}

Explicacion: Detenemos la pelicula, llamamos a los datos del SharedObject, y los asignamos a unas variables "usuario" y "pass".., luego a la caja de texto "datos" le asignamso el texto "Bienvenido "+ usuario + ". Tu.....", donde usuario y pass son las variables q contiene los datos... :D, y por ultimo creamos una funcion para q al precionar el btn "cerrar_btn", nos maden al frame 1, y liempie y borre nuestro sharedobject!!, Listo :D!

Ok ahora prueben su pelicula (Ctrl+Enter), ahora les deve funcionar... :D!!

Weno nomas pues me queda decirles q esto puede tener un muy buen uso, se puede grabar datos de usuario para una web, o guardar el numero de imagen o pagina q estaba viendo asi al volver a entrar en la pag se cargue en esenumero, etc etc, ,uchas cosas... cuestion de echar a volar la imaginacion ^^

Weno Espero q les haya servido... y q no haya sido muy dificil :p
Cualquier duda o comentario,, dejen un comentario O.o xD
Saludos y grax por visitar e lblog!! :D! ^^

jueves, noviembre 09, 2006

Crear un ToolTip

Categoria: MiniTuto
Nivel: Intermedio
weno pues ya devo algunos tutos XDDD, cuando tenga tiempito epero ponerlos... (el problema es q hay veces q no puedo usar casi nada la pc.. :S o.o).
weno en este minituto veremos como crear un tooltip en flash y con ayuda de un poco de AS(actionscript), el principal objetivo es crear un tooltip de una manera sencilla pero funcional :).





Empesemos:
1.- Lo primero q haremos es crear el "tooltip", para esto dibujaremos en rectangulo de aproximadamente 60px * 18px, con los colores de ustedes quieran.., lo selecionamos (doble click) y presionamos F8 para convertirlo a simbolo, lo convertimos en MovieClip con nombre "fondo" y el punto de registro en la esquina inferior izquierda...., despues precionamos "OK", selecionamos nuestro mc en el escenario y en el panel de propiedades (Ctrl+F3) le ponemos como nombre de instancia fondo.

2.- Ahora selecionamso este movieclip "fondo" y lo volvemos a convertir en otro MC de la misma forma(seleccionamos y F8), solo q ahora con nombre tooltip_mc y nombre de instancia igual "tooltip_mc".
3.- Damos doble click sobre el mc "tooltip_mc" para entrar a su linea de tiempo, creamos una nueva capa (q este sobre la capa q tiene el mc "fondo"), y dibujamos un campo de texto masmomenos del mismo tamaño y alto.. (el tipo de letra colorr y tamaño como tu gustes).
Selecionamos este campo de texto y en el pnale de propiedades (Ctrl+F3), le ponemos como tipo Dinamico, con nombre de instancia "tex" y q no sea selecionable...
4.- Nos regresamos a la linea de tiempo principal y arrastrmos todo nuestro MC "tooltip_mc" fuera del escenario...
5.- En la linea de tiempo principal, crearemos una capa nueva con nombre "AS", seleccionamos el primer frame de esta capa y abrimos el panel de acciones (F9), ahi colocamos este codigo:

function tooltip (texto){
_root.tooltip_mc.startDrag(true);
_root.tooltip_mc._visible = true;
_root.tooltip_mc.tex.text = texto;
_root.tooltip_mc.tex.autoSize = true;
largo = _root.tooltip_mc.tex._width;
_root.tooltip_mc.fondo._width = largo+2;}
function resettool(){stopDrag();
_root.tooltip_mc.tex.text = ""
_root.tooltip_mc._visible = false;
_root.tooltip_mc._x = -300 }

Explicacion: Creamos una funcion de nombre "tooltip" para q nos modifique el tooltip al llamar esta funcion, como ven esta tiene un parametro "texto" (es decir es un valor q recibira al ser llamada esta funcion),, primero nos dice q el MC "tooltip_mc" se empiese a arrastar, luego q este mismo MC sea visible, ademas le indicamos q dentro de ete mc al campo de texto "tex" le asigne la variable texto, q como ven es la q tiene como paramentro la funcion, le decimos q el campo de texto (tex) se ajuste automaticamente y por ultimo creamos una variable "largo" q contiene el largo del camp ode texto (_width) y le asignamos ese mismo largo al mc "fondo". :).
Se crea otra funcion "resettool", esta es mucho ams sencilla.. lo q hace es q al llamar esta funcion el campo de texto se le escribe "" (osea sea vacia), ademas decimos q el MC tooltip_mc no sea visible (false), y lo ponemos en una coordenada fuera del escenario... :D
weno esta explicacion es sencilla.. ya q para este nivel deverian entender un poco.. (ademas son codigos sencillos), pero cualquier duda pueden dejar sus comentarios :D y le responder inmediatamente..


Como ven creo q ya van entendiendo, lo unico q falta hacer es llamar a esas funciones, cuando el mouse se ponga sobre un btn o mc se llama a la funcion "tooltip" y cuando se sale de este MC resetea el tooltip "resettool". Eso lo hacemos colocando los singuiente codigos a un MC o Btn q creamos..

1.- Dibujen un circulo, lo selecionan y presionan F8, lo convierten en "Boton" con cualquier nombre...
2.- Lo selecionana y en el panel de accines (F9) pegan el siguiente codigo..

on(rollOver){ _root.tooltip("El circulo"); }
on(rollOut){ _root.resettool(); }

Explicacion: Al pasar sobre este btn(RollOver), se llama a la funcion "tooltip" y se le pasa el texto q queremos q muestre. Al salir del area de este btn (RollOut) llamamos a la funcion "resettool".

Weno con eso hemos terminado... Creo q aveces explico demasiado.. xD asi q ya los proximos tutos em voy a ir acortando pasos (como cuando explico como hacer un MC :P)..
Espero q les sirva.. y estudien un poco los codigos si es necesario.. experimenten y demas ^^
Esperamos sus comentarios sugerencias y todo O.o suerte!!!! :D!

miércoles, noviembre 08, 2006

Ventanas Dinamicas Sencillas... :)

Categoria: Tuto - Flash
Nivel: Intermedio


Wenas ^^
weno aqui va el tuto del dia :P (todo retrasado o.o xD).
Con este tutorial explicaremos como crear por medio deuna funcion sencilla, ventanas dinamicas para mostar texto... Estas ventanas pueden tener un muy buen uso en una web, ya q ahorran espacio y el diseño de la web es mas moderno..
Con este tuto no pretendemos explicar la mejor manera o como crear unas ventanas dinamicas 100% funcionales (:P), sino explicar las bases de estas y ya ustedes con sus ideas podria mejorarlas :D!! (igual mas adelante se enseñara a hacer ventanas mucho mejores..)
Algo asi van a quedar: (las ventanas se pueden mover..)





Se ven bien no?? y son muy sencillas de hacer ^^, Empesemos pues xD:
Diseño:
Necesitaremos 3 btns (cerrar, maximizar y minimizar). Diseñaremos primero el fondo del btn (para los 3 es igual).
1.- Elijan la herramienta rectangulo, se van al inspector de color (shift+F9). ye nel color de linea elijen la opcionde "lineal" y elijen en la paleta de colores un color por ejmplo Negro y un Gris. Y el color de relleno lo ponen Gris Fuerte... Ahora dibujen el rectangulo (pueden presionar Shift mientras lo dibujan -- esto te hace un cuadrado perfecto..). aproximadamente de 18px * 18px. Ahora selecionenlo(doble click sobre el) y vallan a "Modificar-Transformar-Rotar 90º a la izquierda"... Ahora seleccionamos denuevo y presionamos F8, Vemos el cuadro para convertir a simbolo.. Le ponemos como nombre "cerrar" tipo "boton" punto de registro "centro". listo ese es nuestro fondo... :D! (da un efecto lindo ^^) Ver la imagen "Secuencia 1".


2.- Ahora lo q queda por hacer es lo siguiente. Duplicamos el btn "cerrar" desde la libreria. Abrimos la libreria (F11) damos click derecho sobre el btn "cerrar" y lo duplicamos, se abrira el cuadro de "duplicar simbolo" ahi elejimos btn y le ponemso como nombre "maximizar", luego lo volvemos a duplicar pero ahora con el nombre "minimizar". Nos quedan 3btns. Secuencia 2
3.- Por ultimo dan click derecho en el btn "cerrar" y le dan en "edit (Editar)", crean una nueva capa y dibujan una X y asi con lso otros dos btns..... hasta q les queden asi Secuencia3.. Como van?? weno con esto ya estan los btns :D!
4.- Faltan dos cositas... el rectangulo del titulo y el del cuerpo del texto... para eso es sencillo... usando la herramienta rectangulo y el color adecuado... dibujen un rectangulo de aproximadamente 180px de largo y 24px de alto, y otro mas de 180px * 140px, cada uno lo selecionan y lo convierten en movieClip con el nombre de "titulo_mc" y "contenido_mc", respectivamente.... Ya con esto tenemos todos los elmentos de la ventana :D!.
Armando La Ventana.
1.- En el primer frame de nuestro archivo, arrastramos todos los elementos recien creados de la libreria (F11) hacia el area de trabajo...
2.- El btn de maximizar y minimizar estaran dentro de un mismo "MC"(MovieClip) asi q los selecionamos los dos, y presionamos F8, elejimos: tipo: "movieclip", nombre: "maxymin", punto de registro: "centro". Ahora nos metemos en ese movie clip dando doble clik sobre el y dentro de este selecionamos el frame 2 y presionamos F6(fotograma clave), ahi selecionan el btn de minimizar y lo borran, asi tienen cada btn en cada frame (centren los btns...), luego crean una nueva capa y tambien ponen un keyframe (f6) en el frame2 y el codigo stop(); en cada frame (abren el panel de acciones [F9])..
3.- Ahora nos regresamos a la linea de tiempo principal y acomodamos todo... Son 4 piezas ahora..., despues de acomodarlas las selecionan todas y las convierten en mc (F8), lo llaman ventana..
4.- Entran al mc ventana y crean una nueva capa ahi ponen un campo de texto dinamico en la parte donde va el titulo, y le ponen nombre de variable "titulo", y no selecionable.... una sola linea.... Exactamente iagual a la Imagen 1

5.- Ahora se meten al mc "contenido_mc" osea el mc donde va el cuerpo del texto.. crean una nueva capa y ahi dibujan una caja de texto del tamaño del rectangulo, igual q la enterior pero esta si se puede Seleciona, es Multiline y el nomre de variale va a ser "contenido".
6.- Por ultimo ··· Al MC "contenido_mc" le ponen nombre de instancia "contenido_mc" (selecionan el mc contenido_mc y en el panle de propiedades [Ctrl+F3] en donde dice instance name escriben "contenido_mc").
7.- Listo!! ya quedo la ventana.. y ahora q creen o.o??, limpian su linea principal, es decir borran todo lo q tengan.. TODO (tambien la ventana). Ahora abren la libreria(F11) buscan su movie clip "ventana" y le dan clik derecho, presionan en "linkage" (linkear) y ahi lo ponen asi... Esto nos deja trabajar con AS el mc ventana. asi podremos colocarlo en el campo cuando sea llamado...
Los Codigos!!!
ok Sigue lo weno.. los codigos... en verdad son sencillos asi solo sigan paso apaso comolo han estado haciendo ^^
En su primer frame peguen este codigo:

i=1
maxima = 2
function crearventana(titulo,contenido){
_root.attachMovie("ventana","ventana"+i,i);
_root["ventana"+i]._x = 150;
_root["ventana"+i]._y = 30;

_root["ventana"+i].titulo = titulo;
_root["ventana"+i].contenido_mc.contenido = contenido;
i++

maxima = i+10}

Explicacion: la funcion crearventana tiene dos parametros q son el titulo y el contenido, estos parametros los recibira cuando llamemos al afuncion (mas adelante veremos como), luego coloca una copia de nuestro mc ventana, lo renombre ventana+i osea ventana1 y lo pone en la profundidad i osea 1. lo coloca en las coordenas 150-150, y le asigna los parametros a las variables de los compos de texto... por ultimo le aumenta 1 a la variable i, para q la proxima ventana no este ni en la misma profundidad ni tenga el mismo nombre.. Se entiende?? creo qsip, igual lo mejor es q experimenten es la mejor forma de aprender ^^

Ahora en la libreria(F11) buscan el mc "ventana" y le dan click derecho y en "edit" , ahi selecionan el mc "titulo_mc" (osea el rectangulo chico) y se van al panel de acciones (F9) y pegan el siguiente codigo:

on (press) {
_parent.startDrag();
_parent.swapDepths(_root.maxima);}
on (release) { stopDrag();}

Explicacion: Al precionar este mc, empesra a arrastrar todo el Movie clip Ventana (_parent = anterior a este [masomenos.. xD]), ademas cambia la profundidad de el mc ventana a la maxima (esto para q se ponga arriba de las demas ventanas), y al soltar el click dejara de arrarstrarlo.. Mas Sobre start y stop drag ACA

Ahora selecionen el bt de "cerrar" abran el panel de acciones y peguen el sig codigo:

on(release){ this.removeMovieClip()}
Explicacion: Al presionar Remueve ese movieclip....

Vamos por lo ultimo ya!! XD, ahora selecionan el movieclip "maxymin" (el de maximizar y minimizar) y se meten (doble clik..) selecionan el boton de primer frame y pegan este codigo.

on(release){ _parent.contenido_mc._visible = false;
gotoAndStop(2); }

Explicacion: Al presionarlo el MC "contenido_mc" lo pone como invisible.. y se detiene en el frame 2 de ese mc...
Luego en el frame 2 elijen el boton (maximizar) y pegan este codigo.

on(release){ _parent.contenido_mc._visible = true;
gotoAndStop(2); }

Explicacion: Lo mismo q el anterior... pero alreves o.o (SI SE ENTIENDE NO ??)

Listo!! ya orfin.... lo unico qnos falta es llamar a la funcion.. para esto peguen el siguiente codigo en su primer frame. (Despues de la funcion "crearventana").

_root.crearventana("Aca El titulo","Contenido de la ventana. Wenas o.o");
Explicacion: Llama a la funcion crearventana y le pasa los parametros (Titulo,Contenido).
Ahora pruebn su pelicula Ctrl+Enter!!! weee ya ta funciona no?? XDD!! sep ya deve funcionar ^^

Ahora en caso de q quieran llamar a la funcion por medio de botones. hacen el boton y el codigo seria el mismo solo q con el Release:

on(Release){
_root.crearventana("Aca El titulo","Contenido de la ventana. Wenas o.o");}


Si se entiendo no???.. weno cualquier cosa descarguen el fla para q l orevisen.. pero yo creo q con esta explicacion es suficiente.. recuerden q lo mejor es q practiquen y experimenten.. cualquier duda pueden dejar un comentario aqui.. :D
Por ultimo les repito, q a esto se le puede agregar mucho, como seria un scroll de texto... mas animacion.. etc etc asi q sigan moviendole :P!! ^^

Weno espero qles sirva de algo (por q fue un buen rato excribiendo o.o) XD
Suerte!! y saludos ^^ :D!!!

lunes, noviembre 06, 2006

1 Mes q wena :P

Weno weno les devo el tuto de hoy.. xD
me voy a llevar este post del dia para darles gracias a la gente q a visitado el blog, a dejado sus comentarios, enviarnos sugerencias y tambien a aquellos q nos han dado ideas para tutos xD..
Creo q va bien el blog van algo asi como 15-20 tutos y algunas noticias de importancia ^^.. y esperemos seguir asi.
recuerden q cualquier cosa pueden avisar a damuca_10@hotmail.com....
cualquier cosa... si quieren q hablemos sobre algo en especial, algun tuto, apoyar con algun tuto suyo, o cualquier tema..
ya q con sus ideas es como este blog va a crecer.. por q esta pensado para q cualquier persona aprenda asi q necesitamos ideas desde las mas sencillas hasta las mas grandiosas :D!

Me veo muy cursi O.o asi q hay me dentengo :P
weno tonces ya saben esperamos sus comentarios, ideas y todo lo q ya les dije XD
Suerte y saludos!!! :D!

domingo, noviembre 05, 2006

Personalizar Menu de Flash

Categoria: Tuto
Nivel: Intermedio

Holas o.o, como tan XD.. ^^
Weno en este tutorial les explicare un poco sobre los metodos del menu de flash....
Bueno no se si alguna ves han dado click derecho sobre un swf?? aparece un menu muy grande de opciones... pero la mayoria de ellas no nos sirven de mucho..... bueno pues con este tuto solucionaremos eso, dandole un mejor uso (creo yo o.o) al menu de flash :D!!!






Como pueden ver se pueden hacer muchas cosas :D, de hecho creo q cualquier cosa (me falta experimentar mas ^^), pero weno porlemenos tiene mas funcionalidad q el menu normal no?? :)
Empecemos !:
Primero devemos conocer los metodos del "menu" q usaremos asi q aqui uan breve explicacion..

METODO
FUNCION
ContextMenu()Proporciona el control de los elementos del menu contextual de Flash Player.
ContextMenuItemSe utiliza para crear elementos de menu personalizados y visualizarlos en el menu de Flash Player.
hideBuiltInItemsOculta los elementos origiales del menu de Flash Player .
customItemsSe utiliza para añadir, eliminar o modificar los elementos creados con "ContextMenuItem" al menu de FP.
menuAgrega el objeto "ContextMenu" a la ruta indicada.

Ahora sip... sabiendo esto nos vamos a practicar ^^
1.- Abran un nuevo archivo.. Dbujen una figura (cualquier cosa), la seleccionan y presionan f8, la convierten en un MC(MovieClip) no importa el nombre....
2.- Selecionan este mc y en el panel de propiedades (Ctrl+F3) le ponen como nombre de instancia "mi_mc"... Ahora los codigos o.o
3.- Crean una nueva capa y seleccionan el primer frame y abren el panel de acciones (F9) y escriben el siguiente codigo:
menu = new ContextMenu();
muelablog = new ContextMenuItem("Ir A muela-blog", pagmuela);
menu.customItems.push(muelablog);
menu.hideBuiltInItems();
function pagmuela(){ getURL("
http://muela-blog.blogspot.com/", "_blank");}
_root.menu=menu;
Explicacion: Primero creamos un nuevo "contexMenu" q llamamos "menu". Luego creamos un nuevo elemento (ContextMenuItem), el primer parametro ("Ir A muela-blog") es el texto q mostrara nuestro elemento en el menu.. y el segundo(pagmuela) es para llamar a una funcion del mismo nombre... despues de esto añadimos el nuevo item (customItems.push[push para añadir...]) Luego ocultamos los elements originales (menu.hideBuiltInItems();), se crea la funcion q sera llamada por este item(elemento), fijense q tiene el mismo nombre y su funcion es este caso es muy sencilla, llama a la url.. y por ultimo decimos q nos agregue este menu a la linea de tiempo principal.... :D!! prueben su pelicula y den click derecho sobre el escenario...

Y asi de sencillo es :D, ahora por ejmplo si quieren agregar este mismo menu o uno nuevo q creen de la misma manera... a un MovieClip en la ruta pongan el nombre del mc.. ("_root.mi_mc.menu=menu"), Se entiende??? yo creo q si :D

Y ahora queda para ustedes meterle mas ingenio y talves hacer muchas cosas q les podrian ayudar.. (yo recien toy experimentando esto.. pero uhh hay infinidad de posibilidades), como por ejmplo podrian modiicar textos, llamar movie clips, cargar peliculas nuevas etc etc etc..
Otro ejemplito sencillo, metan este codigo en su primer frame (en la misma pelicula del ejmplo..):
menu_mc = new ContextMenu();
avanzar = new ContextMenuItem("Mover MC", mover);
menu_mc.customItems.push(avanzar);
menu_mc.hideBuiltInItems();
function mover(){_root.mi_mc._x += 10};
_root.mi_mc.menu=menu_mc

Prueben su pelicula y den clik derecho sobre su MC q habiamos creado al principio (_root.mi_mc.menu=menu_mc --> por q en esta linea especifique q ese menu era para "mi_mc").
Se mueve?? ujule :D
OK espero q esto les sriva de algo y solo les recomiedno q experimenten y hagn sus prubitas.. ^^
Etnonces nos vemos hast la proxima O.o!!
saludos !!! :D

sábado, noviembre 04, 2006

Sistema De Encuesta Mv1.1 En Flash

Wenas wenas (siempre saludos asi o.o, ya le voy a cambiar :P).
Weno pues ahora aqui les dejo un sistemita de encuesta en flash, lo diseñe de una manera q fuera facil de utilizar para cualquiera, de hecho solo hay q modificar las opciones y pregunta.. (tambien pueden cambiar colores de barras y fondo), los votos se van guardando en un archivo de texto asi qno hay problema con eso (por eso es facil de usar nisiquiera tiene q saber mysql :P).
Weno aqui se los presento.... Le falta algo de aspecto pero la funcinalidad ya esta wena... asi qen la version 2 (:P) lo voy a sacar con mucho aspecto visual se va a ver muy weno :),
Soporta hasta 10000Mil votos :).
Se actualiza solo, es decir si hay mas de 160 votos (como se ve en esta grafica al parecer solo llega a 160), si hubiera mas digamos 1000 o mas la grafica cambia su tamaño proporcinalmente y se podran visualizar lso 1001 votos ^^





Weno la manera de utilizar esta encuesta es sencilla..

1.-Primero se descargan el Zip de este link

2- El archivo encuesta.txt es donde se guardan lso votos.. asi q ese lo dejamos asi... (claro q ponemos todos en 0 primero :P)
3.- En archivo data.txt lo deven modificar a su gusto.... ahi pueden modificar lso colores, lsa respuestas y la pregunta.... Esta muy facil..
4.- Despues de esto todos esos archivos los suben a su servidor en la misma carpeta.
5.- Ya cuando suban lso archivos al encuesta.txt le deven dar permiso 777
(Para esto suben el archivo y cuando este listo le dan clik derecho sobre el y buscan "file Atributess" [Normalmente viene asi], ahi veran un cuadro q dice "write, read, Execute" selecionan todos o si tiene la opcion de "Valor Numerico" escriben 777).

6.- Listo !! :P, ya esta listo para ser usado.... :)

Weno espero q a alguno les sirva, y esperen la version 2 :P!!! XD

Version Mv2:
Diseño Grafico Mejorado
Podra Ser Usado Con Mysql
Fla Incluido xd
Y haber q mas o.o

Saludos y suerte!!!!! :)

viernes, noviembre 03, 2006

Retroceder Linea De Tiempo :D!!!

Wenas :D!!!!
Ahora vengo con otro minutorial esta ves se trata de retroceder en la linea del tiempo =O, sip taban preguntando hoy mismo en un foro sobre esto y no habia una wena respuesta... y ya habai oido esta pregunta antes pero igual si nrespuesta :S
asi q me intereso y decidi hacer un script q arregle este problema ^^!!!!
Asi q les presento mi truquito :P (script) funcioan perfectamente y en este tuto les enseñare a usarlo :) ^^!!
PD: No sabia de q escribir en este dia XD, asi q gracias a esa duda tube esta idea y este post... asi q ya saben cualquier otra duda comentario o si quieren algun tuto sobre cualquier cosa avisenme a damuca_10@hotmail.com y con gusto les ayudo ^^ y ya saben q aqui siempre estamso esperando sus comentarios ^^

Aqui esta el ejemplo de como funciona, fijense q funcioan perefecto :P






Se ve weno no?? ok ahora haremso un pequeño ejemplo para q aprendan a utilizarlo en verdad esta muy facil deje el codigo super sencillo de usar`:)
1.- Dibujen por ejemplo un cuadrado y lo convierten en un mc.. ahi dentro de la linea de tiempo de ese mc pueden hacer un efecto tween para q se mueva.. o lo q se les ocurra :), y recuerden ponerle un stp en el ultimo frame.. para q se detenga.
2.- Ahora selecionen ese mc y ponganle un nombre de instancia (para este ejmplo ponganle "mi_mc")
3.- Ahora creen un boton en el primer frame de su pelicula (para esto dibujen por ejmplo un cuadro lo selecionan y presionan F8, ahi elijen button y dan en "ok")
4.- Cuando tengan este btn lo selecionan y en el panel de acciones(F9) pegan el siguiente codigo
on(release){ retroceder("mi_mc");}
Explicacion: Llamamos a la funcion retroceder (q crearemos mas adelante) y le pasamos el nombre del MovieClip q queremos q retroceda :D
5.- Ahora peguen el siguiente codigo en el primer frame de la linea de tiempo principal

function retroceder(ruta) {
ruta1 = ruta
cuadro = 1
if (cuadro<_root[ruta1]._currentframe) {
lado = "atras";}
function retrocede() {
if (cuadro!=_root[ruta1]._currentframe) {
if (lado == "atras") {
_root[ruta1].prevFrame(); }
} else { clearInterval(intervalo); }
updateAfterEvent(); }
intervalo = setInterval(retrocede, 70);}

Y listo ahora pruben su pelicula :D!!! Facil no???
Ahora solo cabe decir q en el codigo del boton esta la clave si por ejemplo quiere hacer retroceder un moie clip q se llama "mc" y este esta dentro de otro q se llama "mc1" entones en el boton lleva este codigo

on(release){ retroceder("mc1.mc");}
Sigue siendo facil no?? XD jeje
Weno espero q les sirva de algo y les funcione correcto.
Cualquier comentario bueno o malo :P pueden dejarlo aqui.
Saludos y suerte!!!! :D!

jueves, noviembre 02, 2006

StarDrag-StopDrag Y Pegado De Clips

Categoria: MiniTuto
Nivel: Principiante


Wenas wenas... :D
En ete mini tutorial se mostrara como crear un breve efecto de pegado de clips asi como utilizar el startDrag y stopDrag Y para esto haremos un breve ejemplo como el siguiente :





1.- ok lo primero q haremos es dibujar un cudrado sin relleno de aproximadamente 60px * 60px
2.- ahora selecionaremos esas lineas haciendo doble clik sobre ellas, y presionamos f8(esto para convertirlas en un MC), selecionamos como tipo: MovieClip, punto de registro: Centro, Nombre:Clip2. y luego presionamos en "OK".


3.- Despues de presionar ok, selecionamos nuestro nuevo mc (clip2) y en el panel de propiedades(Ctrl+F3) le damso como nombre de instancia "clip2".

4.- Ahora crearemos el clip q moveremos, primero creamos una nueva capa y en el primer frame de esta capa crearemos un circulo de 30px * 30px.

5.- Lo Seleccionamso dando doble click sobre el y presionamso F8, lo convertimos en Movieclip, con el punto de registro en el centro y nombre "Clip1". (Como en el punto 2)

6.- Aora selecionamos es MC (clip1) y en el panel de propiedades la damos como nombre de instancia "clip1".

7.- Ahora vien la parte de codigos :), creamos otra capa y la llamamos AS, en esa capa seleccionamso el primer frame y abrimoc el panel de acciones (F9) y ponemos el siguietne codigo:

stop();

clip1inicioX = clip1._x;

clip1inicioY = clip1._y;

Explicacion: Detenemso la pelicual en ese frame (1), y creamos dos variables y cada una contendra las coordenas del clip1 en "x" e "y" respectivamente..

8.- Por ultimo selecionamos el clip1 (la bola) y abrimos el panel de acciones(F9) y pegamos el siguiente codigo:

on (press) {
startDrag(_root.clip1,
true);}

on (release) {
stopDrag();
if (_root.clip1.hitTest(_root.clip2))
{

_root.clip1._x = _root.clip2._x;
_root.clip1._y = _root.clip2._y; } else {
_root.clip1._x = _root.clip1inicioX;
_root.clip1._y = _root.clip1inicioY; }}

Explicacion: Al mantener presionado el clip1 empesamos a arrastrar (startDrag) el clip 1...
luego si lo soltamos (Release) dejamos de arrastrar cualquier objeto q este siendo arrastrado (stopDrag();) y Si! el clip1 esta tocando al clip2 [if (_root.clip1.hitTest(_root.clip2)) ] le decimos q el clip1 se ponga en la coordenada X igual q la coordenada X del clip 2 y los mismo en la coordenada Y [_root.clip1._x = _root.clip2._x;].
Pero si no esta tocando al clip2 [else], entonces q el clip1 se vaya a la coordenada X e Y iguales a las primeras coordenas q estaban antes de ser arrastrados... Se entiende??? creo q si, en verdad es un codigo muy sencillo...

Ejemplo Terminado

Asi de facil :)!!, claro q este es un codigo sencillo q se puede mejorar como por ejmplo para crear rompecabezas u cualquier otra cosa q les diga su imaginacion :P

Espero q les haya servido, y hast al proxima ^^!

Suerte!!

miércoles, noviembre 01, 2006

Ejemplo Practico ComboBox -- Parte 3

Categoria: Tuto
Nivel: Intermedio
Te recomendamos leer los siguientes tutoriales..
Weno ahora sip,,, veremos un ejmplo practico y sencillo de uso de combobox. Al final deve quedar algo asi ^^





Ahora sip, sigan los pasos en verdad es sencillo ^^.
1.- Lo primero q haremos es arrastar el componente combobox al escenario (como en la parte1) y lo selecionan en el escenario y en el panel de propiedades le ponene ocmo nombre de instancia "combo1"
2.- Ahora crearan uan nueva capa y la llamaran imgs (aqui cargaremos las imagenes), en esta capa dibujan un cuadro pequeño.... lo seleccionan y lo convierten en MovieClip(F8), le pueden dar cualquier nombre.
3.- Ahora seleccionan este nuevo movieclip y en el panel de ropiedades le dan el nombre de "contenedor".
4.- por ultimo crean otra capa mas y le dan el nombre de texto, en esta dibujan un campo de texto, lo selecionan y le dan como tipo dinamico y le ponen como nombre de variable "texto" (no importa el tamaño y tipo de letra....). deve ir algo asi..

3 capas, una con el combobox otra con el movieclip contenedor y otra con el campo de tesxto.... Continuemos :P

5.- Ahora rellenaremos nuestro combobox, para esto ahora usaremos otra forma... "dataProvider" esto adhiere nuevos datos a nuestro combo desde un array..

Creamos una nueva capa y la llamamos "AS" y elejimos le primer frame de esta capa, en este frame pegan el sigueinte codigo, Esta facill... Este es el codigo..

losDatos =
["pc","pantalla","teclado","mouse","bocinas","impresora","scanner"];

combo1.dataProvider = losDatos

Explicacion: Primero creamos un array(tabla de datos) q llamamos "losDatos" y le asignamos los textos de pc,pantalla,etc.... y por ultimo al combo1 lo llenamos (dataProvider) con los datos del array "losDatos" es senicllo.

6.- Ya con los datos en el combo lo sigueinte es crear el receptor(listenner) q invoque a la funcion cuando selecionemso algun dato del combo... Como?? como lo vimos en la parte 2 ^^.
en el mismo primer frame de la capa AS agregamos el siguiente codigo...

alcambiar = new Object();

alcambiar.change = function(){

contenedor.loadMovie("imgs/"+combo1.value+".jpg");

texto = _root[combo1.value]

}

Explicacion: Weno como vimos en la parte 2 primero se crea el objeto receptor (en este caso lo llamamos "alcambiar", luego le decimos q cuando cambie(selecione otro dato) haga una funcion, esta funcion lo q hace es en el clip "contenedor" cargar una pelicula q esta en la carpeta "imgs", y esta pelicula tiene el nombre de combo1.value (osea esto se refiere a el dato selecionado, podrai ser pc, pantalla,mouse, etc depende del q selecionen). Por ejmplo si seleciona pc entonces carga la pelicula q esta en imgs y se llama pc.jpg, Sen entiende???? super sencillo no?? y a la variable texto le asigna la variable _root.pc (en este ejemplo), mas adelante sabran q es esta variable _root.pc

y por ultimo solo queda hacer una cosa... agregar el listenner a nuestro combo y definir los textos de cada imagen , para esto usamos el sigueinte codigo..

combo1.addEventListener("change",alcambiar

contenedor.loadMovie("imgs/"+combo1.value+".jpg

//Creamos las variables con la informacion de cada imagen
pc = "Texto para la imagen pc"
pantalla = "Texto para la imagen pantalla."
teclado = "Texto para la imagen teclado."
mouse = "Texto para la imagen mouse."
bocinas = "Texto para la imagen bacinas."
impresora = "Texto para la imagen impresora."
scanner = "Texto para la imagen scanner."

Ahora se entiende??? recuerdan q al selecionar un dato se ejecuta la funcion de arriab?? y esta define la variable texto = a la variable _root.pc (_root.datoselecionado...), asi es, estamos indicando q el campo de texto con nombre de variable texto reciba lso datos de alguna de estas variables q acabmos de crear.. =O!! es super facill... solo piensenlo tantito y entenderan :D!

7.- por ultimo devemos crear una carpeta donde esta nuestro swf, y a esa carpeta llamarla imgs, ahi dentro colocar una imagen con el nombre de los datos, serian pc.jpg, mouse.jpg, pantalla.jpg, etc etc

y ahora aunque no lo crean :P ya esta listo, den Ctrl+Enter y pruebn s pelicua ^^!!!!

Como siempre,, en casa de q no les funcione les recomiendo descargar el fla y revisarlos :).

Weno con esto acabamos, espero q les haya sido de ayuda aunque sea para meterse un poco en el mundo de los componentes... y solo queda esperar el sig tuto asi q revisen el lbog ^^

Suerte!!!

martes, octubre 31, 2006

Como Utilizar Un ComboBox!!! :P -- Parte 2

Categoria: Tuto
Nivel: Intermedio

Te recomendamos leer la parte 1 de este tutorial en el siguiente enlace...

En esta segunda parte aprenderemos a usar los listeners (receptores) q son necesarios para poder manipular correctamente nuestras combobox.
Lo primero... Q es un listenner????
un listener (Receptor) es un objecto creado con AS q se encargara de recibir los eventos q sean efectuados por algun componente (No solo las combobox) y efectuar las acciones q se le indiquen.
Son totalmente necesarios para el manejo de nustrso componentes...!!
Los listenners tiene varios eventos q son los siguientes:

Evento

Descripción

change

Se ejecuta cuando selecionamos algun dato.

open

Se ejecuta cuando abrimos el componente.

close

Se ejecuta cuando cerramos el component.

itemRollOver

Se ejecuta cuando pasamos por encima de algun dato.

itemRollOut

Se ejecuta cuando salimos fuera de algun dato.

scroll

Se ejecuta cuando utilizamos el scroll en nuestro componente.


Ahora sabiendo esto...
Es hora de aprender a crear nuestros receptores :D!! ^^.
1.- Primero crearemos un combobox y lo llenaremos de datos con se explica en la parte 1 de este tutorial.
2.- Selecionamos nuestro combobox y en el panel de propiedades(Ctrl+F3) le ponemos como nombre de instancia "combo1".
3.- Ahora en el primer frame de nuestra pelicula, en el panel de acciones (F9) colocamos el siguiente codigo:

alcambiar = new Object();

alcambiar.change = function(evento)
{ trace(evento.target.value);
};

combo1.addEventListener("change", alcambiar);

Explicacion del codigo: Primero creamos un nuevo objeto (q sera el receptor) y lo llamamos "alcambiar", luego a este objeto le asignamos el evento "change", y como vemos cuando este evento se realize sera llamda una funcion q nos mostrara en la pantalla la selecion q elejimso del combo....
Ahora por ultimo tenemos q asignarle este receptor a nustro combo y seria con la ultima linea... Q se lee asi:
combo1 agregale un receptor ("aqui va el metodo",elnombre de nuestro objeto receptor);
Sencillo :D!, por ultimo falta agregar q es un solo objeto receptor puede ser agregado a varios combos... por ejemplo si tenemos 3 combos, hacemos un solo objeto receptor y se lo aderimos asi:
combo1.addEventListener("change", alcambiar);
combo2.addEventListener("change", alcambiar);
combo3.addEventListener("change", alcambiar);

Ahora prueben su pelicula (Ctrl+Enter) y selecionen alguna opcion de su combo... en pantalla deven recibir el nombre de su selecion... :)

ahora lo q les rresta es probar con los demas metodos... es la misma forma solo cambien el nombre del metodo. por ejmplo probemos con el metodo de "open"

alabrir = new Object();

alabrir.open = function(evento) {

trace("Me Abriste");
combo1.addEventListener("open", alabrir)

Ven!! es lo mismo solo cambien lso metodos :D!, solo resta decir q asi como un solo objeto receptor puede ser aderido a variso componentes... 1 componente puede recibir varios objetos receptores. Esto quiere decir q a un solo combobox le puede dar el metodo de "open" "close" "itemRollOver" etc etc :)!!

En el siguiente ejemplo vemos los 6 metodos aprendidos aqui :), Recuerden descargar el ejmplo en caso de q nos les resulte bien el ejmplo, para q lo chequen y vean com oes ^^





--Descargar Fla--

PD: Al rato pongo al parte 3 donde aprenderemos con un ejemplo practico ^^

Suerte !! :)

lunes, octubre 30, 2006

Como Utilizar Un ComboBox!!! :P -- Parte 1

Categoria: Tuto
Nivel:Intermedio

Wenas wenas ^^.
Combobox o.o Como Usarlas!!! XD
En este tutorial lo q buscamos sera mostrarles la manera correcta de utilizar un combobox, asi como sus propiedades y metodos propios de los componentes...
Esperemos q al final de este tutorial uds sean capaces de manejar un combobox de una manera facil y correcta y para esto explicaremos paso a paso sus metodos y desarrollaremos un ejmplo practico :D! ^^.
(Asi es... aveces hay q leer un poco :P)
Weno primero lo primero... Q es un ComboBox y para q nos sirve... ?????
Un combobox es un componente de flash y como su nombre lo indica es una cajaCombo, es decir una puequeña caja q nos permite tener varias opciones y elejir una de ellas... y su funcion principal es ahorrarnos espacio e nuetras webs... ya q no es lo mismo tener 10 opciones en un espacio de 200height... q en un espacio de 10height :P ^^, y ademas de darle un mejor aspecto a nuestro diseño.
y si! son faciles de usar :P, despues de un poquito de practica ^^.
Ahora entes de empesar (O.o), este tutorial se va a ir un poco largo, para q todo quede bien entendido.. asi q talves se lleve dos articulos, asi q avansen lo q puedan :P y mañana coloco el segundo articulo......

Creando nuestro primer combobox :D!
1.- Lo primero sera, abrir un nuevo arcvhivo. Ahora presionar Crtl+F7 (se les abrira la siguiente ventana de componentes).
Guiense por la imagen y cuando encuentren el componente combobox lo arrastran hacia el escenario...
2.- Ahora le daremos los datos a nuestro combobox.. hay muchas maneras pero por aora explicare la manera mas sencilla, seleccionan su combobox en el escenario y presionan Alt+F7 para abrir el component inspector (inspector de componentes..).
Se van a "parameters" (Parametros). vemos varias opciones les explicare las dos mas importantes...
Labels = Estas serian las entradas... es decir el contenido q llevara nuestro combobox..
rowCount = El numero de datos q puede tener nuestro combobox.. si por ejemplo le ponemos 5, pero agregamos 6 entradas(labels), al abrir nuestro combobox podremos ver las 6 pero habra un pequeño scroll.. (les recomiendo q prueben).
3.-Ahora le pondremos informacio na nuestro combobox, para esto en el component inspector, seleccionamos labels y presionamos la lupita (vean la imagen de abajo) ahi se nos abrira una nueva ventana le damos al boton "+" para agregar entradas y escribimos l oq queramos.. :D! (Escriben 3 o 4 cosas y luego den Ctrl+Enter para probar al pelicula).


Espero q todo vaya bien :D, y continuare con este tuto en un rato mas, q ahora tengo q hacer unas cosas :S!! XD. En la siguiente parte veremos como crear los listenners (receptores) y como usarlos para poder manipoular nuestras combobox :D!, Como en el siguiente ejemplo ^^!





En este link encontraran la parte 2 de este tutorial donde aprenderemos a usar los listenners (receptores) para un mejro control de las combobox :D!
--ACA--

Saludos ^^

sábado, octubre 28, 2006

Me dejo con la boca abierta.... por 1 semana O.o!!!

Esta marca, de la casa Daimler Chrysler, siempre se ha distinguido por sacar autos de calidad y con muchísimo estilo: sobrios, elegantes y obviamente costosos.

Realmente de los carros no es que quiero hablar hoy sino de un sitio promocional de una de sus líneas de carros.
Realizado totalmente en Flash, es una demostración más que la creatividad no tiene límites y que el uso adecuado de este programa permite cosas fabulosas.
No se a ustedes pero a mi, definitivamente me impresionó su manejo de la imagen y su gran calidad creativa, además, una alta dosis de ActionScript….

Al igual q yo se quedaran con la boca abierta por semanas XD!! y les recomeindo q practiquen hasta q logren hacer cosas asi :D! ^^

Aca Esta La Web www.a-to-s.co.uk

Saludos :D! ^^

jueves, octubre 26, 2006

Efectos De Texto

Categoria: Tuto
Nivel: Principiante

Wenas wenas, e andado muy ocupado o.o (con al excuela :S!!!) pero me toy dando un tiempito pa el blog :) ^^ (ya era hora no XD!!! ).
Ahora vengo a mostrarles algunos de los efectos ya incluidos en las versiones de flash MX y posteriores (en mi caso es flash 8 ^^).
En el siguiente ejemplo los primeros 4 ejemplos estan creados con efectos ya incluidos en flash y el ultimo es uno hecho con un poquito de AS2 (ActionScript2)... q explicare mas adelante ^^.






---Descargar Fla---

Ahora explicare los ejemplos 1-4, son muy faciles de usar y no se necesita nada mas q uan breve explicacionsita..


Lo primero es q creen un campo de texto statico, para esto lo unico q hay q hacer es selecionar la opcion de texto, y presionar en el escenario, con esto crean un campo de texto, selecionan el capo de texto y abren el panel de propiedades (ctrl+F3), y selecionan "static text(texto statico)".

Ahora escriban algo.. lo q sea ^^ xD.
Denle clik derecho sobre el campo de texto y les apareceran varias opciones, se van a "Timeline Effects -> Effects -> Selecionen cualquiera de lso cuatro efectos.."

Asi de facil o.o, en los ejmplos de arriba veran q hace cada uno de estos cuatro ejemplos...., lo q haces en selecionar cualquiera y se abrira una ventana donde pueden modiicar algunas cositas muy sencillas y denle en preview para ver como va quedando..., al fianl solo den click a aceptar y listo :D! ^^. Supeor sencillo en verdad.. pruebenlos.

Efecto De Texto 5

Y ahora si, les explicare un poco el efecto 5, este en verdad no es un efecto q solo se pueda utilizar en un texto, sino es un efecto para un movie clip... y de lo unico q se trata es de un poco de motion Tween y AS2. Veamoslo..
Lo Explicare con un campo de texto, pero recuerden q puede ser usado con cualquier forma o cosa.

1.- Creen un campo de texto estatico con cualquier frase...

2.- Selecionenlo y presionen F8 en el cuadro selecionen MovieClip, pueden ponerle cualquier nombre, luego den click en aceptar.

3.- Ahora en la linea de tiempo principal del movieclip q acabamos de crear (para entrar a la linea de tiempo de un mc, es cuestion de hacer doble click sobre el.....), le damos un efecto de motion tween, puede ser cualquiera, girar, moverse, girar y moverse xD cualquiera, no importa la duracion de los frames, pero para este ejmplo digamos q el efecto dura 30Frames.

Ahora regresen a la linea de tiempo principal haciendo clik en "Scene 1" en la parte superior de la linea de tiempo.

4.- Denuevo en la linea de tiempo rpincipal faltan alguns cositas por hacer asi q no se aburran O.o XD, primero selecionamos denuevo nuestro MC y en el panel de propiedades (Crtl+F3) le ponemos como nombre de instancia "logo".

5.- Ahora en la linea de tiempo princial crean una nueva capa, en esa capa se van al frame 31 y precionan F6 (para crear un key Frame), luego en esa capa dan F6 en los primeros 5 Frames (esto para crear 5 nuevos keyFrame´s), Ahora (no se reborujen....) en el primer KeyFrame (De los 5 q crearon al final) pegan el siguiente codigo:

duplicateMovieClip("logo", "logo2", -2);

En el segundo el siguiente codigo:

duplicateMovieClip("logo2", "logo3", -3);

setProperty("logo3", _alpha, 40);

En el tercero el siguiente codigo:

duplicateMovieClip("logo3", "logo4", -4);

setProperty("logo4", _alpha, 30);

En el cuarto el siguiente codigo:

duplicateMovieClip("logo4", "logo5", -5);

setProperty("logo5", _alpha, 20);

Por ultimo el quinto:

duplicateMovieClip("logo5", "logo6", -6);

setProperty("logo6", _alpha, 10);

6.- Por ultimo, selecionan el frame 30 de la capa donde tienen el mc y presionan F6. Les deve quedar algo asi:

Ahora prueben su pelicula (Ctrl+Enter). y listo :D!!! ^^ (espero q si lo hayan podido hacer O.o XD, si no descarguen el fla para q lo revisen bien...).

Explicacion del efecto: mientras el mc "logo" se va moviendo con el motion tween, se va creando una copia de este en cada pocicion, cada una con un alpha menor para q paresca q desaparece.... simplemente eso ^^.

Y listo! :P, en verdad es muy sencillisisisismo este efecto pero talves algunos se les haga complicado, asi q si no les quedan bien descarguen el fla para q lo rebisen...

PD: cualquier duda o comentario no duden en postearlo aki mismo ^^
Saludos :D!

sábado, octubre 21, 2006

Motion-Shape Twenn (Interpolacion De Movimiento)


Categoria: Tuto
Nivel: Principiante

Wenas wenas ^^ pos aki denuevo, ahora para habalr del motion tween (animacion de movimiento) y el shape tween (animacion de forma), una persona me pidio q hablara de este tema, asi q aki tamos ^^
Aca tan los 3 ejemplos q cree para este tuto y el fla.
Trataremos de explicar como hacer cada uno de ellos ^^






Motion Twenn - Ejemplo 1
Selecionamos el frame 1 de nuestra pelicula, y dibujamos un rectangulo con la herramienta de rectangulo.
El siguiente paso es darle los frames q queramos q dure nuestro movimiento, entonces selecionamos al fotograma 40(puede ser cualquiera...) y presionamos f6 (el f6 como sabemos xD, crea un nuevo fotograma clave).
ahora selecionamos cualquier fotograma entre el primer y el fotograma clave(40), le damos click derecho y selecionamos Create motion Tween. Veremos q en nuestra linea de tiempo nustros fotogramos q estan entre el 1 y el fotograma clave se pondran de un colo morado y con una flecha de lado a lado, esto nos indica q ahi hay un motion twenn.
Ahora selecionamos el ultimo fotograma del motion twenn (el fotograma clave 40), y selecionamos el rectangulo y lo movemos por ejemplo mas a la derecha.
Damos ctrl+Enter (para probar al pelicula) y veremos q nuestro rectangulo se mueve de la pocicion inicial (fotograma 1) a la ultima pocicion (fotograma clave 40).
Facil verdad :D!
Ahora el efecto para q gire:
selecionamos algun fotograma del motion tween q este en medio del principal y el clave, y nos vamos al panel de propiedades (Crtl+F3), ahi vemos las opciones, nos vamos a rotate y elejimos CW(ahi gira hacia adelante) o CCW (gira ahcia atras), en times elejimos el numero de veces q gire 1,2,3 etc etc. Ahora damos Ctrl+Enter(para probar) y listo :D!
y El efecto de color:
primero deves irnos al primer frame de nuestro motion twenn (es necesario q sea el primero), ahi selecionamos la figura y nos vamos al panel de propiedades(Ctrl+F3), en el panel de propiedaes a la derecha tenemos un recudro q dice: Color "None", ahi seleccionamos Tint y elejimos cualquier color q nso guste :P (diferente al original). Ahora probamos la pelicula (Ctrl+Enter) y listo :D! XD ^^
Peluchis!!! (Como dice mi maestra de informatica del bachilleres q no sabe nada xD!!!!)

Motion Twenn - Ejemplo 2
Es necesario q hayas leido el ejemplo 1
En este segundo ejemplo vemos lo mismo q vemos en lo de arriba xD un movimiento, solo q esta ves el movimiento sube baja, retrocede y avanza de una manera algo extraña xD.
Para esto usaremos "GUIAS", =o xD, es mas facil de lo q creen ^^!
Primero hacemos un motion twenn (lo pueden hacer en un nuevo documento ó en una capa nueva -- Por ahora para q vayan practicando les recomiendo q lo hagan en un nuevo documento) .....como lo explique arriba : Hacen la figura, en el primer frame, se van a un frame diggamos al 40 hacen click derecho en algun frame del medio y selecionan "create motion Twen".
Ahora crean una nueva capa, asegurense q la capa tambien tenga 40 frames (la ponen arriba de la cpa donde tieen el motion tween), y ahi dibujan una linea (para arriba atras abajo etc etc) con el lapiz, despues de tener la linea selecionan la capa de la linea y le dan clik derecho, luego selecionan guide.
Les deve quedar como en la primer imagen de abajo, luego arrastran la capa del motiontween hacia la capa de la guia como se ve en la segunda imagen, y la sueltan para q les quede como en la tercer imagen :D!
Pudieron?? Espero q si xD, ahora solo queda una cosa por hacer, se van al utimo fotograma de la cpa donde tienen el motion tween (q seria el fotograma clave del motion tween), y arrastran su figura hacia el punto final de la linea de guia, cuando esten sobre el final de la guia el objeto veran q se "pega" a ella, ahi sueltenlo....
y depues solo den Ctrl+Enter (para probar).
:D"!! vieron q fue facil !!! ^^
Motion Twenn - Ejemplo 3
Es necesario q hayas leido el ejemplo 1
ahora veremos como se hace este tercer efecto, a este efecto se le llama "easing", vemos como el cuadrado comienza a avanzar rapidamente y frame con frame va disminuyendo su velocidad hasata llegar a 0, y el circulo como comienza despacio- acelera - retrocede y acelera.
esto es muy sencillo son opciones q encontramos en el panel de propiedades.
Lo primero es q hagan un motion tween (como en el primer ejemplo), luego selecionan algun frame entre el primero y el clave de su motion tween y se van al panel de propiedades, ahi veran "ease" y "edit", pongan por ejemplo en ease el numero 50 y pruebn su pelicula (Ctrl+Enter), veran q el objeto comienza a moverse rapido y luego lento... Asi de simple :D!
Ahora selecionen "edit" y muevan la linea en varias direcciones, y luego den en ok y prueben la pelicula XD, veran algun movimiento extraño O.o, depende como hayan dejado la linea ^^
Ta facil y ta weno, un poquiitito de practica y listo :D!
Nos vemos al proximo tutorial xD!
Saludos!!!