Documentos de Académico
Documentos de Profesional
Documentos de Cultura
CONTENIDO MANUAL
CAPÍTULO1: EL INICIO................................................................................................................................. 4
1. CREAR UN NUEVO PROYECTO. ........................................................................................................ 4
2. RECONOCER LAS DIFERENTES PARTES DE LA INTERFACE DEL PROGRAMA. ...................................... 6
3. AJUSTAR PREFERENCIAS................................................................................................................ 10
4. MODIFICANDO LA CONFIGURACIÓN DEL PROYECTO. .................................................................... 13
CAPÍTULO 2: GRÁFICOS Y TEXTO............................................................................................................... 15
1. COMENZANDO CON EL CAPÍTULO. ................................................................................................ 15
2. ELIGIENDO UN FONDO DE PÁGINA. ............................................................................................... 15
3. AÑADIR OBJETOS DE IMAGEN. ...................................................................................................... 22
4. AÑADIR OBJETOS DE ETIQUETA (LABEL). ....................................................................................... 29
5. AÑADIR OBJETO PÁRRAFO. ........................................................................................................... 31
6. AÑADIR OBJETO TEXTO ENRIQUECIDO (RICH TEXT). ...................................................................... 32
7. DUPLICAR OBJETOS. ...................................................................................................................... 34
CAPÍTULO 3: BOTONES, ACCIONES Y PÁGINAS ........................................................................................ 35
1. AÑADIR BOTONES. ........................................................................................................................ 35
2. ALINEAR OBJETOS. ........................................................................................................................ 37
3. AÑADIR ACCIONES RÁPIDAS O SIMPLES. ....................................................................................... 38
4. EDITOR DE SCRIPTS. ...................................................................................................................... 40
5. AÑADIR PÁGINAS A NUESTRO PROYECTO...................................................................................... 42
6. NAVEGAR POR LAS PÁGINAS. ........................................................................................................ 43
CAPÍTULO 4: VIDEO .................................................................................................................................. 47
1. AÑADIR UNA IMAGEN DE PANEL COMO FONDO DE NUESTRO VIDEO. .......................................... 47
2. AÑADIR UN OBJETO DE VIDEO. ..................................................................................................... 48
3. AÑADIR CONTROLES DE VIDEO PERSONALIZADOS......................................................................... 49
4. AÑADIR ACCIONES A NUESTRO BOTONES. .................................................................................... 50
CAPÍTULO 5: SONIDO ............................................................................................................................... 51
1. CAMBIAR LOS SONIDOS POR DEFECTO DEL OBJETO. ..................................................................... 51
2. QUITAR EL SONIDO EN LOS OBJETOS. ............................................................................................ 52
3. CONFIGURACIÓN DE EFECTOS DE SONIDO DE UN OBJETO ESPECÍFICO. ......................................... 52
4. AÑADIR MUSICA DE FONDO A NUESTRO PROYECTO. .................................................................... 52
CAPÍTULO 1
EL INICIO
1) Abre el AutoPlay.
2) Cuando aparezca la ventana de Bienvenida, haz clic en "Create a new project" (Crear un nuevo
proyecto). La ventana de Bienvenida aparece siempre que inicias el AutoPlay Media Studio. Esta te
permite crear fácilmente un Nuevo proyecto, abrir uno ya existente, o restablecer el último proyecto en el
cual trabajaste. (Restablecer el último proyecto automáticamente abre el proyecto que habías abierto la
última vez que tu iniciaste el AutoPlay). Cuando haces clic en “Create a new Project” (Crear un nuevo
proyecto), la ventana de bienvenida se cierra y la ventana New Project (Nuevo Proyecto) aparece.
La ventana New Project, te permite ponerle nombre a tu proyecto y elegir con cuál tipo de proyecto te
gustaría iniciar.
En medio de la ventana New Project hay una lista desplazable con un montón de imágenes miniatura en
ella. Cada miniatura representa una distinta plantilla de proyecto. Una plantilla de proyecto es un
“proyecto iniciador” prefabricado que puedes utilizar para sacarle provecho a tu propio proyecto. Como
puedes ver, las plantillas de proyecto vienen en muy variados estilos temas.
4) Cambia el Nombre del Proyecto a Tutorial.
Es común que quieras reemplazar el texto por defecto "My Project" con el nombre adecuado para este
proyecto, así que selecciona todo el texto en el campo Enter Project Name y reemplázalo escribiendo por
ejemplo Tutorial.
Este será el nombre de la carpeta de proyecto, que es la carpeta que será utilizada para mantener todos
los archivos del proyecto juntos, y también será el nombre del archivo de proyecto, el cual es el archivo
que contiene todas las configuraciones y opciones que confeccionan tu proyecto. (Este es el archivo que
“abrirás” cuando quieras cargar este proyecto en el AutoPlay). Cada proyecto necesita un nombre, y ese
nombre tiene que ser único. No puedes darle el mismo nombre a dos proyectos (y de hecho AutoPlay no
te lo permitirá).
6) Haz clic en la miniatura de la plantilla Blank Project (Proyecto en Blanco). Estarás comenzando el
proyecto tutorial desde cero, así que selecciona la plantilla Blank Project.
Nota: Para seleccionar una plantilla, sólo haz clic en su miniatura.
7) Haz clic en "Create Project New" (Crear un Proyecto Ahora).
Cuando hagas clic en Create Project New, la ventana New Project Options se cerrará, AutoPlay creará la
carpeta de proyecto y el archivo de proyecto con el nombre que elegiste, y el proyecto se cargará dentro
Pestaña de Páginas
Paneles
de
Control
Área de trabajo o de
página
Barra o Medidor de
Tamaño del Proyecto
Barra de Estado
En medio de la ventana del programa, la superficie de la página actual está visible en el área del trabajo,
medida en pixeles por un par de reglas.
En la parte inferior de la ventana, una barra de estado refleja tu interacción con el programa y te ofrece
una cantidad de lecturas informativas.
El resto de la ventana del programa está constituida de sub-ventanas individuales conocidas como
paneles. Cada panel puede estar anclado, con pestañas, ser inmovilizado, redimensionado o arrastrado, e
incluso hacer que flote en la parte superior del ambiente de diseño.
Consejo: Para mostrar/ocultar paneles, utiliza el menú Ver > Paneles.
Un panel muy útil es el panel Propiedades (Properties). Por defecto, éste está localizado a la
izquierda del área de trabajo, a todo lo largo del lado izquierdo de la pantalla. Aquí es donde puedes ver y
editar la configuración del objeto o la página actualmente seleccionada.
La configuración en el panel propiedades está organizada en categorías. Puedes expandir o colapsar estas
categorías haciendo doble clic en el encabezado de cierta categoría, o haciendo clic en los pequeños
símbolos + o – que aparecen en la columna a su izquierda
Configuración Valor
esa orilla cuando sueltes el botón del ratón. Ver la captura de esta acción en la siguiente imagen.
Cuando los paneles están anclados uno junto a otro, al arrastrar una orilla se redimensionarán ambos
paneles al mismo tiempo (haciendo uno más grande y otro más pequeño). Como un hecho dado, cuando
hagas el panel Propiedades más pequeño, el panel Explorador de Proyecto se hará más grande al mismo
tiempo.
5) Cambia de lugar algunos paneles. Prueba moviendo paneles a la orilla de la pantalla para anclarlos, o
arrástralos arriba de otros paneles para combinarlos de distintas maneras.
Puedes cambiar de lugar los paneles arrastrándolos por su barra de título. Al mover un panel, una silueta
te mostrará el área general donde el panel terminará. Si arrastras el panel cerca de la orilla de la pantalla,
o cerca de otro panel, la silueta se “adaptará” para mostrarte que el panel puede ser anclado, puesto con
pestañas o combinado de otro modo con el área enfocada.
Date cuenta que cuando los paneles están con pestañas, al arrastrar su barra de título mueve al mismo
tiempo todos los paneles con pestañas. Puedes “arrancar” una pestaña arrastrándola fuera de las otras.
Puedes también reordenar las pestañas arrastrándolas a la izquierda o a la derecha.
Consejo: Cuando estás arrastrando paneles, es la posición del cursor del ratón la que determina cómo se
acomodará la silueta del panel en un lugar. Por ejemplo, para anclar un panel debajo de otro, arrastra el
panel de tal manera que el cursor esté cerca de la orilla inferior de ese panel. Para “pestañear” un panel
con otro, arrastra el panel de manera que el cursor esté en la orilla superior de la barra de título del otro
panel.
Los paneles anclados también pueden ser “pinchados” o “despinchados”. Los paneles pinchados
permanecen abiertos cuando no los estás utilizando. (Todos los paneles por defecto están pinchados). Los
paneles despinchados permanecen cerrados hasta que haces clic en ellos o posicionas el ratón sobre ellos.
Cuando los necesites posiciona el ratón sobre ellos y se deslizarán y abrirán por encima de todo, y luego se
deslizarán y cerrarán cuando termines de necesitarlos.
Puedes pinchar o despinchar un panel haciendo clic en el pequeño icono “pin” de la barra de título del
panel.
Pinchado Despinchado
Los paneles recuerdan su posición incluso después de que los despinches. Si despinchas un panel y luego
lo pinchas de nuevo, regresará a la posición que tenía antes de que fuera despinchado.
Nota: Los paneles con pestañas son pinchados y despinchados juntos. Si despinchas un panel que está
“pestañeado”, todos los demás paneles que están pestañeados con él también serán despinchados.
6) Hacer Clic en el menú Ver > Layouts >AutoPlay Menú Studio 3.0.
AutoPlay viene con algunos diseños de espacios de trabajo preconfigurados a los que puedes acceder
desde el menú Ver. El "AutoPlay Menú Studio 3.0" modela el ambiente de diseño de uno de los
predecesores del AutoPlay 7.
Consejo: Puedes crear tus propios diseños de espacio de trabajo ordenando los paneles a tu
gusto y luego eligiendo Ver > Paneles > Save Layout. Cualquier diseño que guardes será
añadido a la lista en el menú View, y puede ser seleccionado igual que cualquier otro diseño
preconfigurado.
7) Hacer Clic en el menú Ver > Layouts > Restore Default.
Esto restaura el ambiente de diseño al espacio de trabajo por defecto, el cual es el único que usaremos a
lo largo de este tutorial.
8) Hacer Clic en el menú Ver > Cuadrícula (Grid) para activar la cuadrícula (Ctrl + Shift + R).
Un esquema de cuadrícula aparecerá en el área de la página. Esta cuadrícula puede ser útil cuando quieras
alinear objetos visualmente en la página.
Consejo: Puedes hacer que los objetos "se ajusten" a la cuadrícula cuando los muevas
eligiendo Ver > Alinear a Cuadrícula (Ctrl + Shift + R).
9) Hacer Clic en el menú Ver > Cuadrícula (Grid) para desactivar la cuadrícula.
Eligiendo Ver > Cuadrícula (Grid) de nuevo se desactiva la cuadrícula.
3. AJUSTAR PREFERENCIAS.
Hay una cantidad de preferencias que puedes configurar para ajustar el ambiente de diseño de AutoPlay y
satisfacer tu estilo de trabajo. Vamos a dar un vistazo a algunas de ellas.
1) Hacer Clic en el menú Edición > Preferencias.
Esto abrirá el cuadro de diálogo Preferencias, donde todas las preferencias de AutoPlay pueden ser
encontradas.
Las preferencias están ordenadas en categorías. Las categorías están listadas al lado izquierdo del cuadro
de diálogo. Cuando haces clic en una categoría, sus preferencias correspondientes aparecen al lado
derecho del cuadro de diálogo.
Consejo: Si ésta es la primera vez que has abierto el cuadro de diálogo Preferencias, la
categoría Build (Construcción) ya estará seleccionada. Una de las opciones Previsualizar en
esta categoría nos da la opción de habilitar mensajes de notificación. Por ejemplo. La opción
Mostrar la ventana te permite mostrar información de depuración en una ventana separada cuando das
una vista previa el proyecto. Activar esta opción puede ayudarte a ver qué está pasando “atrás del telón”
durante una vista previa, lo cual puede ser útil si te topas con algún problema mientras estás probando tu
proyecto.
2) Haz clic en la categoría Environment (de Ambiente).
Las preferencias Environment (de Ambiente) te permiten cambiar la manera en que se ve el ambiente de
diseño. Por ejemplo, puedes cambiar los colores que son utilizados cuando los objetos están
seleccionados, o cambiar el color de fondo del área entera de trabajo. Incluso puedes cambiar el color de
la “sombra” que aparece detrás de la superficie de la página (o desactivarla completamente).
Consejo: Desactivar la sombra de la página puede mejorar la visualización de las líneas de los
objetos arriba del fondo y justo en una orilla de la página. Observe el resultado en las siguientes
imágenes.
3) Expande la categoría Environment haciendo doble clic en ella, y luego haz clic en la categoría Project
Size.
También puedes expandir la categoría Enviroment haciendo clic en el pequeño símbolo “+” a la izquierda
de ésta.
Las
preferencias de Tamaño del Proyecto es donde puedes ajustar el tamaño del medio de salida (CD, DVD), el
cual determina la escala del medidor en el panel Tamaño de Proyecto.
Si ajustas el tamaño de esta escala para que concuerde con el tamaño del medio de salida (CD, DVD) que
estés usando, tendrás un indicador visual que te informa cuánto espacio va abarcando tu proyecto a
medida que le vas añadiendo cosas.
Date cuenta que esta preferencia no afecta el proyecto para nada; el tamaño del medio de salida sólo
afecta el medidor de tamaño en el panel Project Size (Tamaño de Proyecto). Tampoco importa qué tan
grande es tu disco en el quemador, si quieres que el medidor de tamaño se ajuste al tamaño de medio de
salida que estés usando, necesitarás cambiar el tamaño del medio de salida manualmente cuando alternes
de un tamaño de medio a otro.
4) Tienes la libertad de explorar algunas de las otras categorías. Cuando lo hayas hecho, haz clic en
ACEPTAR para cerrar el cuadro de diálogo Preferencias.
Hay muchas otras preferencias que puedes ajustar, tales como el número de niveles de deshacer para el
programa (en la categoría Document), y qué sucede cuando arrastras un archivo dentro de la página (en la
categoría Drag and Drop). Toma algún tiempo para navegar a través de las categorías y familiarizarte con
las diferentes opciones que estén disponibles.
Recuerda que puedes hacer clic en la Ayuda o presionar F1 para obtener más información acerca de
El resto de las configuraciones están bien, así que haz clic en OK para cerrar el cuadro de diálogo Ajustes
del Proyecto (Project Settings) y regresar a la ventana principal del programa.
5) Ahora haz clic en el menú Publicar > Previo ó F5 para poder ver una vista previa de nuestro proyecto.
La característica de vista previa de AutoPlay te permite “echarle un vistazo” a tu aplicación antes de
construir o quemar el proyecto. En este punto no hay mucho que ver, puesto que el proyecto sólo consta
de una página en blanco. Pero el texto que escribiste para el título de la ventana aparece en la barra de
título, y si puedes medir la página, te darás cuenta que sin duda es de 630 pixeles de ancho por 425 pixeles
de alto.
6) Haz clic en el botón Cerrar de la barra de título para salir de la vista previa.
Cuando salgas de la vista previa, regresarás a la ventana del programa del AutoPlay.
7) Finalmente Grabemos nuestro proyecto clic en Archivo > Guardar ó CTRL + S.
Cuando guardes el proyecto, todos los cambios que le has hecho serán almacenados en el archivo de
proyecto. Puedes abrir ese archivo de proyecto en cualquier momento para continuar trabajando en el
proyecto.
Resumen del capítulo. En este capítulo aprendiste:
ü Crear un nuevo proyecto.
ü Asegurarte que tienes la versión más reciente de AutoPlay Media Studio.
ü Reconocer las distintas partes de la interface del programa.
ü Personalizar el espacio de trabajo.
ü Cargar un diseño preconfigurado de un espacio de trabajo. .
ü Cambiar el título de la ventana del proyecto.
ü Ajustar el tamaño de página del proyecto.
ü Ver una Vista Previa de nuestro proyecto.
ü Grabar nuestro proyecto.
CAPÍTULO 2
GRÁFICOS Y TEXTO
En esta lección aprenderás acerca de los objetos, los bloques básicos de construcción que hacen única
cada aplicación AutoPlay. Los dos objetos más fáciles de usar son las imágenes y las etiquetas (labels).
Juntos, ellos te permiten llenar tu proyecto con gráficos y texto. Aunque son sencillos de usar, te permiten
hacer cosas muy avanzadas, y al final de esta lección aprenderás a manipular estos objetos como un
profesional.
La mayoría de las técnicas que aprendas en esta lección pueden ser aplicadas a todos los objetos que
usarás en AutoPlay, así que pon atención, ésta es una información muy útil. Por ejemplo, todos los objetos
en AutoPlay pueden ser cambiados de tamaño y de posición libremente, y en esta lección aprenderás
cómo hacerlo. También aprenderás como renombrar objetos, y cómo crear rápidamente un clon de un
objeto existente al duplicarlo, que será un ahorro real de tiempo que dominarás tú mismo con la práctica.
1. COMENZANDO CON EL CAPÍTULO.
Si estás continuando desde el capítulo 1, deberías tener ejecutándose el AutoPlay con el proyecto Tutorial
aún abierto. Si es así, estás listo para avanzar al siguiente ejercicio: Elegir un Color de Fondo. En caso
contrario, necesitarás abrir el archivo de proyecto que guardaste al final del capítulo 1.
1) Abre el archivo Tutorial.am7 que guardaste en la Lección 1.
Cuando guardas un proyecto, AutoPlay automáticamente crea una carpeta de proyecto para él en el
interior de la carpeta Mis documentos\AutoPlay Media Studio 7.0\Projects. Esta carpeta de proyecto es
donde todo lo que le pertenece al proyecto es almacenado, incluyendo el archivo de proyecto, el cual
contiene todas las configuraciones utilizadas en el proyecto.
La carpeta de proyecto y el archivo de proyecto siempre tienen el mismo nombre que le diste al proyecto
cuando éste fue creado. El nombre de los archivos de proyecto finalizan con una extensión de archivo
.am7.
Para abrir el proyecto, sólo necesitas abrir el archivo de proyecto. Clic en menú Archivo > Abrir > el
nombre de tu proyecto
2. ELIGIENDO UN FONDO DE PÁGINA.
Cada proyecto está compuesto por una o más páginas. Una página en AutoPlay es muy parecida a una
página de un libro. Justo como en un libro, cada página puede tener diferentes cosas en ella, tales como
fotografías y texto.
Por supuesto, en AutoPlay hay mucho más cosas que puedes poner en una página, desde texto y gráficos
hasta botones interactivos, video y animaciones. (Verás los diferentes tipos de objetos que puedes colocar
en una página a lo largo de las lecciones de esta guía del usuario). Pero por ahora, sólo enfoquémonos en
la superficie de la página misma.
Nombre de Página
Consejo: Puedes hacer clic en la superficie de la página en cualquier momento para seleccionar
la página y ver su configuración en el panel Propiedades.
Puesto que un gran rectángulo en blanco es un poco aburrido para este proyecto, hagamos que la página
tenga un aspecto más interesante.
2) En el panel Propiedades, ajusta el Color de Fondo (BackgroundColor) a Pale Blue (#99CCFF).
La superficie de la página es también llamada el fondo de la página. Cuando inicias un proyecto en blanco,
éste tiene sólo una página en blanco, y su color de fondo es blanco sólido.
Para ajustar el color de fondo a Pale Blue, haz clic en la configuración BackgroundColor del panel
Propiedades, y luego haz clic en el botón Seleccionar para poner a la vista una paleta de colores.
Botón Seleccionar
En la paleta de colores, mantén posicionado el botón del ratón sobre uno de los cuadros de color por uno
o dos segundos, hasta que el nombre del color aparezca. (Si mantienes posicionado el ratón sobre el
cuadro de un color por uno o dos segundos, el nombre del color aparecerá en una ventana contextual).
Ahora mueve tu ratón alrededor y verás los nombres de otros colores. Intenta encontrar el color
nombrado Pale Blue. (Deberá ser el tercer color de derecha a izquierda en la última fila). Haz clic en el
color nombrado Pale Blue para seleccionarlo como el nuevo color de fondo.
También puedes establecer el color editando directamente su valor hexadecimal. Una forma rápida de
realizar esto es haciendo doble clic en el nombre del campo de texto (en este caso, la parte
BackgroundColor en sí misma), escribe #99ccff y presiona Enter.
Nota: Al hacer doble clic en el nombre del campo de texto, automáticamente se resalta todo el texto del
campo. Si el texto está resaltado, cualquier cosa que escribas reemplazará instantáneamente dicho texto.
Consejo: Cuando escribas valores de color hexadecimal, no es necesario que utilices
mayúsculas. AutoPlay automáticamente las pondrá en mayúsculas por ti.
¿Hexadecimal...?
Los valores de color Hexadecimal no son tan complicados como parecen. Son solamente
una manera compacta de describir los colores.
Cada color está hecho de tres valores: uno para la cantidad de rojo en el color, otro para la
cantidad de verde y el tercero para la cantidad de azul. (Las computadoras forman diferentes colores al
mezclar porcentajes de rojo, verde y azul en la pantalla).
Si has utilizado cualquier herramienta gráfica como PhotoShop (o incluso Paint), probablemente usaste la
configuración de valor RGB para un color empleando números entre 0 y 255. El color hexadecimal
#99CCFF es sólo una manera compacta de decir: ajusta el Rojo a 153, el Verde a 204 y el Azul a 255.
Cada par de dígitos en el color representan ya sea rojo, verde o azul en este patrón: #RRGGBB. (Dos dígitos
para rojo, luego dos dígitos para verde y por último dos dígitos para azul). De modo que ¿cuál es el
significado de las letras FF y CC? Bueno, estas son sólo hexadecimales, las cuales simplemente son una
manera compacta de escribir números. Hexadecimal (o hex para abreviarlo) extiende los números
decimales regulares (0-9) a seis dígitos extra (A-F). De modo que, si estuvieras contando hasta 18 en
hexadecimal, deberías ir: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F, 10,11,12. Entender la configuración
hexadecimal es un poco técnico, pero todo lo que necesitas para hacer colores de valor Hexadecimal es
saber que las letras son más grandes que los números. (A0 es más grande que 99, DB es más grande que
D7, etc.). En la notación #RRGGBB, los valores más grandes significan más de ese color. FF es el valor más
grande que puedes tener, de modo que FF0000 significa 100% rojo, 0% verde, 0% azul. #FFFFFF es blanco
(100% rojo, verde y azul), y #000000 es negro (nada de rojo, ni verde, ni azul).
Con respecto al símbolo de número (#) al inicio, éste simplemente indica que los números hexadecimales
están siendo utilizados, algo así como el símbolo de bolivianos (Bs.) que te da a entender que Bs. 5.24
significa 5 bolivianos y 24 centavos.
3) Cambia el estilo del fondo de Solid Color (Color Sólido) a Gradient (Color Degradado), y ajusta el color
degradado a Tan (#FFCC99).
Para cambiar el estilo de fondo de las páginas, haz clic en la configuración BackgroundStyle del panel
Propiedades, luego haz clic en el botón Seleccionar y elige Gradient de la lista.
Para cambiar el color de degradado, haz clic en el ajuste GradientColor y luego haz clic en el botón
Seleccionar para buscar el color elegido. Encuentra el cuadro de color llamado Tanit (deberá ser el
segundo color de la izquierda en la fila inferior) y haz clic en él.
El fondo de página ahora deberá ser un degradado entre el color de fondo en la parte superior (Pale Blue)
y el color degradado en la parte inferior (Tan). Un degradado es sólo un matiz suave que va de un color a
otro. Así que la superficie de la página se matiza suavemente de Pale Blue, en la parte superior, a Tan, en
la parte inferior). Nos gusta llamar este degradado Amanecer en el Desierto). El uso de un degradado es
una manera fácil de crear un sencillo y atractivo fondo de página.
4) Cambia el estilo de fondo de Degradado a Imagen.
Al ajustar el BackgroundStyle a Image te permite colocar una imagen de fondo para la página. Esto es
exactamente lo mismo que redimensionar una imagen para que abarque justamente el área de la página,
y cualquier objeto que pongas en la página aparecerá arriba de la imagen. (Bien, seleccionaremos una
imagen de fondo en un momento).
Date cuenta que el color de fondo cambia de un degradado a un simple color, específicamente a la
configuración BackgroundColor. Este es el color que tendrá cualquier parte no cubierta de la página si el
estilo de imagen es fijado a Actual size (tamaño actual) y la imagen es más pequeña que la página.
5) Haz clic en la configuración BackgroundImage y luego clic en el botón Browse (Explorar). Cuando se abra el
cuadro de diálogo Select File, haz clic en el botón Gallery.
Seleccionar una imagen es fácil utilizando el cuadro de diálogo Archivo a Seleccionar (Select File). Para
abrirlo, haz clic en la configuración BackgroundImage y luego en el botón Browse (Explorar).
Clic en este botón para buscar la imagen
Cuando hagas clic en este botón, el cuadro de diálogo Archivo a Seleccionar (Select File) se abre, de modo
que puedes explorar el archivo. Haz clic en el botón Galería (Gallery) al lado izquierdo del cuadro de
diálogo y tendrás acceso a la librería completa de archivos que vienen con AutoPlay.
Nota: Hay cinco botones a la izquierda del cuadro de diálogo Select File: Mis Imágenes (My Pictures),
Galería (Gallery), Mi Proyecto (My Project), Mis Documentos (My Documents) y Mi Computadora (My
Computer). El botón Mi Proyecto (My Project) es para archivos que ya has añadido a tu proyecto; el botón
Gallery es donde encontrarás los archivos que vienen con AutoPlay; y los otros tres botones te permiten
abrir archivos de otras carpetas en tu computadora.
6) Prueba navegando en el cuadro de diálogo Archivo a Seleccionar (Select File). Cuando encuentres una
imagen que te guste, haz clic en OK para seleccionarla como imagen de fondo.
Debido a que AutoPlay sabe que estás buscando un fondo para la página, cuando haces clic en el botón
Gallery en el cuadro de diálogo Select File, éste automáticamente abre el interior de la carpeta
Backgrounds.
Aunque encontrarás muchos fondos agradables en esa carpeta, puedes navegar a otra carpeta en el
cuadro de diálogo Select File si lo deseas.
Navegar en el cuadro de diálogo Select File es justamente como navegar en archivos de Windows. Para
subir un nivel o ir hacia afuera de una carpeta, haz clic en el botón move up en la parte superior del cuadro
de diálogo.
Si subes un nivel a la carpeta de imágenes madre, deberás ver la carpeta Backgrounds, junto con otras dos
carpetas de la galería de imágenes.
La carpeta Backgrounds y sus carpetas hermanas vistas desde su carpeta madre. Para ir de nuevo a los
archivos de la carpeta Backgrounds, sólo haz doble clic en ella. Cuando haces doble clic en una carpeta,
entras esencialmente en ella, dejando ver el contenido de la carpeta (que puede incluir archivos o incluso
otras carpetas).
Como puedes ver, la galería está llena de útiles gráficos, incluyendo varias imágenes abstractas de alta
calidad que sirven como excelentes fondos. (Lo cual es grandioso para aquellos cuyo talento artístico va
tan lejos como un Amanecer en el Desierto).
Una vez que encuentres una imagen que te guste, haz clic en OK para seleccionarla como imagen de
fondo. El cuadro de diálogo Select File se cerrará y la imagen aparecerá en la página como el fondo.
Nota: La imagen que seleccionaste será copiada automáticamente en la carpeta Images de tu proyecto.
7) Ir a menú Ver > Paneles > Explorar Galería (Gallery Browser), y luego a Ver >
Paneles > Previsualizar Recurso (Resource Preview).
En la ventana de diseño por defecto, los paneles Galería (Gallery) y Previsualizar
(Preview) no son mostrados. Para desplegar el panel Galería (Gallery), elige Ver >
Paneles > Explorar Galería (Gallery Browser). (Habrá una marca de verificación junto
a Explorar Galería (Gallery Browser) en el submenú Ver > Paneles cuando el panel
Gallery esté visible). Enseguida, haz visible el panel Previsualizar (Preview) eligiendo
Ver > Paneles > Previsualizar Recurso (Resource Preview).
8) Alternar el panel Galería (Gallery) para utilizar la vista Lista (List).
Como en las carpetas de Windows, el panel Galería (Gallery) tiene
varias vistas diferentes que puedes utilizar para ver el contenido de los
archivos. Puedes alternar entre una vista y otra haciendo clic derecho
en un sitio vacío dentro del panel y elegir una vista diferente del menú
contextual la opción Ver. La mayoría de las capturas de pantalla a todo
lo largo de esta guía fueron tomadas utilizando la vista Lista (List).
AutoPlay Media Studio utiliza por defecto la vista Thumbnails
(Miniaturas).
No te preocupes si tus paneles no se ven como los de esta guía del
usuario, puedes alternar a la vista List en el momento que quieras, pero
las otras vistas proporcionan la misma funcionalidad básica. Cada
escenario de vista que utilices es totalmente elección tuya.
9) En el panel Galería (Gallery), haz clic en el botón Imágenes (Images)
Si respondes Sí, la configuración de imagen de página será automáticamente establecida para utilizar esa
imagen como fondo. (Si respondes No, la imagen será colocada dentro de la página como un objeto de
Imagen).
Consejo: Puedes cambiar el % de umbral de tamaño y activar o desactivar esta característica
eligiendo Edición > Preferencias y ajustando la configuración en la categoría Drag and Drop.
11) Haz doble clic en la superficie de la página para abrir el cuadro de diálogo Page Properties
(Propiedades de Página).
Otra forma de acceder a la configuración de página es haciendo doble clic en la superficie de la página. Al
hacer doble clic en una página (o en un objeto) en AutoPlay, se abre un cuadro de diálogo con todas sus
configuraciones.
El cuadro de diálogo Propiedades de Página contiene todas las configuraciones que están disponibles en el
panel Propiedades. Como puedes ver, los cambios que hagas en el panel Propiedades son reflejados en el
cuadro de diálogo Propiedades de Página.
Algunos usuarios prefieren hacer doble clic para realizar sus cambios, mientras que otros prefieren utilizar
el panel Propiedades; los cuadros de diálogo de doble clic son un poco más fáciles de usar en algunos
casos, mientras que el panel Propiedades puede ser más rápido otras veces, como cuando se editan
múltiples objetos a la vez. Tómate la libertad de utilizar cualquier método que prefieras. (En lo particular
yo utilizó los dos métodos, pero más este último por ser más práctico).
En este manual del usuario nos enfocaremos más los cuadros de diálogo de doble clic son más familiares
para la mayoría de los usuarios y son auto-explicativos. Esto porque el propósito del manual y del curso
es de aprender el AutoPlay de manera práctica.
12) Haz clic en Cancel para cerrar el cuadro de diálogo Propiedades.
Al clic en el botón Cancel se cierra el cuadro de diálogo y se cancela cualquier cambio que hayas hecho
mientras estaba abierto. (En este caso no hiciste ningún cambio, así que realmente no importa si haces clic
en Cancel o en OK, pero no está de más ser cuidadoso).
3. AÑADIR OBJETOS DE IMAGEN.
Tan agradables que son los fondos, pero nuestro proyecto sería algo aburrido si es todo lo que hay que
mirar. Puesto que una imagen vale más que mil palabras, pongámonos en marcha añadiendo un objeto de
Imagen en la página.
¿Objeto de Imagen?
En AutoPlay, cualquier cosa que puedas colocar en la página es llamada un objeto. Así,
cuando añades una imagen a la página decimos que estás añadiendo un objeto de Imagen. Como verás en
un momento, cada objeto en AutoPlay tiene sus propias configuraciones y propiedades, tales como
anchura, altura y posición en la página.
Toma una fotografía por ejemplo. Por sí misma, es sólo una imagen de algo. Pero en AutoPlay la imagen
adquiere una configuración específica, por ejemplo, podría ser la imagen exactamente de 123 pixeles de
ancho por 300 de alto, estar posicionada 200 pixeles desde el borde izquierdo de la página y 100 pixeles
desde el borde superior. Si piensas en la imagen como la fotografía actual en sí misma, el objeto es la
fotografía junto con todas sus configuraciones.
1) Hacer clic ícono Imagen de la barra de Herramientas ó el ir al menú Objeto > Imagen.
2) En el cuadro de diálogo Archivo A seleccionar (Select File) haz clic en el botón Mis Imágenes y luego
selecciona la imagen que deseas añadir a la página y haz clic en el botón Aceptar.
La caja delimitadora aparecerá siempre que un objeto esté seleccionado. Ella te muestra el tamaño y
posición actual del objeto. (Como puedes ver, cuando añades un nuevo objeto de Imagen, éste queda
seleccionado automáticamente).
3) Haz clic en la superficie de la página para deseleccionar el objeto de Imagen.
Al hacer clic en cualquier parte fuera de la caja delimitadora del objeto lo deselecciona. Puedes seleccionar
alguna otra cosa, en este caso la página.
4) Haz clic en el objeto de Imagen para seleccionarlo de nuevo.
Cuando seleccionas el objeto de Imagen, su caja delimitadora reaparece, y su configuración aparece de
nuevo en el panel Propiedades.
Nota: Para seleccionar un objeto, sólo haz clic sobre él.
Al seleccionarlo, la posición y tamaño del objeto son mostrados en la barra de estado.
Los números en la barra de estado indican las coordenadas actuales desde la esquina superior izquierda de
la caja delimitadora de los objetos, y la anchura y altura actuales de la caja delimitadora de los objetos, o
sea, su posición y tamaño, medidos en pixeles.
5) Arrastra el objeto de Imagen a una posición distinta.
Mover un objeto es fácil: sólo usa el ratón para arrastrarlo donde quieras.
Nota: Para arrastrar un objeto, primero posiciona el puntero del ratón sobre el objeto. Luego presiona el
botón izquierdo del ratón. Mantenlo presionado mientras arrastras el objeto moviendo el ratón.
Al comenzar a arrastrar el objeto, un rectángulo punteado aparecerá, este rectángulo representa el
objeto, y te permite ver dónde será colocado el objeto cuando sueltes el botón del ratón. (De hecho el
objeto no se moverá hasta que finalices la operación de arrastre).
Una vez que hayas posicionado el rectángulo punteado donde quieras que el objeto vaya, libera el objeto
soltando el botón del ratón. Tan pronto como liberes el botón del ratón, el objeto se mueve a su nueva
posición. Al mover el objeto, la lectura de posición cambia en la barra de estado.
Los números indican dónde estará la esquina superior izquierda de la caja delimitadora del objeto cuando
Una vez que una imagen ha sido añadida a tu proyecto, llega a ser incluso más fácil añadirla una segunda
vez. Esto se debe a que al añadir una imagen a tu proyecto se crea una copia local de ese archivo en el
interior de la carpeta Images del proyecto.
Nota: Cada vez que inicias un nuevo proyecto, AutoPlay automáticamente crea una carpeta de proyecto
por ti. Inmediatamente en el interior de la carpeta de proyecto están dos cosas: el archivo de proyecto,
donde todas las configuraciones del proyecto son almacenadas; y una carpeta llamada CD_ROOT. La
carpeta CD_ROOT es donde están organizados todos los archivos de tu proyecto. Cuando quemas tu
proyecto en un CD, es el contenido de la carpeta CD_ROOT el que es colocado dentro del CD. (En otras
palabras, todo lo que pertenezca a la carpeta CD_ROOT del proyecto, terminará en el CD cuando
publiques tu aplicación).
Para aclarar las cosas, los archivos que añades a tu proyecto son almacenados bajo el CD_ROOT en una
carpeta llamada AutoPlay. Esta carpeta está dividida en otras subcarpetas. Las imágenes son guardadas en
una subcarpeta llamada Images, los videos en una carpeta llamada Videos y así por el estilo.
Cada proyecto tiene una colección completa de estas subcarpetas, a las cuales puedes acceder usando el
panel Project. La mayoría del tiempo estas subcarpetas no las verás; mientras estés trabajando en tu
proyecto estarás trabajando en la carpeta CD_ROOT. (No verás la carpeta CD_ROOT en sí misma a menos
Proyecto de Autoplay, el
cual hay que abrir para
realizar modificaciones.
8) Redimensiona el objeto arrastrando uno de los cuadritos blancos de su caja delimitadora. Prueba
manteniendo oprimidas las teclas Ctrl y Shift mientras redimensionas el objeto para mantener su
proporción dimensional actual.
Los cuadritos blancos de la caja delimitadora de un objeto son llamados manivelas de ajuste de tamaño.
Consejo: También puedes hacer clic derecho sobre un objeto y elegir Keep Aspect para hacer
que siempre mantenga su proporción dimensional, incluso si lo redimensionas sin mantener
oprimidas las teclas Ctrl y Shift.
9) Finalmente para realizar otros cambios en las propiedades del objeto imagen, hacer doble clic sobre la
imagen e inmediatamente les aparecerá una nueva ventana, en la cual se podrá cambiar otras
propiedades de la imagen de manera práctica.
Podremos cambiar la
posición, en tamaño y
restaurar el tamaño original
de nuestra imagen.
Cambiar el cursor
cuando esta sobre la
imagen.
Se puede agregar
sonido al hacer clic en la
imagen o al pasar.
Alguna información es más fácil presentarla con palabras que con imágenes. (Por ejemplo, sería muy difícil
dibujar tu nombre o tu dirección de e-mail). Afortunadamente, los objetos Etiqueta facilitan colocar texto
en la página.
1) Hacer clic en la barra de Herramientas en el ícono Etiqueta ó a través del menú Objeto > Etiqueta
(Label), se añade automáticamente un objeto Label en la esquina superior izquierda de la página.
2) Haz doble clic en el objeto para mostrar el cuadro de diálogo Label Properties, podemos escribir Mi
Primer PROYECTO AUTOPLAY y finalmente hacer clic en el botón Aceptar. El contenido de la configuración
del Texto ya está automáticamente seleccionado. Esto te facilita cambiar el texto de los objetos
directamente.
Las propiedades que hay en la pestaña Atributos, son las mismas anteriormente explicadas.
3) Haz el objeto Etiqueta (Label) para cambiar el tamaño, arrastrándolo de una de sus manivelas de
ajuste.
Cuando redimensionas un objeto Label, el texto en su interior se hace más grande o más pequeño. De
hecho, redimensionar la caja delimitadora de objetos Label es sólo otra forma de configurar el tamaño de
letra de los objetos.
Hay dos cosas debes recordar acerca del redimensionamiento de objetos
Label. La primera, los objetos Label siempre mantienen su dimensión
proporcional al cambiarlos de tamaño. (Probablemente lo notaste cuando
redimensionaste el objeto). Esto es porque al cambiar el tamaño de letra
cambia la anchura y la altura del texto al mismo tiempo.
La segunda, el tamaño del objeto Label puede no siempre corresponder
al tamaño que tú lo ajustes. La caja delimitadora podría terminar un
poquito más grande o más pequeña al estirar el texto a un tamaño de
fuente más cercano (es decir, el tamaño del tipo de letra siempre debe
ser un número entero). En ocasiones no podrás hacer que un objeto Label
se ajuste perfectamente a una anchura y altura específicas en pixeles, pero AutoPlay dejará el texto lo más
exacto posible.
Consejo: Cuando redimensiones objetos Label, trata de no pensar en términos de pixeles,
piensa en términos de puntos, como una fuente de 12 puntos por ejemplo. O mejor aún,
solo redimensiona el objeto hasta que se vea como tú quieres, y olvídate de pixeles y puntos.
4) Para reducir el tamaño del objeto Etiqueta (label) a su tamaño original.
Para hacer el objeto Label más pequeño, sólo arrastra la misma manivela de ajuste adonde más o menos
estaba antes.
5) Para cambiar el texto, color, formato, orientación, alineación, etc. Debemos hacer doble clic en la
etiqueta y realizar el cambio de las respectivas propiedades, en la ventana de propiedades de la etiqueta.
También se puede cambiar las propiedades del objeto Etiqueta, con el Panel de Propiedades.
Consejo: Otra manera de añadir un objeto de manera más rápida es haciendo clic derecho en
la superficie de la página y elegir del menú contextual el objeto que deseo añadir.
Nota: El menú de clic derecho es llamado menú contextual, en el cual se muestran diferentes temas de
acuerdo a lo que le hayas hecho clic derecho. Por ejemplo, hacer clic derecho en la superficie de la página
presentará un menú diferente que si haces clic derecho en un objeto.
Nota: Cuando añades un objeto desde el menú contextual (o menú de clic derecho), éste se posiciona en
la página donde hiciste clic derecho.
5. AÑADIR OBJETO PÁRRAFO.
Existe un inconveniente con el objeto Etiqueta (Label), solo se puede escribir un texto en una línea, pero si
deseamos escribir una oración o párrafo, este objeto no sería el adecuado. Así que la solución a este
problema es utilizar el objeto Párrafo.
1) Hacer clic en la barra de Herramientas en el ícono Párrafo ó a través del menú Objeto > Párrafo,
se añade automáticamente un objeto Párrafo en la esquina superior izquierda de la página.
2) Haz doble clic en el objeto para mostrar el cuadro de diálogo Paragrahp Properties, podemos escribir
una pequeña oración y finalmente hacer clic en el botón Aceptar. El contenido de la configuración del
Párrafo ya está automáticamente seleccionado. Esto te facilita cambiar el texto de los objetos
directamente.
3) Las acciones para cambiar el tamaño y mover un objeto Párrafo, son las mismas de los anteriores
objetos y en general de todos los objetos que Autoplay tiene.
4) Dependiendo del tamaño de nuestro texto en el objeto Párrafo, la barra de desplazamiento tanto
vertical como horizontal aparecerán automáticamente.
Al decir, texto enriquecido nos referimos a que tiene algunas propiedades que no tiene el objeto Párrafo
como por ejemplo, insertar viñetas, también puede detectar automáticamente direcciones URL.
Esta es la principal diferencia entre estos dos objetos.
1) Hacer clic en la barra de Herramientas en el ícono Texto Enriquecido ó a través del menú Objeto >
Texto Enriquecido, se añade automáticamente un objeto Párrafo en la esquina superior izquierda de la
página.
2) Haz doble clic en el objeto para mostrar el cuadro de diálogo Paragrahp Properties, podemos escribir
una pequeña oración y finalmente hacer clic en el botón Aceptar. El contenido de la configuración del
Párrafo ya está automáticamente seleccionado. Esto te facilita cambiar el texto de los objetos
directamente.
Aquí podemos
Aquí podemos escribir
escribir nuestro
nuestro texto.
texto.
Dar un estilo al
fondo del texto
enriquecido.
Solido (elegir un
color) y
Transparente.
Con esta opción
se puede cambiar
el estilo de los
scrollbar o barras
de
desplazamientos Cuando se publica el proyecto,
al hacer clic con el botón
derecho en el texto
Al activar esta opción, lo que hace es auto enriquecido, les mostrará el
detectar todas las direcciones web, que hay siguiente menú contextual. Con
en el texto enriquecido. el que pueden realizar las
operaciones comunes.
7. DUPLICAR OBJETOS.
Una forma realmente rápida de añadir un objeto es hacer un duplicado de un objeto ya existente. Duplicar
es lo mismo que copiar y pegar en Windows, sólo que mediante este método se ejecuta en un solo paso.
1) Asegúrate que el objeto Etiqueta (Label) está seleccionada y elige Edición > Duplicar ó CTRL + D.
Cuando duplicas un objeto, todas las configuraciones del original son copiadas en el nuevo objeto. La única
cosa que cambia en el nuevo objeto son su nombre y posición. Para hacerlo más fácil y seguir la pista de
todo, el nuevo objeto es posicionado un poco más abajo y a la derecha del original. De esta manera
puedes ver que la duplicación fue exitosa.
NOTA: Para terminar este capítulo no se olvide de guardar su proyecto y de previsualizarlo con F5 las
veces necesarias para poder ver cómo está quedando su proyecto.
CAPÍTULO 3
BOTONES, ACCIONES Y PÁGINAS
Toda esta lección es acerca de la interactividad. La interactividad es importante porque eleva la aplicación
por encima de las limitaciones de simples folletos y tradicionales tarjetas de negocio que residen en el
humilde reino del papel. La interactividad hace que tu aplicación parezca que tiene vida y sea receptiva, y
realmente le permite al usuario ejecutar importantes tareas, justo como otro programa de Windows.
Hay varias formas de hacer interactiva tu aplicación, pero las tres herramientas más importantes a tu
disposición son los botones, las acciones y las páginas. Los botones son una de las características más
estupendas de AutoPlay. Dan un buen aspecto, son fáciles de utilizar y le añaden instantáneamente a tu
aplicación un toque verdaderamente profesional. Las acciones, y los eventos a los que las añades, te
permiten hacer que tu aplicación realice cosas. Las páginas son las superficies sobre las cuales colocarás
los botones y otros objetos. Y puesto que tu imaginación no debería restringirse a una sola página, te
mostraremos cómo añadir más páginas a tu proyecto.
1. AÑADIR BOTONES.
Los botones son objetos interactivos especiales. Estos responden automáticamente al usuario cambiando
su apariencia cuando posicionan el ratón sobre ellos o hacen clic sobre ellos. De hecho, cada botón tiene
cuatro diferentes apariencias o “estados” incorporados en él: Up, Down, Highlight y Disabled (Normal,
Presionado, Resaltado y Deshabilitado)
Hay una imagen diferente para cada estado incorporada directamente en el archivo de botón. Al alternar
entre estas imágenes, un botón puede parecer animado e interactivo al resplandecer cuando el usuario
mueve el ratón sobre él por ejemplo, y pareciendo oprimido cuando el usuario hace clic sobre él. Al contar
con soporte total para transparencia alfa y opacidad variable, los botones pueden incluir también efectos
incorporados de sombra y tener suaves esquinas redondeadas.
Los botones son un gran lugar para colocar acciones puesto que ellos usualmente tienen el aspecto como
de algo en lo que quisieras hacer clic. Y para ayudarle al usuario a que conozca qué harán los botones,
cada uno de ellos puede tener texto en él, igual que un objeto Label. El texto puede incluso cambiar de
color en cada estado diferente, de modo que éste se ajusta perfectamente con cada apariencia de estado.
1) Debemos recordar que hay tres maneras de insertar o añadir un objeto en este caso un
Botón:
1ra. Hacer clic en la barra de Herramientas en el ícono Botón.
2da. Ir al menú Objeto > Botón
3ra. Clic botón derecho y en el menú contextual elegir la opción Botón.
2) Con cualquiera de las tres formas, aparecerá una nueva ventana en la cual debemos elegir el botón que
vamos a añadir y hacer clic en el botón Aceptar.
3) Inmediatamente al hacer clic en el botón Aceptar. Nuestro objeto Botón se añadirá en nuestra página.
También podemos cambiar el tamaño haciendo clic, manteniendo presionado con el botón derecho de
nuestro ratón en los cuadritos blancos o manivelas de ajuste de tamaño. Mover de posición como cualquier otro
objeto.
4) Para cambiar el texto por defecto del botón y otras propiedades de este objeto, hacemos doble clic para
ingresar a la ventana de propiedades del Botón.
2. ALINEAR OBJETOS.
Otra función importante, que nos va ayudar en el momento de diseñar nuestras páginas de Autoplay, es la
Alineación de objetos. A continuación daremos un ejemplo de cómo utilizar esta función.
1) Como estamos trabajando con botones, crearemos cuatro botones, como se muestra en la siguiente
imagen.
2) Luego seleccionamos todos los botones, para seleccionar varios objetos presionamos sin soltar la tecla
SHIFT y con el ratón hacemos clic en los objetos que deseamos seleccionar, en nuestro caso todos los
botones.
La segunda, hacer clic en el primer objeto con el botón derecho, en el menú contextual elegir la opción
Alinear > Centro Horizontal.
4) El resultado cualquiera de las dos maneras será el mismo. Una alineación horizontal centreada de los
cuatro botones.
Consejo: hay varias opciones de alineación, las cuales debemos probar para saber su
funcionamiento, pero si ven los iconos que tienen a su lado, tendremos una idea de lo que
realizará dicha opción.
el objeto. Para hacer que algo suceda cuando se hace clic en el objeto, simplemente añádele una acción a
su evento On Click.
Las Acciones son simplemente comandos que le dicen a la aplicación que haga algo. Hay acciones para
hacer todo tipo de cosas, como cambiar el texto en un objeto Etiqueta (Label), ejecutar archivos de
programa externos, decirle a un video que inicie su reproducción, o saltar a otra página.
Las Acciones Rápidas (Quick Actions) son acciones especiales de uso fácil que se ocupan de tareas simples
sin escribir ningún script. Por ejemplo, la mayoría de los objetos te permiten configurar una sencilla Acción
Rápida que será ejecutada cuando se hace clic en el objeto. Añadir una Acción Rápida es una forma fácil de
hacer que suceda algo cuando haces clic sobre un objeto.
Cada objeto tiene sus propios eventos, y cada evento tiene sus propias acciones. Las Acciones que añadas
a cada evento de un objeto son ejecutadas sólo cuando ese evento específico es activado (en otras
palabras, los eventos son objetos específicos). Esto significa que tu aplicación puede hacer cosas
completamente diferentes cuando el usuario hace clic sobre diferentes objetos. Por ejemplo, podrías
hacer clic sobre un objeto se inicie la reproducción de un archivo de audio, mientras que al hacer clic sobre
otro objeto distinto haga que la aplicación salte a otra página. Cada clic accionaría el evento On Click
específico de cada objeto, provocando que la lista de acciones del evento sea ejecutada.
1) Para agregar una acción Rápida a un objeto debemos hacer doble clic en el objeto y elegir la pestaña
Acción Rápida (Quick Action) y hacer clic en Acción a Iniciar y se desplegará una lista de todas las acciones
rápidas que podemos utilizar con el objeto.
2) Agregaremos la acción rápida Salir/Cerrar a nuestro botón SALIR, hacemos doble clic en el botón,
elegimos la acción Exit/Close. Luego Publicamos nuestro proyecto con F5 y verificamos si realizamos bien
este ejercicio, haciendo clic en nuestro botón, debería cerrarse la ventana de nuestro proyecto, si es así,
entonces el ejercicio se realizó correctamente.
4. EDITOR DE SCRIPTS.
El Editor de Script es el lugar donde puedes añadir acciones para cada evento de los objetos. Hay cuatro
pestañas en el Editor de Script, una para cada evento al que puede responder este objeto de Botón.
• On Click, el cual es activado cuando hace clic sobre el botón.
• On Right-Click, el cual es activado cuando haces clic derecho sobre el botón.
• On Enter, el cual es activado cuando el ratón se posiciona dentro del botón (cuando el puntero del
ratón entra a la caja delimitadora del objeto).
• On Leave, el cual es activado cuando el ratón se posiciona fuera del botón (cuando el puntero del
ratón abandona la caja delimitadora del objeto).
También es importante mencionar que con este editor de script y si ya tenemos conocimiento de
programación y del lenguaje que Autoplay utiliza podemos comenzar a escribir código de nuestros propios
script. Otra manera de agregar código es utilizando el Asistente Nueva Acción te guiará a través del
proceso para añadirle una acción al Editor de Script. Este último será el que utilizaremos en nuestro
ejemplo, para ver la funcionalidad de nuestro editor de script.
Nota: Hay una pestaña en el Editor de Script para cada evento al que un objeto puede responder. Si
seleccionas un objeto que tenga cinco eventos, habrá cinco pestañas en el Editor de Script.
1) Agregaremos una acción en el editor de script a nuestro objeto botón, utilizando el Asistente de Nueva
Acción. Entonces añadimos un botón como el de la imagen, luego hacemos doble clic para abrir la ventana
de propiedades, elegimos la pestaña Script y el evento On Click.
2) Hacer clic en el botón Añadir Acción e inmediatamente le aparecerá el asistente de Nueva Acción.
en el botón
SW_SHOWNORMAL es una
constante. Que hará que se abra la
ventana del navegador de manera
normal.
4) Observaremos que regresará a la ventana de del editor de script, pero esta vez ya no está vacío, al
Código generado.
5) Ahora nos toca hacer la prueba la acción de abrir una URL a nuestro objeto botón. Para esto guardamos
el proyecto y luego lo publicamos con F5. Al hacer clic en el botón veremos el resultado.
Clic en el botón y
se abrirá la
página URL
generado.
1) Hay por lo menos tres manera de añadir una nueva página a nuestro Proyecto:
1ra. Forma. Menú Página > Añadir.
2da. Forma. Doble clic en el área de trabajo de la página, aparecerá la venta de propiedades donde
podemos cambiar el nombre de la página. Este procedimiento podemos hacer a manera de práctica en la
Página2 (Page2) y le damos el nombre de Manuales y clic botón Aceptar.
Ahora que tenemos dos páginas en el proyecto, pero podemos tener varias páginas, necesitamos
implementar algo para que el usuario pueda ir de una página a otra (en otras palabras, que pueda navegar
por la aplicación). Esto es algo increíblemente fácil de lograr. Para este proyecto utilizaremos objetos de
botón para provocar los cambios de página.
Nota: No necesariamente se tiene que utilizar botones para esto, en su lugar podrías utilizar objetos Label,
objetos de Párrafo o cualquier clase de objetos que tengan eventos On Click. Sin embargo para este
ejemplo utilizaremos botones porque tienen un mejor aspecto.
1) En nuestra página Principal tenemos un botón Manuales, vamos a añadir una acción para que cuando
nosotros hagamos clic en ese botón, podamos ir a la página Manuales. Para esto hacemos doble clic en
este botón, aparecerá la ventana de propiedades, seleccionamos la pestaña Acciones Rápidas (Quick
Action) y realizamos lo siguiente:
2) Ahora en nuestra página manuales añadimos un botón que tenga el texto Regresar. Luego hacemos
doble clic en este botón para ingresar a la ventana de propiedades de Botón, clic en la pestaña Acciones
Rápidas y le damos los siguientes valores:
3) En la página Manuales añadimos dos objetos imagen y una etiqueta, de la siguiente manera:
4) Luego hacemos doble clic en el objeto etiqueta, en la venta de propiedades de etiqueta, vamos a la
pestaña Acción Rápida, le damos los valores siguientes:
3) Una vez realizado estos pasos, nos toca ver el resultado, para esto guardamos el proyecto y publicamos
el Proyecto.
Clic en el botón
para ir a la
página Manuales.
Clic en este
botón y se
cierra la
aplicación.
Clic en el texto e
inmediatamente
se abrirá el
documento.
Clic en este
botón y
regresaremos
a la página
principal.
CAPÍTULO 4
VIDEO
Si una imagen vale más que mil palabras, ¿cuántas palabras valen un video? En Este capítulo mostraremos
cómo añadirle un video a tu proyecto, cubriremos algunas configuraciones de video básicas y te
enseñaremos cómo controlar un video utilizando unas cuantas acciones simples.
1. AÑADIR UNA IMAGEN DE PANEL COMO FONDO DE NUESTRO VIDEO.
En el capítulo 2 vimos la manera de insertar objetos imagen, a través del panel Galería. Pues dentro de
esta las imágenes están divididas en carpetas o categorías, y una de estas carpetas es la de paneles donde
hay imágenes de paneles. Una imagen de panel es simplemente un objeto de imagen que colocas detrás
de otro objeto para lograr algún tipo de fondo personalizado o efecto de marco de fotografía. Utilizaremos
otra imagen de Panel para proporcionarle un “marco” a nuestro objeto de Video.
1) Comencemos añadiendo una nueva página a nuestro proyecto con el nombre de Video. Luego en
nuestra página Principal, añadimos la acción correspondiente al botón Video Tutoriales para ir a la nueva
página Videos. El procedimiento ya lo vimos en el anterior capítulo. Trate de que la nueva página Video
tenga el siguiente diseño como vemos en la imagen siguiente.
2) En esta nueva página Video, vamos al Panel Galería, clic en el botón Imagen, abrimos la carpeta
Paneles y buscamos la imagen 066FC01.png, lo seleccionamos y lo arrastramos a la página.
3) Después de que hacer clic en OK, el nuevo objeto de video aparece en la esquina superior izquierda de
la página. Un recuadro sencillo del video aparece en el objeto, de modo que cuando trabajes en el
proyecto puedas tener una idea general de lo que se va a ver cuando éste inicie. En este caso, el recuadro
resulta ser negro debido a que el video Magnolia.mpg inicia con un desvanecimiento a partir de negro.
Observa los controles estándar de video en la parte inferior del objeto de video. Este es el panel de control
del objeto. En el panel de control hay un
botón reproducir/pausar, un botón detener,
un botón deslizador de posición y una
lectura del tiempo transcurrido.
Nota: El botón reproducir alterna entre
reproducir y pausar: cambia al botón pausa
cuando el video está reproduciéndose, y
luego conmuta al botón reproducir cuando
el video es pausado.
Una vez que este en la posición exacta, es
decir, al medio de nuestra imagen de panel,
puedes anclar el objeto Video con CTRL + P.
4) Para realizar algunos cambios en la
configuración de las propiedades de este objeto video, podemos hacer doble clic en este objeto e
inmediatamente saldrá la venta de propiedades, vamos a la pestaña Ajustes.
Además de los controles de video incorporados en el panel de control del objeto de Video, puedes utilizar
acciones de video del AutoPlay para incorporar tus propios controles de video “hechos en casa”.
1) En el Panel de Propiedades del objeto Video dar el valor de None a ControlStyle, con esto se eliminará
completamente el panel o la barra de control del objeto video.
Para esto utilizamos las opciones de Alineación, Duplicar objetos, etc. Funciones que ya aprendimos en los
anteriores capítulos.
CAPÍTULO 5
SONIDO
El audio es una parte muy importante de cualquier aplicación multimedia. Los efectos de sonido ayudan
a hacer que los objetos interactivos, como los botones, “tengan vida”, y les dan indicios útiles a los
usuarios para ayudarlos a reconocer cuáles objetos son interactivos. La música de fondo puede ayudar
en buena medida a que tu trabajo alcance el impacto emocional que deseas. Y en muchos casos el audio
es una parte integral de la aplicación.
1. CAMBIAR LOS SONIDOS POR DEFECTO DEL OBJETO.
Con excepción de los objetos Flash, RichText, Input, Listbox, Web, Progress, Combobox y Tree, todos los
demás objetos en AutoPlay pueden accionar dos tipos de efectos de sonido: uno para cuando el usuario
posiciona el ratón sobre ellos (un sonido “highlight”), y otro para cuando el usuario hace clic en ellos (un
sonido “click”). Para cada efecto de sonido del objeto tienes tres opciones: a) que no se reproduzca ningún
sonido, b) que se reproduzca un sonido personalizado específico para ese objeto o c) que se reproduzca un
sonido estándar definido en las configuraciones del proyecto. El sonido estándar facilita cambiar los
efectos de sonido para todos los objetos en tu proyecto a la vez, sin tener que ir a cada objeto y cambiar
sus configuraciones de sonido individualmente. Para demostrar cómo trabaja el sonido por defecto del
objeto, cambiemos temporalmente el sonido estándar highlight para todos los objetos del proyecto.
1) Elige menú Proyecto > Audio, en la ventana de Configuración Audio, clic en la pestaña Sound Effect. La
pestaña Sound Effects es donde puedes elegir los sonidos por defecto highlight y click para todos los
objetos del proyecto (o por lo menos para todos los objetos del proyecto que tengan sus sonidos highlight
o click ajustados a “Standard”. Cualquier cambio que hagas en esta pestaña afectará inmediatamente a
todo el proyecto.
Clic
Aceptar
AutoPlay viene con un montón de muestras de efectos de sonido que puedes utilizar en tus proyectos.
Todos estos efectos de sonido están en formato Ogg Vorbis. Ogg Vorbis es un formato comprimido de
fuentes de audio similar al MP3, pero capaz de tener una mejor calidad de sonido e incluso un tamaño de
archivo más pequeño. A diferencia de otros formatos de audio, el Ogg Vorbis está patentado y es de
licencia libre, haciéndolo una excelente opción para la distribución gratuita de audio digital.
Nota: El códec MP3 está licenciado por Fraunhofer IIS-A. Si generas ganancias utilizando música en
formato MP3, tendrás que responsabilizarte de pagarles cierto porcentaje de cada venta.
2) Ahora guardamos el proyecto y al previsualizarlo con F5, veremos y escucharemos el cambio. Muchos
aconsejan mantener los sonidos por defecto.
2. QUITAR EL SONIDO EN LOS OBJETOS.
Para eliminar el sonido en los efectos solamente debemos ir al panel de Propiedades del objeto en la
categoría SONIDO cambiar el valor de y de .
Para que nuevamente tenga sonido por defecto, cambios estas propiedades el valor de Estándar.
3. CONFIGURACIÓN DE EFECTOS DE SONIDO DE UN OBJETO ESPECÍFICO.
No siempre vamos a querer que cada objeto utilice el mismo sonido. Algunos objetos fueron hechos
precisamente para sonar diferente. Afortunadamente, AutoPlay te permite especificar un sonido
personalizado para cada configuración de sonido del objeto. De hecho, si lo quisieras, cada objeto en tu
proyecto podría tener un único sonido.
1) Añade una etiqueta, doble clic en este, en su ventana de propiedades vamos a la pestaña Ajustes y
realizamos los siguientes pasos, como se observa en la imagen.
En AutoPlay es realmente fácil añadir una lista de canciones y reproducirlas como música fondo. Como un
soundtrack en una película, la música de fondo puede manipular el estado de ánimo y añadirle a tu
aplicación una atmósfera de emoción.
1) Clic menú Proyecto > Audio, en la ventana de propiedades hacemos clic en la pestaña Música de Fondo
(Background Music), realizamos los siguientes pasos.
Reproducir la canción
seleccionada.
Clic en el botón Añadir
para poder adicionar Para la Reproducción de
archivos de música. Por la canción seleccionada.
ejemplo Easy
(short).ogg
Opción para cambiar el
Clic para eliminar el archivo volumen de
de música de la lista. reproducción de las
canciones.
Modo de reproducir de
las canciones de la lista
secuencial o
aleatoriamente.
Finalmente clic en el
botón Aceptar.
2) Ahora guardamos el proyecto y lo publicamos, para poder en este caso escuchar la música de fondo de
nuestra aplicación.
5. PAUSAR MUSICA DE FONDO.
Hay ocasiones que se debe detener la reproducción de la música de fondo. Por ejemplo, si tienes un
objeto de Video que cuenta con su propio soundtrack, probablemente no quieres que entre en conflicto
con la música de fondo, así que querrás pausar la música de fondo mientras el video esté siendo
mostrado. En nuestro caso, el video se muestra mientras el usuario está en la página Video, así que
necesitamos desactivar la música de fondo cuando él se dirija a esta página, y después activarla de nuevo
cuando él abandone la página.
Consejo: Puedes utilizar esta misma técnica que realizaremos a continuación, para añadir un
botón alternador de modo que el usuario pueda activar o desactivar la música (por si acaso sus
preferencias musicales son un poco diferentes de las tuyas).
1) Doble clic en la página Video, en la ventana de propiedades vamos a la pestaña Script. Escogemos el
evento OnShow luego clic en el botón Añadir Acción. Seleccionamos la categoría Audio y la propiedad
Audio.Toggle.Play, clic botón siguiente. Como tercer paso cambiamos el valor de Channel por el de
CHANNEL-BACKGROUND.
NOTA: En los parámetros de la acción puedes especificar el canal que quieres que la acción alterne. En
este caso queremos alternar el sonido del canal de audio de fondo, así que necesitas cambiar la
configuración Channel a CHANNEL_BACKGROUND.
Una vez que tengas la acción configurada, haz clic en Finalizar para cerrar el asistente. La acción
Audio.TogglePlay aparecerá en el editor de Script.
A continuación mostramos las respectivas capturas de pantallas de todo el procedimiento realizado.
No cierres el editor de Script aún; necesitas añadirle también una acción al evento OnClose.
El evento On Show se activa o entra en acción cuando la página se abre. La música de fondo aún estará
reproduciéndose cuando el usuario abandone la Página Principal, así que esta debería pausar la música
cuando el usuario se dirija a la página Video.
2) Lo que vamos a realizar es seleccionar y copiar la acción Audio.ToggePlay al evento OnClose de la
página. Queremos añadir otra acción Audio.TogglePlay pero ahora al evento OnClose de esta página para
activar de nuevo la música de fondo cuando el usuario salte a la página principal. Esta necesita ser igual a
la acción que le añadiste al evento OnShow debido a que queremos que las dos acciones se compensen
una con otra (una para desactivar el audio y la otra para volverlo a activar).
Podrías hacer clic en la pestaña OnClose y luego añadir otra acción de la misma forma que lo hiciste en el
paso 2. Pero puesto que queremos que esta acción tenga los mismos parámetros que la primera, podrías
también ahorrarte un poco de tiempo y tan solo copiar el texto desde una pestaña hacia la otra.
Para hacer esto, simplemente selecciona la línea completa de texto y presiona Ctrl+C para copiarla en el
portapapeles. Luego haz clic en la pestaña OnClose y presiona Ctrl+V para pegar el texto dentro de ese
evento.
Debemos darnos cuenta que esto no le afectará para nada a la acción que añadiste en la pestaña On Show
(las acciones que añadas a una pestaña permanecen igual cuando conmutas o cambias hacia otra
pestaña). Simplemente le estás haciendo un cambio a ambos eventos al mismo tiempo.
Una vez que hayas configurado la acción para el evento OnClose, haz clic en Aceptar para cerrar el editor
de Script y confirmar tus cambios.
3) Guarda el proyecto y dale F5 para previsualizar el proyecto y así hacer la prueba del correcto
funcionamiento de este procedimiento que hicimos.
CAPÍTULO 6
PUBLICACIÓN PROYECTO
En este último capítulo avanzaremos a la etapa final del desarrollo del proyecto AutoPlay: construcción y
publicación de tu aplicación AutoPlay.
1. PUBLICAR EL PROYECTO EN UNA CARPETA EN EL DISCO DURO.
El método más rápido de publicación es construir el proyecto hacia una carpeta de tu disco duro. Cuando
publicas tu proyecto en una carpeta, AutoPlay utiliza las configuraciones en el archivo de proyecto para
generar un ejecutable para tu aplicación. Luego copia este ejecutable (junto con todo el contenido de la
carpeta CD_ROOT de tu proyecto) a alguna carpeta externa que elijas.
La única diferencia entre construir hacia una carpeta y quemar en CD, es dónde termina tu aplicación. La
construcción hacia una carpeta es esencialmente igual que preparar el contenido de un CD en una carpeta
antes de quemarlo.
1) Vamos al menú Publicar > , para abrir el asistente de Publicación. En este asistente
elegimos la opción Carpeta del Disco Duro (Hard Drive Folder) y haz clic en Next.
2) Al hacer clic en Next te llevará a la segunda página del asistente donde podrás especificar la carpeta de
salida.
Consejo: Incluso si estás planeando quemar tu proyecto en un CD, es una buena idea
construirlo antes hacia una carpeta por lo menos la primera vez. De este modo, puedes
probar primero tu aplicación sin desperdiciar un CD-R, o tener que esperar con un quemado
lento en CD-RW. Una vez que estés seguro que todo trabaja de la forma que quieres, puedes
volver a publicar tu proyecto utilizando un método diferente, o bien quemar el contenido de la carpeta de
salida utilizando un programa quemador externo.
Puedes utilizar una carpeta ya existente para este propósito, pero es mejor crear una nueva carpeta
debido a que cualquier archivo que se encuentre en ella será borrado antes de que la aplicación sea
construida.
¡Advertencia! ¡Cualquier archivo en la carpeta de salida será borrado durante el proceso de
construcción! Ten cuidado de no utilizar una carpeta que contenga algún archivo o sub-carpeta
4) Haz clic en Close para salir del asistente de Publicación. Cuando la carpeta de salida se abra, haz doble
clic en el archivo autorun.exe para lanzar tu aplicación. Cuando cierres el asistente de Publicación,
AutoPlay automáticamente abrirá por ti la carpeta de salida.
5) El contenido de esta carpeta es exactamente lo que verás en el directorio raíz del CD o DVD si quemas
tu proyecto en un disco en lugar de construirlo hacia una carpeta.
En efecto, todo aquí es construido y está listo para funcionar. Podrías seleccionar todo en la carpeta de
salida, arrastrarlo a tu software de quemado de CD y quemarlo. O podrías utilizar una herramienta como
Setup Factory para empacarlo dentro de un instalador, de modo que pueda ser instalado en el disco duro
del usuario como cualquier otra aplicación. Por supuesto, antes de distribuir tu proyecto, siempre deberías
probarlo completamente. Para lanzarlo sólo haz doble clic en el archivo Autorun.exe.
6) Una vez que has tenido la oportunidad de probar tu aplicación, cierra la aplicación y regresa al ambiente
de diseño del AutoPlay.
Ahora probemos la construcción del proyecto como un ejecutable comprimido.
2) En la ventana siguiente podrás especificar una ruta y un nombre de archivo para el ejecutable. Luego
selecciona la opción Ventana de progreso y clic en el botón Build.
4) Haz clic en Close para cerrar el asistente de Publicación. Cuando la carpeta se abra, haz doble clic en el
archivo ejecutable para lanzar tu aplicación. La aplicación completa está contenida dentro de este archivo.
Cuando hagas doble clic sobre él, el mensaje “Por favor espere…” aparecerá y el contenido será extraído
automáticamente a una carpeta temporal del disco duro, y luego la aplicación arrancará igual que antes.
Con su motor de quemado incorporado, AutoPlay Media Studio hace que la publicación a un CD-R, CD-RW,
DVD±R o DVD±RW sea pan comido.
Para este ejercicio, describiremos las etapas de quemado a un disco compacto, así que no tienes que estar
leyendo "CD-R, CD-RW, DVD±R o DVD±RW” una y otra vez. Pero los mismos principios aplican para el
quemado a DVD±R o DVD±RW.
Nota: Necesitarás una unidad quemadora de CD-R o CD-RW y un disco CD-R o CD-RW para poder
completar este ejercicio.
1) Inserta un CD o un CD-RW en blanco dentro de tu quemador de CD y presiona F7 para abrir el Asistente
de Publicación.
Nota: Te recomendamos utilizar un disco CD-RW de modo que puedas reutilizarlo posteriormente.
2) Selecciona la opción Grabar Datos CD/DVD y haz clic en Next. Esta vez vamos a quemar el proyecto en
un CD regrabable.
Al hacer clic en Next te llevará a la segunda página del asistente donde podrás especificar las opciones de
quemado.
3) Selecciona tu unidad quemadora de CD de la lista desplegable y cambia la configuración Volume
identifier a algo más apropiado como MiTutorial. La lista desplegable Grabadora de CD/DVD, es
proporcionada en caso de que tengas varias unidades de CD o DVD en tu sistema. Selecciona la unidad que
será utilizada para quemar el CD. El campo Nombre del Ejecutable te permite especificar el nombre del CD
que aparecerá en la carpeta Mi PC en Windows.
4) Haz clic en Burn y espera a que finalice el proceso de quemado. Si estás utilizando un disco CD-RW, un
cuadro de diálogo de advertencia aparecerá preguntándote si estás seguro de que quieres hacer eso. Si el
CD-RW no está vacío, aparecerá un cuadro de diálogo preguntándote si quieres borrar el disco. Si estás
seguro que no hay nada importante en ese disco que quieras conservar, entonces haz clic en OK y
AutoPlay borrará por ti el disco antes de quemar el proyecto. (Si colocas el disco equivocado por error, tan
solo expúlsalo y reemplázalo por otro en blanco). Una vez que el quemado se complete, la unidad
automáticamente expulsará el CD.
5) Clic en Close para salir del Asistente de Publicación. Cierra la bandeja del CD para reinsertarlo de nuevo
en la unidad. Después de que insertes el CD en la unidad, deberás escuchar que el lector da vueltas
cuando la unidad comienza a leer el contenido. La unidad buscará en la carpeta raíz del CD un archivo
llamado autorun.inf, el cual le indica a tu computadora el nombre del programa que debe cargar cuando el
CD sea insertado.
Nota: AutoPlay crea automáticamente por ti el archivo autorun.inf cuando está activada la opción Activar
característica AutoPlay.
Tu aplicación AutoPlay deberá iniciar automáticamente. (Si no lo hace, entonces la característica de
autoarranque está deshabilitada en tu computadora. Necesitarás rehabilitarla tú mismo, o bien abrir el CD
desde “Mi PC” y luego hacer doble clic en el archivo autorun.exe).
6) Sal de la aplicación y regresa al AutoPlay Media Studio. ¡Eso es todo! Acabas de publicar tu proyecto
AutoPlay en un CD.
Ahora sabes todo lo necesario para poder construir y publicar los proyectos que elabores con el AutoPlay.
Resumen del capítulo. En este capítulo aprendiste cómo:
ü Publicar el Proyecto en una carpeta en disco duro.
ü Publicar un ejecutable comprimible.
ü Publicar el proyecto en un CD o DVD.