domingo, 4 de abril de 2010

entendiendo actionscript para flashlite 1.1

ActionScript es una secuencia de comandos para realizar una funcion en especifico de un archivo basado en flash.

en el presente tutorial aprenderemos y veremos cada una de las funciones,no todas pero si las mas fundamentales,al menos para hacer un menu flash y una breve reseña de lo que hace:




ActionScript:

la estructura general de un actionscript comun y corriente se compone de la siguiente manera:

[code]on(keyPress "") {
            gotoAndStop(1);

        fscommand2("StartVibrate", 45, 0, 1);
        }

        on(keyPress "") {
            prevFrame();
  
        fscommand2("StartVibrate", 45, 0, 1);
        }
  
        on(keyPress "") {
         getURL("application://BlueTooth_Settings", "");
        }[/code]actionscripts:

[code]on(keyPress "") {
            gotoAndStop(1);[/code]esta accion hace referencia a que cuando presionemos la tecla "derecha" la accion que se debera seguir es detenerse en el fotograma numero 1 que en este caso vendria a ser el primer icono.

[code]fscommand2("StartVibrate", 45, 0, 1);[/code]este comando indica que habra una vibracion al hacer uso de la softkey a la cual fue programada una accion en el caso anterior al presionar la tecla "derecha" hara una pequeña vibracion

Next frame y Prevframe:

[code]on(keyPress "") {
            nextFrame();
        }

        on(keyPress "") {
            prevFrame();
}[/code]estos comandos se usan cuando estas en fotogramas que no terminan aun el ciclo de los 12 iconos prestablecidos de modo que si estas en el fotograma 1 para ir a la derecha por ejemplo usaras el actionscript "nextframe" para avanzar al siguiente fotograma que vendria a ser el numero 2,y si estuviese en el ultimo fotograma es decir el 12 se dara la indicacion de si por ejemplo estas en el fotograma 12,usar el comando "gotoAndStop" que traduciendo esto vendria a indicar que va a parar en un fotograma "X".

destinos:

[code]on(keyPress "") {
         getURL("application://BlueTooth_Settings", "");
        }[/code]el siguiente actionscript indica un enlace al menu bluetooth,se esta dando la indicacion de que,al presionar la tecla "enter" se procedera a ir al menu del bluetooth.

los links a las funciones del menu son exactamente las mismas que encontrariamso en algun menu.ml normal,asi que si te sabes las estructuras de funciones de los menu.ml no tendras menor problema con esto.

corchetes:

cabe resaltar que los corchetes son una pieza demaciado importante en este ambito,ya que sin ellos no habria delimitaciones en las ejecuciones y no habria una buena programacion,en resumen delimitan las funcines una de la otra despues de una orden:

[code]on(keyPress "") {
         getURL("application://BlueTooth_Settings", "");
        }[/code]bien espero que les sirva esta pequeña reseña de lo que es ActionScript y sus funciones para que las empleen en sus menusflashlite y tengan un mejor entendimiento sobre el tema

Etiquetas:

las etiquetas son usadas para no estar usando el numero del fotograma,que se logra con esto ??? bien se logra mas rapides en la elaboracion de los menus flash,es decir,en vez de usar lo habital:
[code]on(keyPress "") {
            gotoAndStop(1);[/code]seria manejado de la siguiente manera:
[code]on(keyPress "") {
             gotoAndStop("aplicaciones");[/code]esto suponiendo que etiquete el primer fotograma con dicha etiqueta,es sencible a mayusculas asi que mucho cuidado con esto.
para etiquetar basta solo con elegir el fotograma y en la pestaña de propiedades viene el apartado "fotograma" tal y como la imagen lo indica aqui se etiqueto el 1er fotograma con el nombre de "aplicaciones" esto lo pueden hacer con todos los fotogramas y asi se facilita mas la tarea de programacion de los menusflash:





..::UPDATE::..

USO DEL tellTarget

Los tellTarget son indicaciones que se hacen a algun movieclip,mismos que se hacen mediante botones,los cuales hacen el llamado a determinado frame de algun movieclip(clip de pelicula)

a continuacion se dara una breve explicacion de las funciones que desempeña dicha ejecucion/orden,yo tome de referencia un cuadrado pero si tienen algun movieclip hehco tambien les servira :

iniciamos haciendo una figura de cualquier forma,yo elegi un rectangulo(si teneis cualquier movieclip saltar este paso de lo contrario seguir):



dando clic derecho a la figura elegimos la opcion "convertir en simbolo":



elegimos cualquier nombre,en el ejemplo lo nombre como "animacion" despues, seleccionamos la opcion "simbolo" y aceptamos



despues seleccionamos el nuevo movieclip y en la ventana de propiedades [spoiler]si nolo ven ir a:ventana/propiedades[/spoiler]
al lado del icono con forma de engrane nombraremos al cuadrado como "cuadrado"(nombre opcional) esto nos servira de referencia para el momento de usar este script:



dando doble clic en el cuadrado nos mandara al modo de edicion del movieclip "cuadrado" en el primer fotograma daremos clic derecho y elegiremos la opcion "crear interpolacion de movimiento" en flash CS4 sera "crear interpolacion clasica" tal como lo muestra la imagen:




despues selecionaremos el fotograma 6 y presionaremos "F6" que es el equivalente a dar clic derecho y la opcion "crear fotograma clave"



a continuacion seleccionando el fotograma 10 nos iremos a la ventana de acciones [spoiler]si no lo encuentran irse a Ventana/Acciones[/spoiler]y escribiremos el siguiente ActionScript:

gotoAndPlay(1);
con esto estaremos ordenando que reproduzca despues del diez el primer fotograma nuevamente

como lo muestra la siguiente imagen:





a continuacion nos posicionaremos en el fotograma 20 y presionamos "F6"con esto daremos continuidad a la interpolacion y seguido de esto daremos "F6" nuevamente pero en el fotograma 11



a continuacion crearemos un efecto de brillo en la interpolacion,esto se hace seleccionando el cuadrado del fotograma 11 y posteriormente dirigirnos a propiedades donde se podra modificar este valor[spoiler]hay mas efectos por lo que esto dependera solo de tu imaginacion y creatividad [/spoiler]




en el fotograma 20 si queda del mismo efecto elegiremos en estilo la opcion "ninguno" o si queiren otro efecto dejarlo a como deseen:





Acontinuacion iremos a la esena principal,es decir la "escena 1" o "scene1" en ingles tal y como en la siguiente imagen:



A continuacion crearemos un boton con alguna figura o letras no importa pero que sea boton



en el cual pondremos el siguiente codigo de AS como muestra la imagen:




el codigo lo dejare adjunto por si lo desean descargar
con esto estamos dando la orden de que al presionar la tecla "enter"(central) estaremos dando la orden al movieclip "cuadrado" que en su fotograma 11 reproduzca y salte la secuancia de la orden del fotograma 10,que como vimos era la orden de reproducir nuevamente el fotograma 1.

lo ultimo que queda es guardar el trabajo iendo a archivo/exportar,donde elegiremos la version en este caso flashlite 1.1.




las posibilidades son infinitas con el "TELLTARGET" ya que podemos hacer buenos efectos y mejorar considerablemente la interfas grafica del usuario con respecto a flashlite.

espero que les haya sido de agrado y lo mas entendible el tutorial,cualquier duda es bienvenida en el tema de discucion


bien creo que a sido todo por el momento

saludos

(C)Kaeps

domingo, 28 de marzo de 2010

Creacion de menus flashlite desde cero

el siguiente tutorial tiene como fin la creacion de menus flashlite desde el inicio hasta le final.

¿que necesitamos?

   1. adobe flash CS3 profesional
   2. conocimientos minimos de flash
   3. hablar ingles ya que el AS (ActionScript) se basa principallmente en este lenguaje asi que si lo sabes no habra menor problema
   4. mucha creatividad y empeño para tus menus flashlite

bien comenzemos:

-abrimos adobe flashlite y elegimos "archivo de flash (movil)"



-se abrira una nueva ventana y haremos lo siguiente:



elegimos nuestro dispositivo de la lista que aparece a la izquierda no se preocupen tanto por el modelo lo importante es la resolucion.



despues en version eligen flashlite 1.1,tipo de contenido:navegador,el tamaño de pantalla debera de ser del largo por ancho de su resolucion o bien recortarlo para que sea visible la hora y la fecha,presinamos "create"

-lo siguiente que veran es la interfas de trabajo de flash cs3,aqui una breve explicacion de cada herramienta y su funcion:



linea de tiempo: es el area donde se ejecutaran los frames y las acciones y eventos en general
capas: al igual que en photoshop sirve para delimitar una imagen de otra,y no solo eso,tambien la ejecucion del actionscript.
Biblioteca:es donde se almacenaran los iconos y las animaciones (movieclips) si piensan que aqui estaran los graficos del menu estan en lo correcto
color de fondo:define el background del menu flashlite con una gran variedad de colores

Despues de conocer los aspectos basicos de cada herramienta es tiempo de comenzar con la creacion de nuestro primer menuflash

bien comenzaremos en el primer fotograma,aqui seleccionaremos el fotograma 12 y presionaremos F6 como lo indica en la imagen:



-comenzaremos por agregar nuestro primer ActionScript esta opcion se encuentra en la pestaña de "acciones" que se encuentra en la parte inferior izquierda del programa,en caso de no tenerle,ir a ventana/acciones.o simplemente oprimir F9 para que sea visible.



agregaremos el comando "stop" al fotograma 1 y con esto se indica al menu flash que se detenga en cada fotograma hasta nueva orden.

despues bloquearemos esta capa para no modificar nada mas:



-comenzaremos a importar nuestras imagenes que deseamos para nuestro nuevo menu flash en archivo/importar/importar a biblioteca.. como lo muestra la siguiente imagen:




-ir a la ruta donde estan los iconos y seleccionarlos todos:



-ahora los iconos cargados correctamente se situaran en la Biblioteca en donde podras arrastrarlos y acomodarlos segun el orden que desees:




-lo siguiente sera darle un formato correcto a los iconos,ya que sin esto el menu quedaria con iconos rojos y con otros errores para esto dar clic derecho en el primer icono en la Biblioteca y despues en propiedades:



-aparecera una ventana en la cual en compresion eligiremos sin perdida (PNG/GIF) aceptamos y asi lo hacemos sucesivamente con cada imagen,solo por si queda alguna duda esto se hara con cualquier formato de imagen no importando que sea gif,jpg o png la extencion.



-a continuacion se creara una nueva capa donde iran los iconos y posteriormente se acomodaran en el orden que ustedes elijan:




-en capa2 elegir el primer fotograma y presionar F6 para que se hace esto? nada mas y nada menos que para copiar los 12 iconos en cada fotograma para asi ir definiendocada uno despues y su correspondiente funcion.





-ahora vendra la edicion del primer icono,nos iremos el primero,despues hacemos clic derecho sobre el y lo convertiremos en simbolo tal y como lo muestra la imagen:



-lo convertiremos en un clip de pelicula, o lo dejaremos como grafico si queremos que sea una imagen estatica con un nuevo layer con alguna seleccion independiente segun sea el caso.



-siendo el caso de ser un movieclip (animacion)ya definido en el icono daremos doble clic sobre este,abrira una nueva linea de tiempo donde se tendra que hacer lo siguiente,en cada fotograma iremos haciendo la animacion de la seleccion del icono,y asi con todos los demas,claro esto en su respectivo fotograma(en uno de los 12) terminado el trabajo volveremos a la esena1 dando clic en la opcion del mismo nombre que por lo general se encuentra bajo el "bote de basura":





..::Creacion de las Acciones::..

las acciones son los comadnos que ejecutan lo que se hara o no se hara en un menu flash,anatomicamente hablando vendria a ser el cerebro del menu flash y el cuerpo como sabran,serian los iconos y el entorno grafico

para crear las acciones comezaremos por hacer lo siguiente



crearemos una nueva capa en la cual en el area de trabajo escribiremos la frase "acciones" el nombre no importa mucho solo es una referencia asi que pueden poner lo que se les venga en gana.

NOTA:no escribir la frase en lo que vendria a ser el menu flash,si no en algun area donde nos ea visible,es decir fuera del background.

-convertiremos la frase "acciones" en un boton dando clic derecho/convertir en simbolo/boton....



-hecho esto nos dirigiremos a la pestaña "acciones" y seleccionando el boton escribiremos el actionscipt que estara adjunto al final del tutorial,terminado de estructurar el actionscript haremos uso del F6 tal y como lo hicimos con los iconos soloq ue aqui se cambiaran valores como,la direccion de las flechas y las rutas de los archivos:





-a continuacion una breve explicacion de lo quie hace un actionscript:



-las banderas en un menu flash en proceso de desarrollo son simbolo de que el fotograma esta etiquetado esto con el fin de que al hacer un llamado a esa funcion mediante actionscript:



..::FINALIZACION::..

Una vez terminado el menu flash y los detalles que le haya agregado,el siguiente proceso es el siguiente:
nos dirigiremos a archivo/exportar/exportar pelicula





-lo segundo sera guardar el archivo .SWF de su menu flas donde gusten:



-por ultimo saldra una ventana como la de la siguiente imagen:



En version de flash eligiremos la version 1.1 que estara ya por defaul elegida pero mas vale prevenir incidentes
calidad JPG elegida al 100% y con esto damos en aceptar.

Con esto habeis creado vuestro primer menu flash en horabuena.

si tienes dudas sobre actionscript aqui mimso puedes preguntar,recuerda que nadie nacio sabiendo :)



_______________________________________________________________

un agradecimiento especial a Bemitorella por brindarme sus conocimientos en flashlite sin el no estuviera este tutorial en pie


saludos y a crear sus propios menus flashlite colegas


Es bien sabido por todos que el archivo .fla original (no uno descompilado) nunca lo deja el autor intelectual,es como el sourcecode de un elf que esta bien custodiado,pero en este caso por cuestiones educativas lo dejo para ustedes asi sabran como esta hecho el menu y sera una excelente guia para el tutorial.



(C)KAEPS
(R)Bemitorella




Archivos

Comandos del Tutorial

Lista de comandos

Menu del tutorial


SALUDOS