Upload
ximenez-mijares
View
19
Download
4
Embed Size (px)
Citation preview
Taller de informática IIDCMM
Ing. Luis Carlos Cañaveral SarmientoProgramación Básica
Acerca del profesor
Administrador de sistemas de información (Aptech)
Ingeniero de Sistemas (EAN) 4 certificaciones de casas de software Maestría en Computación Grafica
(Andes) IM : [email protected] Celular: 312 433 05 41
Convivencia
Los celulares se ponen en silencio durante clase No se sale a contestar
Dudas al inicio de la clase Mientras el docente habla, pantallas
apagadas
Metodología
Actividad Autónoma(semanal-individual) Tutorial en video o flujo de tareas Entregable(aula Virtual)
Lectura Lateral(semanal individual). Observación Teórica(Docente) o taller Notas: 0, 1, 2, 4, 5
Agenda
Introducción a Flash Separando la lógica de las fuentes Importación de contenido Animación
lineal no lineal
Manejo de la línea de tiempo con Actionscript
Mejores practicas
Introducción a Flash
Línea de tiempo Capas
Normal Guía
Guía de movimiento
Mascara Depende de dos capas(mascara y contenido)
Carpeta
Introducción a Flash
Herramientas Conjunto de acciones que me permiten
alimentar el contenido de mi canvas Canvas y zona de trabajo
Dimensión() Todo el contenido que este fuera del
canvas no será visualizado(por defecto)
Introducción a Flash
Propiedades Representa una acceso rapido a las
propiedades basicas de los objetos Fotograma Objetos
Movie Clip Button Component Group Texto
Introducción a Flash
Paneles Acciones Librería Salida Alineación Paleta de colores Explorador de película escenas Componentes
Introducción a Flash
Frames Vacios llenos Interpolados labels
Separando la lógica de las fuentes
Este problema se origina cuando tenemos proyectos flash muy grandes #include Clases
Solución intermedia, programar todo el contenido en el primer frame
Esquema esclavo-maestro Creando librerías de objetos comunes
Importación de contenido
Imágenes Png, jpg, gif, bmp …
Audio Wav, mp3 …
Video Embedido
Quicktime, AVI y MPG(dependencia codec)
Vinculado FLV
Importación de contenido
SWF Illustrator AI / EPS Photoshop PSD
Animación
Lineal Interpolaciones
Movimiento Forma
Cuadro a cuadro No Lineal
Con ayuda de Actionscript
Manejo de la línea de tiempo con Actionscript
stop()
gotoAndStop()
numero de frame 3
nombre del label “test1”
gotoAndPlay()
numero de frame 3
nombre del label “test1”
Mejores practicas
No utilizar escenas Utilice esquema esclavo-maestro
loadMovie() Intente tener el menor numero de
frames posibles en la línea principal Técnica de multiniveles
Separe la lógica de la presentación
Agenda
Introducción a la programación historia Bases
Actionscript Evolución Versiones Bases Usos comunes
Introducción a la programación Durante décadas ha evolucionado la
forma como se programa la ejecución de una aplicación
1ra, 2da, 3ra y 4a Generación Es importante entender que queremos
hacer antes de empezar a codificar(Diagramas)
Introducción a la programación
Todo Aplicativo de software ha sido codificado
Un PC solo procesa, no infiere Pensamiento secuencial Es como bebe, debemos decirle que hacer
paso a paso Muchas tareas pueden llegar al mismo
punto(variabilidad).
Diagramas de Flujo
Son abstracciones que nos permiten definir el flujo de una tarea
Elementos: Inicio Entrada Expresión Decisión imprimir Final
Ejercicio
Vamos a descomponer las actividades que usted realiza en su al levantarse y prepararse para ir al trabajo.
Intente ser lo mas detallista posible Numere las acciones de 1 a N
Solución del profesor
1. inicio
2. Levantarse
3. Desvestirse
4. Prender la ducha
5. Entrar en la ducha
6. Enjabonarse
7. Aplicarse shampu
8. Enjaguarse el cuerpo
9. Retirar el shampu
10. Apagar la ducha
11. Salir de la ducha
12. Secarse
13. Ponerse la ropa
14. Ir a cocina
15. Si hay café entonces ir a 16 sino ir a 17
16. Tomar café
17. Preparar café
18. Tomar café
19. Salir de la casa
20. Ir a la avenida
21. Si es mi bus entonces ir a 22 sino ir a 22
22. Parar el bus
23. Subir al bus
24. fin
Actionscript(Bases)
Asignación Tipos de Datos Funciones Donde podemos escribir Actionscript en
Flash Múltiples líneas de tiempo
Asignación
Recordando el Algebra del colegio x = 5 y = 6 z = x + y
Recuerde que una letra o referencia(conjunto de letras) puede guardar un valor(x = 5) asignándolo (=)
En el ejemplo anterior el valor de z = 11 porque z= x +y que es z = (5) + (6)
En actionscript estas letras o nombre son llamadas variables y estas pueden almacenar valores(y=6) o expresiones(z=x+y)
Sintaxis para declarar/asignar variables var nombrevar var nombrevar = valor var nombrevar:Number = 27 var nombrevar:String = “valor”
var altura = 5; var ancho= 4.35; var apellidos = "Moreno García" ;
AS es CaseSensitive
Esto implica que un nombre de una referencia o una variable siempre será diferente si se intercalan Mayúsculas y minusculas:
miVariable
Mivariable
MIVARIABLE Son referencias distintas
Tipos de Datos en Actionscript Number: permite guardar información de
un numero entero o decimal String: nos permite guardar información
de un conjunto de caracteres(“espacio”, “enter”, “luis carlos”)
Boolean: permite guardar la información de un valor booleano(falso o verdadero)
Otros… Object, Array, null, undefined
Asignación(Ejemplos)
Guardar el nombre y la edad del usuario
Calcular un numero
var nombre = “Luis Carlos Cañaveral”var edad = 27;trace(“mi nombre es ” + nombre)trace(“mi edad es ” + edad )
var x = 5var y = 6var z = x+ ytrace(“z: ” + z)
y = 20trace(“z: ” + z)
Asignación(Ejemplos II)
Valores booleanosvar hoyEsViernes = true;var hayFiesta; If(hoyEsViernes == true){ hayFiesta = true;}else{ hayFiesta = false;}
Operadores
Asignación(=) x = y = z = 23; Aritméticos: Descripción Símbolo
Suma +
Incremento ++
Resta -
Negación unaria
-
Decremento --
Multiplicación *
División /
Módulo %
Operadores II
Lógicos: Operador Significado
==
Igual (==)Devuelve verdadero si los operandos son iguales.var1 = 4; var2 = 54 == var1
!=No igual (!=)Devuelve verdadero si los operandos no son iguales.var1 != 5
>
Mayor que (>)Devuelve verdadero si el operando de la izquierda es más grande que el de la derecha.var2 > var1
>=
Mayor o igual que (>=)Devuelve verdadero si el operando de la izquierda es más grande o igual que el operando de la derecha.var2 >= var1var1 >= 4
<
Menos que (<)Devuelve verdadero si el operando de la izquierda es menor que el operando de la derecha.var1 < var2
<=
Menor o igual queDevuelve verdadero si el operando de la izquierda es menor o igual que el operando de la derecha.var1 <= var2var2 <= 5
Operadores III
Logicos II:
&&
And lógico: expr1 && expr2Si el resultado es false, devuelve expr1.Si el resultado es true, devuelve expr2.Funcionamiento:Falso && Verdadero -> False.Falso && Falso -> False.Verdadero && Falso -> False.Verdadero && Verdadero -> True.
||
OR Lógico: expr1 || expr2Si el resultado es true, devuelve expr1.Si el resultado es false, devuelve expr2.Funcionamiento:Falso || Verdadero -> True.Falso || Falso -> False.Verdadero || Verdadero -> True.Verdadero || Falso -> True.
!
not lógico!expr
Si expr es verdadera, devuelve false.Si expr es falso, devuelve true.
Funciones
Son utilizadas para encapsular porciones de código
Nos permite optimizar nuestro código para no hacer cosas repetitivas
Sintaxis:function nombreFuncion (argumento0,...,argumentoN) {
sentencias
}
nombreFuncion();
Funciones(Ejemplos)
Decir Hola
Calcular el numero cuadrado
function hola(){ trace(“Hola luis !!!!”)}
function cuadrado(num){ trace(“el cuadro de”+num +” es ”+num*num)}
Donde podemos escribir Actionscript en Flash Fotogramas En los Objetos
MovieClips Botones Componentes
Actionscript(usos comunes)
Propósito: Controlar Línea de Tiempo Controlar eventos y cambiar las
propiedades de un MovieClip’s y Buttons Arrastrar y soltar MovieClip’s Generación de contenido Cargar elementos externos
Imágenes, sonidos, otros swf’s
Eventos de los Botones
Presionar (Press): Se produce al hacer clic con el ratón sobre el botón, mientras el puntero se encuentra sobre el botón.
Liberar (Release): Se produce al soltar el botón del ratón mientras el puntero se encuentra sobre la instancia de botón. Equivalente a onClick. Es el evento por defecto en Flash.
Liberar fuera (Release Outside): Se produce, una vez hemos hecho clic sobre el botón, al soltar el botón del ratón fuera de la instancia del botón.
Situar sobre objeto (Roll Over): Se produce al desplazar el puntero del ratón sobre el botón. equivalente a onMouseOver.
Situar fuera de objeto (Roll Out): Se produce al desplazar el puntero del ratón fuera del botón. Equivalente a onMouseOut
Eventos de los Botones II
Arrastrar sobre (Drag Over): Se produce al presionar el botón del ratón mientras el puntero se encuentra sobre el botón, se desplaza fuera del botón y, a continuación, vuelve a desplazarse sobre el botón.
Arrastrar fuera (Drag Out): Se produce cuando el botón del ratón se presiona con el puntero sobre el botón y, a continuación, el puntero se desplaza fuera del botón.
Presión de tecla (Key Press): Se produce cuando se presiona la tecla especificada en el campo asociado
Eventos de los MovieClip
load: al insertar el movieClip en el stage unload: al remover el MovieClip de la stage enterframe: se ejecuta en cada cuadro, si tenemos 20
Frames/seg se ejecutara 20 cada segundo mouseMove: cuando se mueva el mouse mouseDown: cuando el usuario oprima el click izquierdo keyDown: al oprimir una tecla keyUp: al liberar una tecla data: cada vez que el MovieClip pida datos externos y llegue la
respuesta
Múltiples líneas de tiempo
Una de las características principales de flash es que podemos tener N líneas de tiempo incrustadas dentro de otra
Múltiples líneas de tiempoSe refiere a... Actionscript
Línea de tiempo principal de la película _root
Variable en la línea de tiempo principal _root.x
Variable x en la instancia clip1 en la línea de t. principal
_root.clip1.x
Variable x en la instancia clip2 dentro de la instancia clip1 en la línea de t. principal
_root.clip1.clip2.x
Una línea de tiempo por encima de la actual, en la que está el clip de película
_parent
Variable x en la linea de t. por encima de la actual
_parent.x
Variable x en la línea de t. que contiene el clip que contiene el actual clip
_parent._parent.x
Variable x en la instancia clip1 en la actual línea de t.
clip1.x
variable x en la instancia clip2 que reside dentro de la instancia clip1 en la actual línea de t.
clip1.clip2.x
Variable x en la línea de t. principal de una película cargada en el nivel 1
_leve1.x
Variable x en la línea de t. principal de una película cargada en el nivel 2
_level2.x
Línea principal
clip1var x = 10
var x = 13 clip2
var x = 13
Hoja de Vida Multimedia
El objetivo del ejercicio es hacer una hoja de vida en flash.
El usuario hará click en cada uno de las sub secciones que usted proponga. (perfil, estudios, historia laboral, entre otros)
Cada sección estará divida por 15 cuadros, donde el primero al ultimo será la entrada de la sección
Hoja de Vida Multimedia
Utilizaremos el siguiente script para los botones:
btn_perfil.onRelease = function(){
gotoAndPlay(15);
}
Bibliografía
Essential Actionscrip 2.0 – O´Reilly Media
URI : http://www.programacion.com/tutorial/actionscript/