1. ¡OFERTA! con cupón "DIRVPS": hosting por $0,01 y también VPS Linux y Windows por $0,01 el primer mes por Interserver ← publi
    Descartar aviso
Descartar aviso
Al usar este sitio web, aceptas que nosotros y nuestros socios podamos establecer cookies para fines tales como personalizar el contenido y la publicidad. Más información.

[Tutorial] Flash CS 3 y ActionScript 3.0 Introduccion

Tema en 'Tutoriales Desarrollo Web' iniciado por kitsch, 26 Abr 2007.

  1. kitsch

    kitsch Nuevo usuario

    Bien, como lo prometia les traigo el primer tutorial de la casa sobre Flash CS 3 y ActionScript 3.0. En este tutorial veremos pequeñas referencias del lenguaje y del nuevo entorno; pero mas que nada sera una guia descriptiva de todos los cambios que ha sufrido nuestro adorado flash. En esta version es mucho muy notoria la inclusion de Adobe al entorno de Flash, de hecho el viejo entorno al que nos tenia acostumbrados Flash (De hecho toda la gama Macromedia Estudio) desaparece, ahora el entorno es en teoria identico al de Photoshop CS3. No entrare en las cosas que ya se han publicado por todos lados como la compatibilidad perfecta con Illustrator y Photoshop.

    Algo que no se ha dicho, pero que es una realidad bastante cruel para algunos es que ahora si, Flash se separara completamente de sus dos rubros principales: diseño y programacion. Incluso en la version 8, era posible que los programadores se crearan un diseño para sus codigos y trabajaran con ellos; tanto como los diseñadores basados en tutoriales y alguno que otro truquillo bastante simple, pudieran crear webs completas; ahora la introduccion de ActionScript 3.0 como lenguaje nativo de Flash, dividira y dara su lugar a cada uno de ellos; ya que si bien AS. 3.0 no es la complicacion del universo, si es mucho mas estricto en su sintaxis y desarrollo si lo comparamos con el amigable AS 2.0. El ejemplo mas notorio de esto, antes para hacer una web o menu; los diseñadores no necesitaban mas que saber usar play(), stop(), y getURL(principalmente este), ahora getURL aunque presente, se descontinua su uso y genera bastante errores.

    Veamos un ejemplo: <!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->
    boton.onPress = function (){
    getURL("http://www.kitschmultimedia.info/");
    trace("Abriendo web");
    //Esto funcionaba perfecto en 2.0 pero en 3.0 no se ejecutara y dara un error
    <!--c2--></div><!--ec2-->
    Esto es por que los eventos de raton que utilizabamos y algunas de sus funciones mas basicas y naturales desaparecen; onPress, OnRelease, onRollOut, etc; asi como funciones de toda la vidad como getURL. Ahora los eventos seran manejados mediante <b>addEventListener</b>.

    Para poder utilizar nuestros botones, necesitaremos primero crear una funcion (esto en el menor de los casos, porque habra muchas veces la necesidad de hacer clases o incluso packes), un ejemplo seria el siguiente:
    <!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->function link (evento:Event):void {
    &nbsp;&nbsp;&nbsp;&nbsp;navigateToURL (new URLRequest("http://kitschmultimedia.info"));
    }
    boton.addEventListener (MouseEvent.CLICK, link); //Asi es como llamaremos las funciones de los botones
    <!--c2--></div><!--ec2-->

    Deberemos de declarar practicamente todo en ActionScript 3.0 (muy al estilo Java) incluso las funciones, en este ejemplo anterior es forzoso declarar void la funcion, ya que no regresara datos. getUrl() como comentaba ha pasado a mejor vida y viene a desplazarlo navigateToUrl(); que es basicamente lo mismo que la anterion funcion, con la diferencia que este permite eventos controlados (GET, POST, HTTP Heads y montones de cosas que solo los programadores usan); crear un menu ahora sera un poco mas dificil para muchos, pero se obtiene un control completo sobre el, sobre todo si el menu vendra de un XML, PHP o cualquier otra fuente; como decia antes esta diseñado ahora para programadores y para diseñadores sera otra historia (mas delante veremos eso).

    Esto ademas de que el tipo y estilo de programacion a cambiado considerablemente, por ejemplo se van los guiones para definir las propiedades; _y pasa a solamente y; lo mismo para x, alpha, width, etc... y esto es algo que muchos resentiran al momento de querer integrarse a esta nueva tecnologia.

    Ahora en AS 3.0 tendremos que movernos por fuerza por medio de clases, hay muchos cambios sustanciales y debo admitir que mucho mas complejos para la mayoria y a los cuales tendremos que habituarnos. Tal vez lo mas complejo de entender sera el uso de "paquetes" que son conjuntos de clases; cosas como attachMovie se han ido y para los que no entiendan como funciona OOP, programar en Flash CS 3 sera cosa de locos.

    Para los diseñadores esto sera un martirio, pero para los programadores sera lo mismo si quieren diseñar, ya que ahora Flash CS 3 es teoricamente illustrator CS3. La herramienta pluma es identica a la de Illustrator CS 3, el manejo de gradientes y texturas esta super optimizada e incluso veran por ahi algunas cosas que se estrañan de Freehand integradas, pero tambien conserva el estilo de dibujo Flash, lo que hara un entorno muy comodo para trabajar.

    <img src="http://img364.imageshack.us/img364/6946/dib1jp1.jpg" border="0" alt="Imagen IPB" />
    Forma creada con la pluma, 1 objeto y una sombra tambien de objeto, no filtro.

    La importacion de *.AI y *.PSD es impecable, mejor no se podia optimizar creo; el manejo de reglas, proporciones y tablas de color es increiblemente bueno y mucho muy superior a cualquier version anterior de Flash.

    En fin, en esta primera revisión, considero que Flash CS3 es un excelente soft, mucho mas dificil que sus anteriores versiones para aprender si no se esta metido en el rollo Adobe y mas aun si no se es programador o al menos no se tiene una idea clara de programacion, (OOP, metodos, clases y esas cosas); sin embargo si antes Flash fue una herramienta potente, ahora es sin duda todo poderoso, realmente no creo que existan limites para esta version del soft, ya que ahora si tendremos poder completo de nuestro trabajo, ya sean codigos o diseños.

    Pronto la segunda revision y primer tutorial de verdad de Flash CS3
     
  2.  
  3. fonnixed

    fonnixed Nuevo usuario

    veeeerrrdeeeeeee, osea que casi casi aprendes a programar y diseñar o te lleva la ke te trajo???? es decir que si eres usuario basico de flash... como el ejemplo que mencionabas del get url on clip event... y ese tipo de codigos de uso básico sin mayores complicaciones, se fue y si no sabes el OOP metodos y clases; como es mi caso, ya nos llevo la que nos trajo?????
     
  4. kitsch

    kitsch Nuevo usuario

    Pues no es tan así, es solo que ahora el entorno es mas extricto, diseñar no creo que tenga mucho problema si usas cualquier otro vectorial (en especial Illustrator). El problema tal vez radique en los que nunca han programado; pues si sera algo un tanto mas dificil comprender de un solo jalon la estructura del lenguaje (que es la misma que cualquier otro programa OOP).

    Finalmente creo que sera un poco mas dificil entrar al mundo AS 3.0, sin embargo al hacerlo lo haremos ahora de una forma correcta y ordenada, lo cual nos servira practicamente para cualquier lenguaje posterior. Yo creo que vale la pena entrarle.
     
  5. elQuique

    elQuique Usuario activo

    Muy buena intro kitsch

    Sobre lo de mas difícil, yo creo que puede ser mas difícil para quienes ya usamos otra cosa, pero para los que comienzan de cero sera mas fácil.

    fonnixed, para los que solo hacen getURL no es muy importante el código y como se escribe ya que esos usuarios son los que solo copian y pegan :)
     
  6. stomp

    stomp El Unico Humano Que Nacio Con Alas...

    graxs por la intro kitsh espero lo demas x cierto 1 pregunta cual es la diferiencia entre AS 2 Y 3 erstoy hablando de las mejoras, cuales son??, porke por ejemplo si decido seguir programando lo poko que se en as 2 afecta algo o el as es opcional??
     
  7. elQuique

    elQuique Usuario activo

    En Flash CS3 eliges cual utilizar, pero el AS 3 esta realmente mas potente y mejor organizado.

    En otras palabras el AS esta dejando de ser un lenguaje tipo de macros y juguete para ser un lenguaje en serio como los grandes :)
     
  8. stomp

    stomp El Unico Humano Que Nacio Con Alas...

    eso si, me encanta la idea de programar todo, lo malo es que me da hueva y aveces me desespero, pero bueno yo soy designer no coder jeje, de toos moos grxs qq!!

    lo que si me cae de la #$%& es que porque casi rehacer las sintaxis de los as en vez d emejor agregarles mas cosas sobre un mismo tipo de sintax... pero bueno X con el AS, al fin y al cabo tengo que aprenderlo de na me sirve quejarme...jaja
     
  9. adi

    adi Zen Moderator

    Muy bueno Kitsch, espero esos tutos pronto :D
     
  10. kitsch

    kitsch Nuevo usuario

    Segun Adobe y todo su sequito de programadores y desarrolladores, con el AS 3.0 pretender colocar en el lenguaje como una poderosa maquina de programacion, hay cientas de diferencias muy, muy notorias en respecto a su predecesora version.

    Por ejemplo, ActionScript no era un lenguaje de programacion (esto lo venimos diciendo desde hace tiempo) es un entorno de scripts, que como decia Quique funcionaba mas bien como macros, (he ahi los montones de clases que hacian todo mas facil como getURL()). Ahora alser un lenguaje completo, pretende hacer llegar a flash a niveles que antes solo los powers OOP podian (VB, Java, C, C+, C#, Cobol, etc). Por ejemplo, ahora con flash es posible crear llamadas y sockets binarios, lo que permite compatibilidad con cualquier lenguaje sin interpretes mediadores, para que sirve esto; pues para crear programas completos sin necesidad de algun compilador extra, pues Flash CS3 trae un compilador Flex incluido y el motor JIT acelera hasta un 100% la ejecucion de las secuencias de comandos.

    Personalmente no considero que sea malo lo que acaban de hacer, pues ahora hemos obtenido un lenguaje mucho mas amigale que C pero igual de potente en un entorno muy amigable y sobre todo que podemos manipular en la web; por que otra de las mejoras de Flash Player 9 (para los que aun no lo han usado) es que permite inclusiones xhtml que sin legibles por buscadores, una mejora sustancial al CSS y este tipo de cosas. Conforme valla avanzado el uso de este CS3 veremos las mejoras mas a detalle.

    El fin de semana los primeros dos tutos ya casi los termino.
     
  11. stomp

    stomp El Unico Humano Que Nacio Con Alas...

    Graxs Kitsh!!!

    y permite bases de datos???



    como mysql, o sql, o access
     
  12. elQuique

    elQuique Usuario activo

    Es que asi como PHP, ASP, tenes el lenguaje por un lado y la base de datos por otro lado. Con ese concepto el Flash AS 3.0 tiene la clase DataProvider que te permite conectar con un proveedor de datos, pero igual sigue usando XML como intermediario.

    Muchos ven eso como una limitacion, pero yo lo veo como una ventaja de independencia, ya que por ejemplo para desarrollar software en .net la tendencia es el desarrollo en capas y los programadores terminamos haciendo clases y rutinas de conexion a base de datos, por ejemplo tengo una llamada getRecord que obtiene un registro de una base de datos y mi clase de datos segun el driver busca en sql, mysql o access (por ahora :p) y mis programas jamas van directo contra la base de datos.

    Lo mismo pasa en Flash, la clase DataProvider es la capa de acceso a datos y tiene metodos como getItem(), sort(), etc

    Les dejo un PDF con la documentación de la clase :)

    <a href="http://www.forocreativo.net/otr/clase_DataProvider_Flash_AS_3_0.pdf" target="_blank">http://www.forocreativo.net/otr/clase_Data...lash_AS_3_0.pdf</a>
     
  13. adi

    adi Zen Moderator

    Esto último me interesa, gracias Quique :D
     
  14. stomp

    stomp El Unico Humano Que Nacio Con Alas...

    wow gracias qq!!!
     
  15. elQuique

    elQuique Usuario activo

    Si les interesa mas, pueden tomar una goma de borrar de 2 cms x 3 + 1 sacapuntas de metal + 1 caja con 50 clips y unidas con cinta adhesiva en forma de torre, la posicionan sobre la tecla F1, de esa forma aparece esta misma documentación :p jaja

    Fuera de broma, sigan preguntando que es la forma en que me obligan a aprender o recordar a mi para contestar :)
     
  16. kitsch

    kitsch Nuevo usuario

    La verdad es que he estado estudiando mucho estas nuevas clases y sus nuevas funciones (F11 ayuda mucho, de verdad ayuda mucho) y me he dado cuenta que no estan compleja la migracion de AS 2 a AS 3. Tomando el ejemplo este de las bases datos; antes en flash con loadVars() se haria de la siguiente manera:
    <!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->
    var datos:LoadVars = new LoadVars();
    function conectar() {
    /*Las variables username_txt, password_txt, username_txt; es lo que recogeriamos del php consulta, variables del mismo nombre */
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;conectar.username = username_txt.text;
    &nbsp;&nbsp;&nbsp;&nbsp;conectar.password = password_txt.text;
    &nbsp;&nbsp;&nbsp;&nbsp;conectar.action = "login";
    &nbsp;&nbsp;&nbsp;&nbsp;conectar.sendAndLoad("consulta.php", conectar, "POST");
    }//coneccion simple<!--c2--></div><!--ec2-->
    Con esto conectabamos a la base datos sin problemas y pues ya despues escribiriamos las funciones para mostrar los datos obetenidos y estas cosas. Pues bien aunque esto como decia funcionaba perfecto, habia muchos errores y sus muchas limitaciones, sobre todo en el campo de control de datos, como se mostrarian y las propiedades de los campos sin olvidar el volumen de bits permitidos, el cual no es muy alto.

    Ahora en ActionScript 3, funciona casi de la misma forma; solo que ahora lo tendremos que manejar mediante packages y clases, esto nos permitira llamar a los datos en el momento que deseemos, la posiblidad de manejo de bits es mucho mas amplia y la conecctividad con otros lenguajes y su varibilidad de procesamiento es minima. Un ejemplo rapido seria de la siguiente manera:
    <!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->
    //primero que nada declarar el paquete:
    package {
    &nbsp;&nbsp;&nbsp;&nbsp;
    &nbsp;&nbsp; import flash.net.*; //clases de flash.net
    &nbsp;&nbsp; import flash.events.*;&nbsp;&nbsp;//clases de flash.events
    &nbsp;&nbsp;
    public class coneccionPhp()&nbsp;&nbsp;&nbsp;&nbsp;
    {//declaramos la funcion, si sera publica o privada
    &nbsp;&nbsp; public function ConeccionPhp { //creamos la funcion de carga
    &nbsp;&nbsp;//creamos el objeto cargador
    &nbsp;&nbsp; var elcargador:URLLoader = new URLLoader();
    &nbsp;&nbsp;//recordemos que todo se debe declarar en ActionScript 3
    &nbsp;&nbsp;elcargador.addEventListener(Event.COMPLETE, cargaLasVariables);
    &nbsp;&nbsp;//cargamos nuestro php
    &nbsp;&nbsp;var elRetorno:URLRequest = new URLRequest("archivo.php")
    &nbsp;&nbsp;//Creamos el array que contendra los datos
    &nbsp;&nbsp;var lasVariables:URLVariables = new URLVariables();
    &nbsp;&nbsp;//Debemos de definir un metodo de envio de datos
    &nbsp;&nbsp;elRetorno.method = "POST";
    &nbsp;&nbsp;//definifmos el tipo de datos a recibir
    &nbsp;&nbsp;URLLoaderDataFormat.VARIABLES
    &nbsp;&nbsp;//funcion que cargara los datos
    &nbsp;&nbsp;function cargaLasVariables(event:Event)
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;for(var i:Number = 0; i <= elCargador.data.variableRecibida; i++) {
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; trace("Valor1 " + i + " " + elCargador.data["Valor1"+i]);
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
    &nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    &nbsp;&nbsp;}
    }<!--c2--></div><!--ec2-->
    Como se puede ver en el ejemplo no es mas dificil que loadVars; por el contrario es mas simple en cuanto a organizacion y estructuracion, ademas de que esta es una clase y puede ser llamada cuando se nos antoje en nuestros flash; para utilizarlo en nuestras pelis, bastaria:
    <!--c1--><div class='codetop'>CÓDIGO</div><div class='codemain'><!--ec1-->
    import coneccionPhp;

    var pruebaConeccion:ConeccionPhp = new ConeccionPhp();
    //etc etc etc
    <!--c2--></div><!--ec2-->

    Yo que entrarle a esto del AS 3 vendra a ayudarnos mucho a obtener un trabajo mas limpio y preciso, ademas de organizado; finalmente adobe no esta obligando a que hagamos las cosas bien.

    Sigan preguntando que me encanta investigar sobre este tipo de chuches; cosas que no sabia ya las conozco ahora, asi que no se queden con la duda.
     
  17. kitsch.

    kitsch. Guest

    gracias javier , mañana a la mañana lo leere ke ahora es tarde ;)
     
  18. stomp

    stomp El Unico Humano Que Nacio Con Alas...

    javier??
     
  19. kitsch

    kitsch Nuevo usuario

    <!--quoteo(post=215953:date=Apr 27 2007, 10:24 PM:name=stomp)--><div class='quotetop'>CITA(stomp @ Apr 27 2007, 10:24 PM) [snapback]215953[/snapback]</div><div class='quotemain'><!--quotec-->
    javier??
    <!--QuoteEnd--></div><!--QuoteEEnd-->
    Javier Navarro, pa' servile a usted y a dios jejeje :p
     
  20. elQuique

    elQuique Usuario activo

    Mucho gusto :p

    yo creo que stomp penso que kitsh. agradecía mi pdf :) pero no era asi, fue por tu texto inicial y a ahi la confusión.
     
  21. stomp

    stomp El Unico Humano Que Nacio Con Alas...

    <!--quoteo--><div class='quotetop'>CITA</div><div class='quotemain'><!--quotec-->Javier Navarro, pa' servile a usted y a dios jejeje<!--QuoteEnd--></div><!--QuoteEEnd-->

    Muchas Gracias,

    yo soy Josue Sotelo, = MENTE !!
     


Alojamiento web, Hosting Reseller, Servidores Dedicados - All in Hosting


    
    
    
    
Blog · Sitios amigos: GuiaHosting · Unidominios · Interalta ·