You are on page 1of 89

Presentacin

Una de las grandes mejoras de la nueva versin de Neobook 4.x es la aparicin de objetos. Un objeto es un elemento de nuestra publicacin (imagen, botn, texto, etc.) al que se le pueden asignar propiedades especficas.

Todo objeto de una publicacin tiene nombre (no equivocarse con el nombre del archivo, por ejemplo, podemos usar un archivo grfico llamado mapa.jpg, pero dentro de la publicacin podemos ponerle el nombre que queramos a este objeto y no debe llevar extensin). Si cuando creamos un objeto no le ponemos nombre, el propio Neobook se lo pone por defecto (Botncomando17, Cuadro16, etc. ), es conveniente que pongamos siempre nombre a cualquier objeto de nuestra publicacin para poder hacer referencia a l de forma ms sencilla. Tambin los objetos tienen la propiedad Estado inicial. Que nos permite seleccionar que nuestro objeto est: visible o no y habilitado o no.

no visible/visible

habilitado/no habilitado

En este captulo vamos a realizar paso a paso una aplicacin sencilla que nos permita utilizar las propiedades de los objetos, para que, una vez familiarizados con stas, podamos construir de forma rpida trabajos ms complejos. La prctica va a consistir en elaborar una publicacin con una nica pgina que nos permitir trabajar con diferentes objetos botones y objetos grficos. Para realizar las prcticas de este captulo recuerda que debes pasar a la carpeta raz del disco duro C de tu ordenador lacarpeta mapas que est en el CD-ROM del curso y guardar dentro de ella los ejercicios que se propongan. Una vez la tengas en C, puedes ejecutar mapas.exe para ver cul sera el resultado final. Vamos a trabajar esta aplicacin realizando los siguientes pasos:

Preparando la publicacin
Vamos a poner las opciones necesarias en nuestra publicacin.

Tamao y colores de la publicacin. El primer paso va a consistir en definir las dimensiones de las pginas de nuestro libro, as como el nmero de colores que utilizar nuestra aplicacin.

Hacemos clic sobre el botn Nueva publicacin que est situado a la izquierda de la barra de herramientas o de acceso directo, y aparecer este cuadro de dilogo:

Podemos seleccionar uno de los tamaos de la pantalla o introducir los datos de uno personalizado. Hoy en da casi todos los monitores de los ordenadores estn configurados a 800X600 1024X768, aunque algunos usuarios con equipos antiguos siguen trabajando a 640X480. En este caso vamos a seleccionar un tamao de 800X600. Si nuestra publicacin, una vez compilada, se ejecuta en un equipo con una resolucin mayor al tamao que hemos seleccionado entonces nuestra publicacin no ocupar toda la pantalla y se ver parte del escritorio de nuestro equipo.

Para evitar que aparezca el fondo de nuestro escritorio cuando se ejecute la aplicacion es conveniente que pulsemos en las opciones Libro > Propiedades del libro.

Aparece un cuadro de dilogo, donde seleccionaremos la opcin Ventana y dentro de ella Ventana a pantalla completa.

A partir de este momento, cuando compilemos nuestra publicacin, la aplicacin ocupar totalmente la pantalla y el espacio que falte lo rellenar del color determinado (negro en el caso de la figura, ya que est seleccionado como Color de fondo) En cambio, si nuestra aplicacin compilada se ejecuta en un equipo con menor resolucin de pantalla (por ejemplo, 640x480) observaremos que aparecen unas barras de desplazamiento a los lados de la aplicacin ya que no aparece completa la aplicacin en la pantalla. Con respecto a los colores, podemos optar entre 16 Millones de colores (si en la publicacin vamos a utilizar fotografas) o 256 colores (si nicamente utilizamos figuras simples).

Guardar la publicacin. Aunque no hemos creado nada an, es conveniente ir guardando nuestra publicacin. Hay que tener en cuenta que nuestra publicacin mientras estamos modificndola est en la memoria RAM, y aunque es sta la memoria ms rpida del ordenador, es voltil, es decir, si se bloquea el ordenador o se produce un corte del fluido elctrico, todo el trabajo realizado se perder. Para guardar una publicacin a memoria externa (disco duro, memoria usb o disquete) que no ha sido guardada previamente procederemos as:

Ejecutamos Archivo > Guardar o hacemos clic sobre el botn

. En este cuadro de dilogo desplegamos la casilla Guardar en y buscamos la carpeta mapas. En el cuadro de texto Nombre de archivo teclearemos el nombre que deseemos asignar a nuestra publicacin. Nosotros pondremos, por ejemplo: mapas (Neobook le asignar la extensin pub). Hacemos clic sobre Guardar.

Observaremos que ahora en la barra de ttulo aparece el nombre de la publicacin y la carpeta en la que se encuentra guardada: "Neobook para Windows - [C:\mapas\mapas.pub (800x600 16M Colores)]"

Pulsa de vez en cuando sobre el botn guardar . De este modo no perders los cambios que vayas realizando en tu publicacin. Renombrar las pginas. Neobook le asigna por defecto a las pginas el nombre de Nueva pgina, y le aade un nmero que le permite ordenarlas en el libro. Esta forma de identificar a las pginas resulta un tanto engorrosa, sobre todo cuando una publicacin tiene un elevado nmero de pginas, de ah que sea conveniente asignarle un nombre a cada pgina que nos permita localizarlas con mayor rapidez y facilidad. En nuestro caso nicamente tenemos una pgina pero la vamos a renombrar igualmente (laPgina Maestra no se puede renombrar).

Para dar un nombre diferente a las pginas: Hacemos clic con el botn derecho del ratn sobre la lengeta de la pgina que deseamos renombrar, por ejemplo sobre la primera: Nueva pgina. Seleccionamos Pgina > Renombrar . Aparecer el cuadro de dilogo Renombrar pgina. Tecleamos en l el nuevo nombre de la pgina, mapas en este caso.

Hacemos clic sobre Aceptar.

Observando la lengeta de esta pgina veremos que ha cambiado de nombre.

Introduciendo texto
Lo primero que vamos a hacer es colocar un texto en la pgina mapa, que nos servir como ttulo para dicha pgina. Para ello seleccionamos el botn Insertar Texto de la Barra flotante de herramientas.

El cursor cambia a una especie de I latina y haremos un rectngulo en la pgina que englobar nuestro texto. Nos aparece un cuadro de dilogo que nos permitir introducir texto.

Seleccionamos el tamao de la letra (36 en nuestro caso), cambiamos el tipo de letra en la opcin de cambiar la tipografa (Times New Roman en nuestro caso), escribimos Mapa de Extremadura y al objeto le llamamos texto.

Pulsamos en Aceptar y aparece el texto en nuestra publicacin. Dado que en nuestra publicacin vamos a utilizar algunos grficos de gran tamao, nos interesa que el texto est situado aproximadamente en la siguiente posicin:

Ahora debemos quitar el borde del texto, para ello:

Extendemos la barra flotante de herramientas, pulsamos en Ancho de lnea y seleccionamos Ninguno. Tambin nos interesa que el Patrn de relleno est Hueco. De esta forma tendremos el texto sin borde alrededor.

Utilizando la opcin de duplicar (Editar > Duplicar), teniendo seleccionado el texto, cambiando los colores de las letras (Color de tipografa en la barra flotante de herramientas) y utilizando las opciones de enviar atrs y llevar adelante podramos dejar el texto as: podemos mejorar el aspecto del texto escrito. Por ejemplo

Insertando imgenes
A continuacin vamos a insertar la imgenes que necesitamos para la aplicacin. Estas imgenes estn situadas en la carpeta mapas del disco duro C de tu equipo (no insertes las imgenes del CD), y son las siguientes ciudades.jpg rios.jpg

sierras.jpg

MapaExtremadurablanco.jpg

Insertamos las cuatro imgenes, una encima de otra y ocupando el mismo espacio. Para ello utilizamos la herramientaCuadro/Archivo grfico situada en la barra flotante de herramientas. Al seleccionar este icono y crear un hueco en pantalla aparece un cuadro de dilogo para seleccionar un archivo de imagen. Una vez insertada la imagen en nuestra aplicacin, podemos hacer clic derecho sobre ella para que nos aparezca un cuadro con las propiedades del objeto que hemos insertado. Por ejemplo, al insertar la imagen sierras.jpg y ver sus propiedades haciendo clic derecho, observaremos que aparece el siguiente cuadro de dilogo:

En este cuadro de dilogo debemos ponerle un nombre a este objeto (no tiene nada que ver con el nombre que tenga el fichero original) que lo identificar respecto a todos los dems objetos de la aplicacin. Es conveniente marcar las opcionesReducir imagen para ajustar a ventana y Mantener la proporcin de aspecto. En Estado inicial quitaremos la marca Visible(por defecto aparece Visible marcado), de esta forma este objeto, cuando se ejecute la aplicacin , aparecer como invisible y nuestro propsito es hacerlo visible cuando se pulse un determinado botn.

El Estado inicial de las imgenes sierras.jpg, rios.jpg y ciudades.jpg debe ser no visible. El Estado inicial de la imgen Mapadeextremadurablanco.jpg debe ser visible.

Las imgenes sierras.jpg, rios.jpg y ciudades.jpg nos interesan que sean insertadas en nuestra aplicacin con la particularidad de que el fondo de cada una sea transparente, y as poder solapar los tres grficos sin que el fondo de ellas nos oculte otro de los grficos. Para ello debemos seleccionar la opcin trasparente en siguiente: , y al pulsar observaremos que aparece un cuadro de dilogo como el

El cursor se ha convertido en que nos permitir seleccionar qu color plano haremos transparente (lgicamente en los tres grficos seleccionaremos el fondo blanco). Una vez realizado todo este proceso sobre las imgenes reseadas, al ejecutar algo parecido a la siguiente pantalla: debe quedarnos

Los textos "Cceres" y "Badajoz" han sido creados con la herramienta de Insercin de texto.

Insertar botones de accin


El ltimo paso que nos falta es colocar los botones que nos muestran y ocultan los mapas.

Comenzamos con el botn que muestra el mapa de los rios:

Pulsamos en el icono Botn de comando de la barra flotante de herramientas y hacemos un rectngulo del tamao que aproximadamente tendr nuestro nuevo botn. Observamos que al soltar el ratn aparece un cuadro de dilogo:

En este cuadr de dilogo pondremos el texto "mostrar rios" que ser el que aparezca encima del botn; pondremos nombre al objeto (mostrarrios, en este caso) y el Estado inicial estar Visible.

Las Acciones del botn las trabajaremos un poco ms adelante.

Ahora vamos a crear un botn que oculte el mapa de los rios:

Seleccionamos el botn recien creado llamado mostrarrios. Pulsamos en Editar > Duplicar.

Observaremos que el botn mostrarrios se ha duplicado. Pulsamos con el botn derecho del ratn sobre este nuevo botn y aparecen las propiedades del botn:

Cambiamos el texto como sigue: "ocultar rios"; cambiamos el nombre del objeto a ocultarrios y el Estado inicialno tendr marcada la casilla Visible. Al Aceptar veremos que el nuevo botn ocultarrios no aparece aunque se ven ocho manijas que lo delimitan.

Es el momento de arrastrarlo con el ratn hasta la posicin exacta del botn mostrarrios creado anteriormente.

Nos falta asignar acciones a los dos botones mostrarrios y ocultarrios. Pero nos aparece una dificultad: no somos capaces de seleccionar el botn mostrarrios ya que cuando pulsamos sobre l se selecciona el botn no visibleocultarrios. La forma de poder seleccionar un botn que est debajo de otro es que lo seleccionemos de una lista de objetos que tiene la pgina en la que nos encontramos. Para que dicha lista aparezca en pantalla debemos pulsar enOpciones > Mostrar lista de objetos.

Observaremos que esta opcin queda activada (podemos desactivarla igualmente pulsando sobre ella) escritorio. , y que aparece un cuadro flotante llamado Lista de objetos en nuestro

Esta lista nos muestra todos los objetos que tiene nuestra publicacin en esta pgina. Estos objetos pueden ser cuadros de textos, botones, graficos, etc., y adems aparecen todos aunque estn no visibles. Podemos entender fcilmente que nos interese poner nombres a los objetos que vayamos a utilizar ya que son mucho ms fciles de identificar as que si su nombre fuera boton13 o figura6. Entonces vamos a poner las acciones correspondientes a los dos botones. Comenzamos con el botn mostrarrios:

Pulsamos con el botn derecho del ratn sobre el botn mostrarrios de la Lista de objetos y seleccionamosPropiedades del objeto...

Aparecen las Propiedades del botn mostrarrios. Seleccionamos las Acciones Las acciones que debemos seleccionar para que se ejecuten cuando se pulse este botn deben ser tres:

o o

Que muestre el grfico de los rios que habamos puesto en pantalla con la propiedad de no visible. Que oculte el propio botn mostrarrios. No tiene sentido que siga visible este botn cuando ya estamos viendo el mapa de los rios en pantalla.

Que muestre el botn ocultarrios (recuerda que estaba no visible). Evidentemente si el mapa de los rios est en pantalla necesitamos que est visible el botn que permite ocultarlo. Para ello pulsamos en Seleccionar Accin, grupo de acciones Objetos y accin Mostrar objeto (ShowObject)

En el cuadro de dilogo que aparece escribimos el objeto que queremos mostrar. Si pulsamos en el icono aparecen todos los objetos de la pgina; seleccionamos el objeto rios (as lo habamos llamado). Las otras dos acciones de ocultar el botn mostrarrios y mostrar el botn ocultarrios lo debemos hacer exactamente igual que hemos hecho para la accin anterior. El script del botn mostrarrios debe ser:

Vamos ahora con el botn ocultarrios:

Pulsamos con el botn derecho del ratn sobre el botn ocultarrios de la Lista de objetos y seleccionamosPropiedades del objeto...

Aparecen las Propiedades del botn ocultarrios. Seleccionamos las Acciones Las acciones que debemos seleccionar para que se ejecuten cuando se pulse este botn deben ser tres: o Que oculte el grfico de los rios que aparece en pantalla. o Que oculte el propio botn ocultarrios. No tiene sentido que siga visible este botn cuando ya no aparece el mapa de los rios en pantalla. o Que muestre el botn mostrarrios. Evidentemente si el mapa de los rios no est en pantalla necesitamos que est visible el botn que permite mostrarlo. Las acciones se realizan igual que hicimos anteriormente para el botn mostrarrios. El script del botn ocultarrios debe ser:

Hemos comenzado este captulo creando los botones de mostrar y ocultar rios; para terminar completamente la aplicacin debemos hacer los botones de mostrar y ocultar sierras y mostrar y ocultar ciudades.

Guarda la aplicacin carpeta c:\mapas.

con el nombre mapas.pub en tu

Un poquito de variables
Vamos a comenzar a trabajar con variables. Una variable es un elemento muy utilizado en los lenguajes de programacin. La definicin de variable, en el entorno de la programacin, es una porcin de memoria que almacena temporalmente un valor. Ejemplos de variables podran ser: x=8 localidad = Badajoz pi = 3,1416 curso= 3

En el primero de los ejemplos, la variable x contiene el valor 8, esto quiere decir que si queremos que aparezca en pantalla: "Tengo la edad de 8 aos", tendremos que introducir el siguiente cuadro de texto: "Tengo la edad de [x] aos" El valor de esta variable puede ir cambiando a medida que se van introduciendo nuevos valores (nuevas edades de otros nios, por ejemplo), pero el cuadro de texto no cambiar (Tengo la edad de [x] aos). Cuando salimos de la aplicacin que utiliza las variables, stas pierden su valor. Por eso se definen como porcin de memoria que almacena temporalmente un valor. Neobook dispone de su propio lenguaje de programacin y utiliza a su manera las variables. En este apartado crearemos una aplicacin llamada variables (variables.pub) con una primera pgina llamada "datos" que nos servir para entender el funcionamiento de las variables. Para ello pulsamos en Archivo > Nuevo y observaremos que aparece un cuadro de dilogo donde elegimos caractersticas iniciales de nuestra publicacin:

Seleccionamos las opciones que queramos y pulsamos en Aceptar. A continuacin pulsamos en Pgina > Renombrar para cambiar el nombre a la pgina:

A la pgina la llamaremos datos.

Seleccionamos la herramienta de insercin de texto de la barra flotante. Escribimos el texto "Cmo te llamas?" en la parte superior izquierda de la pantalla. Seguidamente pulsamos en la herramienta Caja de texto y con el ratn hacemos un hueco en pantalla a continuacin del texto escrito anteriormente. Nos aparece un cuadro de dilogo:

En este cuadro pondremos nombre a la variable, (por defecto Neobook suele poner un nombre, es conveniente que el nombre lo pongamos nosotros) en este caso nom. En Texto podramos poner el texto que queramos y que siempre aparecer por defecto escrito. Pulsamos en Aceptar.

Si pulsamos en Libro > Ejecutar o siguiente:

, comprobaremos que aparece en pantalla algo parecido a lo

Escribimos el nombre y quedar almacenado en la variable nom. Podemos cambiar los atributos del texto tanto a la pregunta como a la variable, dejndolo as, por ejemplo:

A partir de este momento podemos hacer referencia a la variable nom en cualquier lugar de nuestra aplicacin. Slo debemos tener en cuenta que cuando queramos que aparezca el contenido de la variable, sta debe estar entre corchetes [ ]. En este caso sera as: [nom]. Por ejemplo, si queremos hacer referencia al nombre de un alumno que est utilizando la aplicacin podemos escribir en un cuadro de texto: Yo creo [nom] que ya deberas saber esto. Coge el libro en la leccin 14 y repasa

Que al ejecutarse, dependiendo del valor de la variable nom podra aparecer: Yo creo Ana que ya deberas saber esto. Coge el libro en la leccin 14 y repasa Yo creo Santiago que ya deberas saber esto. Coge el libro en la leccin 14 y repasa Yo creo Dionisio que ya deberas saber esto. Coge el libro en la leccin 14 y repasa

El uso de variables nos permite realizar aplicaciones muy complejas, incluso nos permitira que una misma aplicacin pueda ser utilizada por alumnos de distintos niveles segn unos parmetros que podra introducir al comenzar el programa (edad, curso, materia, etc.), activndose diferentes opciones, ejercicios o pginas dependiendo de dichos parmetros.

Guarda lo que llevas de este ejercicio en una publicacin llamada variables.pub y contina con esta aplicacin que debe contener nicamente dos pginas (llamadasdatos y final).

La primera de ellas nos pedir nombre y edad (utilizaremos dos variablesnom y edad). En la segunda pgina, mediante la herramienta Texto de la Barra flotante, crearemos un cuadro de texto que ponga: Hola Juan, tienes 8 aos y te lo vas a pasar muy bien con esta aplicacin. Teniendo en cuenta que Juany 8 deben ser los datos que variarn segn lo introducido en la pgina anterior. Es decir, si en la pantalla anterior hemos escrito Ana y 7 en los valores de las variables, en esta pantalla aparecer Hola Ana, tienes 7 aos y te lo vas a pasar muy bien con este programa.

Evidentemente debes crear un botn en la primera pgina que nos permita pasar a la pgina siguiente. Recuerda guardar la aplicacin con el nombre variables.pub en la carpetac:\practicas.

Presentacin

La aplicacin que vamos a realizar se llamar instrumentos (instrumentos.pub, cuando la guardes) y todos los ficheros que usaremos se encuentran en la carpeta llamada instrumentos del CD. Recuerda que debemos pasar esta carpeta a nuestro disco duro para que usemos directamente los archivos de vdeo, sonido y texto que contiene esta carpeta. Tambin en ella guardaremos la aplicacin sobre instrumentos musicales que realizaremos. (No copies esta carpeta al escritorio sino a la carpeta raz del disco duro C:).

La ejecucin de la aplicacin que vamos a crear debe ser como la que sigue. Si por razones de tu navegador no se ejecuta al pulsar en el enlace de abajo, localiza el fichero instrumentos.exe situado en la carpeta instrumentos de tu disco duro y ejecuta el fichero con doble clic del ratn en l.

Pulsa aqu para ejecutar instrumentos.

.
Los vdeos de esta publicacin estn comprimidos con DivX. Si no los ves en tu ordenador, en el CD-ROM del curso est la carpeta La abres e instalas el programa .

Todos los ficheros que se usan en esta aplicacin estn localizados en la carpeta de tu disco duro. (Recuerda que los vdeos estn comprimidos con DivX y debers instalarlo si no lo tienes en tu ordenador). Cuando entramos en la aplicacin observamos que aparecen cinco botones que nos llevan a pginas de cinco instrumentos musicales:

Tambin observamos un botn con el texto Continuar:

Este botn est inactivo inicialmente y pasar a ser activo cuando hayamos accedido a cada uno de los cinco instrumentos propuestos, en cuyo caso nos permitir acceder a una pgina nueva llamada evaluar. Vamos a realizar esta aplicacin con Neobook paso a paso.

Introduccin de texto y botones de accin


Primeramente vamos a crear un aplicacin nueva a 800x600 y 16 millones de colores. A continuacin iremos a Libro > Propiedades del Libro y en la seccin Ventana seleccionaremos la opcin Ventana a pantalla completa. Seguidamente vamos a modificar el nombre a la primera pgina. Observaremos que en cada nueva aplicacin aparecen las pginas Pagina Maestra y Nueva Pgina.

La pgina maestra no la vamos a tocar pero a la pgina llamada Nueva Pgina le vamos a cambiar el nombre por men. Para ello, pulsamos en Pgina > Propiedades de la Pgina...

Aparece un cuadro de dilogo en el que modificaremos el nombre de la pgina y la llamaremos men:

Pulsamos en Aceptar y ya tenemos la pgina con el nuevo nombre. A continuacin pondremos el texto que aparece en la pgina men:

Para ello pulsamos en la herramienta texto , hacemos un rectangulo en pantalla con el tamao que queramos del texto y al soltar el ratn nos aparece un cuadro de dilogo que nos permite introducir texto:

Pondremos el texto "Instrumentos musicales", y seleccionndolo, podremos cambiar las propiedades del texto (tipografa, tamao, negrita, cursiva, subrayado, etc.). Hacemos este mismo proceso con el otro texto ("En esta aplicacin vas a trabajar...").

Una vez escritos los textos, podemos modificar sus propiedades fcilmente si pulsamos con el puntero sobre el texto que queremos modificar y teniendo extendida la barra flotante de herramientas seleccionamos Color de tipografa o Tipografa.

Si quisieramos cambiar el contenido del texto, podemos hacerlo pulsando con el botn derecho del ratn sobre el mismo. A continuacin, vamos a insertar los botones de accin que necesitamos:

Para ello, debemos seleccionar el botn comando de la barra flotante de herramientas. Con el ratn arrastramos para hacer un recuadro que englobe lo que ser el botn que estamos realizando. Al soltar el ratn observaremos que aparece un cuadro de dilogo como el siguiente:

Vamos a realizar el botn que nos lleve al instrumento musical almirez. En ese cuadro no pondremos texto al botn ya que vamos a utilizar una imagen que ya tiene texto. Tambin le pondremos nombre al botn (botonalmirez en este caso) y dejaremos marcados Visible y Habilitado del Estado inicial del botn. Seguidamente pulsamos en Apariencia, situado a la izquierda del cuadro de dilogo, el cual cambiar como sigue:

En este cuadro de dilogo debemos seleccionar las caractersticas fsicas que tendr nuestro botn. En este caso, vamos a elegir una imagen en forma de botn (este tipo de imgenes se pueden hacer con programas de retoque de imgenes comoPhotoshop, Paint Shop Pro, Gimp, etc.) que est situada en la carpeta instrumentos que hemos pasado a nuestro disco duro. Para ello, debemos seleccionar la opcin Usar imgenes individuales y a continuacin seleccionar la imagen sin presionar y la imagen realzado, es decir, qu forma tendr el botn antes de pulsar sobre l y qu forma tendr cuando se est encima de l.

Al seleccionar aparece un cuadro de dilogo que nos permite localizar la imagen que queremos utilizar como botn (enC:\instrumentos) e incluso nos permite seleccionar el color que queremos que sea transparente (esto es interesante cuando ponemos un fondo a la pgina).

A modo de ejemplo, el botn que aparece a continuacin tiene parecidas caractersticas fsicas que el que crearemos conNeobook (pasa el ratn por encima de este botn y lo comprobars):

Debemos repetir el proceso de crear los cinco botones, uno para cada instrumento musical: almirez, botella, badil, caldero y castauelas (sus imgenes de botones se encuentran en la carpeta C:\instrumentos). El botn continuar lo diseamos igual que los anteriores teniendo en cuenta que el fichero de imagen de este botn se llamacontinuar.gif y que su estado incial debe ser deshabilitado.

Introduccin de elementos multimedia


Aparte de la Pgina Maestra tenemos una pgina llamada men. En dicha pgina estn los cinco botones que hemos creado anteriormente y nos deben llevar a cinco pginas diferentes, una por cada instrumento musical, de forma que necesariamente debemos crear esas pginas. El proceso para crear una nueva pgina es el siguiente:

- Nos situamos en la pgina men.

- Pulsamos en el icono de Nueva pgina

, o bien pulsamos en Pgina > Aadir Pgina...

- Aparece un cuadro de dilogo como el siguiente:

- Donde nos indica el nmero de pginas a aadir pondremos 5 (una por cada instrumento). Seleccionamos que nos cree las cinco pginas despus de la pgina men. Neobook adems nos permite que cada pgina comience por la palabra que queramos, en este caso pondremos almirez y observaremos que aparecen cinco pginas nuevas llamadas almirez, almirez1, almirez2, almirez3 y almirez4.

- El siguiente paso es cambiar el nombre a las pginas almirez1, almirez2, almirez3 y almirez4 por badil, botella, caldero y castauelas respectivamente.

De esta forma ya tenemos las cinco pginas de los cinco instrumentos musicales. Vamos ahora a llenar de contenidos la pgina, por ejemplo, caldero. Para ello nos situamos en dicha pgina.

Creamos un texto con la herramienta texto de la barra flotante de herramientas literalmente Caldero.

que ponga

Despus de aplicarle las caractersticas que queramos (tipo de letra, tamao, etc.) situaremos este texto en el lugar de la pgina que queramos, siempre teniendo en cuenta que debemos dejar espacio para el dibujo del caldero, para los botones de vdeo y sonido y para el texto descriptivo de este instrumento musical. Seguidamente pondremos la imagen del caldero, que se encuentra en la carpeta c:\instrumentos de tu disco duro y que se llama caldero3.jpg. Para ello, pulsaremos en la herramienta imagen de la barra flotante de herramientas y haremos un rectngulo que englobar la imagen del caldero, al soltar el ratn aparece un cuadro de dilogo que nos permitir seleccionar la carpeta donde se encuentra la imagen y el fichero de la imagen.

Pulsamos en Abrir y ya tenemos la imagen en nuestra pgina. Recuerda que con el puntero podemos mover la imagen a la posicin que queramos y que con el botn derecho del ratn sobre la imagen nos aparecen las caractersticas de la imagen para modificar dimensiones, color transparente, etc. Selecciona las opciones Reducir imagen para ajustar a ventana yMantener proporcin de aspecto.

El siguiente paso es poner un artculo sobre este instrumento musical, en este caso el artculo est en formato rtf (formato de texto que puede crearse o transformarse con programas procesadores de textos muy utilizados, como son OpenOffice Writer, Microsoft Word, etc.). Este artculo lo insertaremos utilizando la herramienta Archivo de Artculo/Texto de la barra flotante de herramientas y haciendo un rectngulo con el ratn en la pgina, el cul englobar el artculo que vamos a insertar. Observaremos que al soltar el ratn aparece un cuadro de dilogo:

Como el artculo que vamos a insertar est en formato rtf, debemos seleccionar la opcin Abrir un documento existente y pulsar en Aceptar, de forma que nos aparece lo siguiente:

Debemos buscar nuestra carpeta C:\instrumentos y dentro de ella el texto Caldero, pulsamos en Abrir y observaremos que nuestro artculo sobre el instrumento musical caldero aparece en pantalla:

Si quisieramos editar el contenido de este artculo debemos pulsar con el botn derecho del ratn sobre l y se abrir un cuadro de dilogo con las propiedades del artculo, de forma que si pulsamos sobre el icono sealado con la flecha se abrir un editor de texto que nos permite modificar el contenido del artculo.

En cambio, si queremos cambiar tamao de letra, colores de letra, etc. debemos seleccionar las opciones de texto de labarra flotante de herramientas (en formato extendido):

Por ltimo vamos a crear los botones de accin. Primero crearemos un botn de accin que reproduce un archivo de sonido del instrumento caldero:

Creamos el botn pulsando en el icono correspondiente de la barra flotante de herramientas trazando un rectngulo sobre la superficie deseada, al soltar nos aparece el cuadro de dilogo de Propiedades del Botn de Comando:

,y

En la opcin de Sugerencia podemos poner un texto que aparecer unos segundos cuando el usuario de nuestra aplicacin pase por encima del botn que estamos diseando. En el campo Texto no pondremos nada porque utilizaremos una imagen que tenemos almacenada en nuestra carpeta. Seleccionamos Apariencia y aparece el cuadro siguiente:

Seleccionamos la imagen del botn, que en este caso ser el archivo botonnota.jpg situado en la carpetaC:\instrumentos, y ponemos a cero el ancho del bisel para que no aparezca bordeada nuestra imagen del botn. Seguidamente seleccionamos la seccin Acciones que nos abre un nuevo cuadro en el que elegiremos el comando que se ejecutar cuando pulsemos con el ratn:

Pulsamos en Seleccionar Accin y aparecen todos los comandos de accin agrupados por categoras de funciones de accin; en este caso vamos a el grupo de acciones Multimedia:

Veremos que se despliegan a la derecha todas las acciones del grupo Multimedia y entre ella elegimos, con el ratn, la instruccin reproducir archivo de sonido (PlaySoundFile) y seleccionamos el archivo de sonido caldero.wav de nuestra carpeta instrumentos:

Pulsamos en Abrir, Aceptar y Aceptar y ya tenemos nuestro botn asociado a la accin de reproducir el sonido del caldero (enciende los altavoces de tu equipo si quieres probar). Este proceso lo realizamos igual para el botn de reproducir un vdeo, teniendo en cuenta que: 1. 2. 3. El icono del botn de vdeo se llama botonplay.jpg. El comando que debemos utilizar es Reproducir archivo de vdeo (PlayvdeoFile) y tambin est en el grupoMultimedia. El archivo de vdeo se llama caldero2.avi.

Finalmente nos falta poner un botn que nos lleve a la pgina men. El proceso es igual que para los botones anteriores salvo que:

El icono del botn de volver a la pgina men es el archivo botonvacio.gif que no contiene el texto volver, de forma que debemos escribir el texto volver e indicar que el texto ir encima de la imagen.

La accin de ir a la pgina men se encuentra en el grupo Navegacin y se llama Ir a la Pgina (GotoPage), de forma que al seleccionar esta accin se abre un cuadro de dilogo donde podemos seleccionar la pgina a la que nos enviar la ejecucin de esta accin. Pulsando en la flecha de la derecha se despliegan todos los nombres de las pginas de nuestra aplicacin, debemos seleccionar, evidentemente, la pgina men:

Recuerda ir guardando la aplicacin pub con el nombre instrumentos (instrumentos.pub) en tu carpeta C:\instrumentos.

Hemos desarrollado la pgina caldero, ahora necesitamos hacer lo mismo con las otras cuatro pginas de los restantes instrumentos musicales. A cada pgina le pondremos ttulo, su artculo e

imagen correspondientes y los botones de reproducir sonido y vdeo de sus propios instrumentos musicales.

La opciones cortar, copiar, pegar y seleccionar todo no solamente seleccionan el objeto u objetos que queramos, sino que tambin sus propiedades y acciones. Por ejemplo, si seleccionamos y copiamos el botn de volver al men, podremos ir pgina por pgina pegando este botn y observaremos que se coloca exactamente en el mismo lugar que se encontraba en la pgina donde lo hemos copiado, y que adems la accin que lleva es la misma (volver a la pgina men). A los objetos pegados podemos cambiarles sus propiedades (fichero de imagen, comando de accin, fichero de sonido, vdeo, etc.) pulsando con el botn derecho del ratn sobre l.

Uso de variables
Ya tenemos la pgina men y las cinco pginas de los cinco instrumentos. Vamos a crear una nueva pgina que nos permita hacer una actividad de evaluacin con los alumnos y la llamaremos evaluar. Desde la pgina men tendremos un acceso a esta pgina a travs del botn que ya habamos colocado anteriormente:

Recuerda que habamos seleccionado que el Estado Inicial de este botn fuera no habilitado ya que nos interesa que el usuario haya accedido anteriormente a cada uno de las pginas de los instrumentos antes de habilitar este botn (mediante el uso de variables aprenderemos a hacer esto). Nos situamos inicialmente en la ltima pgina del ltimo instrumento que hayamos creado (en mi caso sera la pginacastauelas) y creamos la pgina evaluar mediante el icono Nueva Pgina Recuerda cambiarle el nombre. .

Ya podemos ir a la pgina men y asignar una accin al botn continuar. La accin ser Ir a la Pgina evaluar. Volvemos de nuevo a la pgina evaluar.

Ponemos el texto del ttulo de la pgina con la herramienta Texto

, que podra ser el siguiente:

Colocaremos las imgenes de los cinco instrumentos mediante la herramienta Cuadro/Archivo grfico . Los ficheros de estas imgenes estn en la carpeta C:\instrumentos y son: caldero3.jpg, botellaanis2.jpg, badil3.jpg, almirez3.jpgy castauelas.jpg.

Al insertar cada imagen aparece un cuadro de dilogo que nos permite elegir el fichero de imagen, en Sugerenciapondremos caldero para que en ejecucin cuando pasemos el ratn sobre la imagen aparezca este texto. Dado que el tamao original de las imgenes es grande y cuando se inserta una imagen en Neobook siempre se coloca en el tamao original, es conveniente que seleccionemos la opcin de Reducir imagen para ajustar a ventana, de forma que la ventana que hayamos abierto para incluir la imagen ser justamente el tamao de la imagen seleccionada (si queremos cambiar el tamao solamente tenemos que seleccionar la imagen y arrastrar cualquiera de las manijas). Tambin es conveniente marcar la opcin Mantener proporcin de aspecto.

A continuacin insertamos un botn para que vuelva a la pgina men, lo ms sencillo es copiar cualquier botn volver de cualquier pgina de instrumento musical que tenemos hecha y pegarlo en esta pgina, seguidamente podemos mover el botn a la posicin que queramos de la pantalla.

Nos falta lo ms complicado: tenemos que crear un botn que cuando el usuario de nuestra publicacin pulse en l se escuche aleatoriamente uno de los cinco instrumentos musicales; seguidamente el usuario pulsar sobre la imagen del instrumento musical que cree que corresponde a ese sonido y saldr un mensaje de acierto o error; tambin aparecer un contador de errores y aciertos.

La imagen donde se encuentran los aciertos y errores es marcador2.gif y se encuentra en la carpeta C:\instrumentos. El texto que se encuentra encima de este marcador Aciertos: y Errores: lo hacemos utilizando la herramienta texto de la siguiente forma:

El texto que escribimos es "Aciertos" y seguidamente utilizamos una variable llamada ac que para hacer referencia a su valor se pone entre corchetes [ ]. Una variable es un elemento que contiene un valor (numrico, texto...) que puede variar cuando se cumplen ciertas condiciones o cuando el usuario de la publicacin lo determina. En este caso la variable ac nos indicar el nmero de aciertos que llevamos. Cada vez que entremos en la pgina evaluar nos interesa que esta variable valga cero para que comience a contar los aciertos. En Pgina > Propiedades de la pgina podemos asignar el valor cero a la variable ac de la siguiente forma:

A continuacin seleccionamos Acciones > Seleccionar Accin, el grupo de acciones Variables y la accin Especificar variable (SetVar).

Observaremos que aparece el cuadro de dilogo del comando Especificar variable, en el cual seleccionamos nombre de la variable (en este caso ac) y ponemos valor (en este caso cero en nmero).

Hacemos exctamente el mismo proceso para los errores, pero utilizando la variable er. Finalmente tendremos, en las Propiedades de la pgina, dos instrucciones para que se ejecuten cuando se llegue a esta pgina:

Si todo va bien, al ejecutar

los marcadores deben aparecer a cero:

El texto pulsa para escuchar lo hacemos con la herramienta texto

Vamos a crear ahora el botn del sonido aleatorio: El botn lo hacemos con la herramienta Botn de comando utilizando la imagen botonnota.jpg de la carpeta C:\instrumentos. A continuacin seleccionamos Acciones > Seleccionar Accin, el grupo de acciones Control y la accin Aleatorio (Random):

El comando Aleatorio (Ramdom) genera un nmero entero comprendido entre 0 y el nmero que pongamos. En nuestro caso, como tenemos cinco instrumentos diferentes, nos interesa poner un 4 y as tenemos cinco posibilidades distintas (0, 1, 2, 3, y 4). La variable que almacena este nmero aleatorio la hemos llamado alea.

Seguidamente asignamos cada uno de los nmeros aleatorios a un instrumento musical diferente, de forma que por ejemplo:

Si Si Si Si Si

sale sale sale sale sale

aleatoriamente aleatoriamente aleatoriamente aleatoriamente aleatoriamente

un un un un un

0 1 2 3 4

suena el almirez suena el badil o badila suena la botella suena el caldero suenan las castauelas

Esto lo llevamos a la programacin del botn aleatorio de la siguiente forma:

Dentro de las propiedades del botn seleccionamos Acciones > Seleccionar Accin, el grupo de acciones Control y la accinIf (Si).

Aparece el cuadro de dilogo de las propiedades de este comando, donde rellenaremos la comparacin correspondiente a "si el contenido de la variable alea es un cero" entonces haz...:

Debemos tener en cuenta que cada vez que comparemos contenidos de variables siempre hay que poner la variable entre corchetes [ ] (entre parntesis no funcionara). Al pulsar en Aceptar:

Aparece el script o programacin de nuestro botn. Borramos el comando Else y una de las lneas en blanco. Nos situamos en la lnea blanca entre If y EndIf. Asignamos una instruccin para cuando se cumple la condicin, en este caso, que reproduzca el sonido del almirez (seleccionamos Acciones > Seleccionar Accin, el grupo de acciones Multimedia y la accin Reproducir Archivo de Sonido (PlaySoundFile) eligiendo el fichero de sonido del almirez).

Debemos hacer un comando If por cada nmero aleatorio diferente. La programacin de nuestro botn debe quedar as:

Podemos probar ejecutando nuestra publicacin y pulsando sobre el botn de generacin de nmero aleatorio a ver si cada vez que pulsamos suena un instrumento aleatorio. Funciona? Nos falta rematar la faena, es decir, cuando nuestro usuario pulse en este botn aleatorio sonar un instrumento, debe pulsar sobre una de las imgenes de instrumentos que hemos puesto anteriormente y si acierta que salga un mensaje de acierto y que el contador de aciertos (la variable ac) se incremente en uno; en cambio, si falla saldr un mensaje de error y el contador de errores (la variable er) se incremente en uno. Una de las aportaciones de la nueva versin de Neobook es que cualquier objeto puede funcionar como un botn, es decir, que las imgenes que hemos puesto pueden asumir esta funcin. De forma que vamos a programar las imgenes de los instrumentos musicales que tenemos en pantalla, por ejemplo, comenzamos por el caldero: Pulsamos con el botn derecho del ratn encima del caldero y aparece el cuadro de dilogo de propiedades del caldero, pulsamos en Acciones > Seleccionar Accin, grupo de acciones Control y por ltimo el comando Si (If):

Como anteriormente habamos decidido que si sala aleatoriamente (en la variable alea) el nmero tres sonaba el caldero, el comando Si (If) lo rellenamos de la siguiente forma:

Es decir, si el contenido de la variable alea es un tres entonces...

Justo debajo de la instruccin If pondremos dos acciones: una que nos ensea un mensaje de que hemos acertado y otra que incrementa en uno la variable que acumula los aciertos (ac). El Else nos indica que lo que hay debajo de l ser ejecutado si no se ha cumplido la condicin anterior, en nuestro caso, si el contenido de la variable alea no es un tres. Por lo tanto, justo debajo del Else pondremos dos acciones: una que nos ensea un mensaje de error y otra que incrementa en uno la variable que acumula los errores (er).

La imagen de acierto se llama muybien.gif y se encuentra en la carpeta C:\instrumentos y el

comando para mostrar la imagen se localiza en el grupo Mensajes/Interaccin accin Desplegar Imagen (PopUpImage).

y la

En el cuadro anterior podemos determinar si la imagen se presentar hasta que se pulse con el ratn, unos segundos, etc. y tambin podemos seleccionar el lugar exacto de la pantalla donde aparecer la imagen. El incremento de la variable que lleva los aciertos lo hacemos con la instruccin ya utilizada anteriormente SetVar; para ello seleccionamos Acciones > Seleccionar Accin, el grupo de acciones Variables y la accin Especificar variable (SetVar).

Como aparece en la imagen, a la variable ac le asignamos el valor que tiene [ac] con el incremento de una unidad.

La imagen de error se llama fallaste.gif y recordando que la variable que almacena los errores se llama er, finalmente el script de nuestra imagen del caldero debe quedar as:

Por ltimo, realizamos el proceso con las dems imgenes de instrumentos, siempre teniendo en cuenta qu nmero habamos asignado a cada instrumento con la variable aleatoria alea.

El script de la imagen del instrumento de la botella de ans es el mismo que el que hemos hecho del caldero, con la diferencia de que la comparacin no la hacemos con el 3 sino con el 2, que corresponde a la botella. Por lo tanto, si seleccionamos el script completo de la imagen del caldero, lo copiamos, lo pegamos en el script vaco de la imagen de la botella y cambiamos el 3 por un 2 ya tenemos hecha la programacin de ese instrumentos. Si hacemos esto con los dems instrumentos musicales nos ahorraremos tiempo.

Uso del contador


Hemos diseado la pgina de actividades de reconocimiento de instrumentos musicales (llamada evaluar) y solamente nos quedan pequeos flecos para terminar completamente la actividad. Los primero que debemos hacer es volver a la pgina men y asignar una accin al botn continuar.

Pulsamos con el botn derecho del ratn sobre l y aparece el cuadro de Propiedades del botn. Seleccionamos Acciones > Seleccionar Accin, grupo de acciones Navegacin y accin Ir a pgina (Gotopage).

En el cuadro que nos aparece debemos seleccionar la pgina con la que enlazar este botn. El nombre de la pgina lo podemos escribir o seleccionarlo de una lista que se puede desplegar, en este caso, seleccionamos la pgina evaluar.

Ya solamente nos falta un detalle: que el botn se habilite cuando el usuario de la aplicacin haya accedido a las cinco pginas de los cinco instrumentos musicales. Para ello nos vamos a ayudar de una pgina nueva que vamos a crear llamadadepaso. Esta pgina la vamos a colocar antes de la pgina men.

Nos situamos en la pgina men

Seleccionamos el icono de nueva pgina y aparece un cuadro de dilogo donde debemos seleccionar que la pgina se situe Antes de men y que se llamar depaso.

Pulsamos en Aceptar y ya tenemos la pgina creada en la ubicacin deseada.

En las propiedades de la pgina depaso vamos a asignarle una accin, es decir, cada vez que accedamos a esta pgina se ejecutar la accin que vamos a detallar a continuacin. Necesitamos que esta pgina ponga una variable a cero, esta variable ser la que nos cuente si hemos llegado a cinco

pginas accedidas (las de los cinco instrumentos) y as podamos habilitar el botn continuar de la pgina men.

Observamos que hemos puesto la accin Especificar variable (SetVar) del grupo de acciones Variables utilizando una variable llamada contador y dndole el valor cero. A continuacin utilizamos Ir a la Siguiente Pgina (GotoNextPage) del grupo Navegacin para que directamente pase a la pgina siguiente.

Si ejecutamos la aplicacin desde la pgina depaso, observaremos que directamente accedemos a la pgina men(internamente se ha puesto la variable contador a cero). El siguiente paso es situarnos en la pgina men y asignarles sus acciones correspondientes a cada uno de los botones de los instrumentos musicales que ya tenamos diseados anteriormente.

Comenzamos por el botn almirez: pulsamos con el botn derecho de ratn sobre l y seleccionamos Acciones. Vamos a necesitar que se ejecuten tres acciones:

Deshabilitar el mismo botn almirez para que ya no se tenga acceso de nuevo a esta pgina. Que nos lleve a la pgina del instrumento correspondiente al botn, en este caso, a la pgina almirez. Que la variable contador se incremente en uno.

Para ello hacemos lo siguiente: Pulsamos en Seleccionar Accin y dentro del grupo de acciones Objetos seleccionamos la accin Deshabilitar Objeto (DisableObject).

Si no recordamos el nombre del objeto que queremos deshabilitar podemos pulsar en el icono indicado en la figura anterior que nos despliega el listado de los objetos de la pgina (tambin podemos seleccionar los objetos de cualquier otra pgina utilizando la barra izquierda que nos indica los nombres de todas las pginas de nuestro Libro o aplicacin).

Seleccionamos botonalmirez en este caso, y aceptamos. Volvemos a pulsar en Seleccionar Accin y dentro del grupo de acciones Navegacin escogemos la accin Ir a la Pgina (GotoPage) y seleccionamos la pgina almirez. Por ltimo, volvemos a pulsar en Seleccionar Accin y dentro del grupo de acciones Variables escogemos la accinEspecificar Variable (SetVar) asignando a la variable contador el valor de la misma variable ms uno.

El proceso que hemos hecho sobre el botn del almirez debemos repetirlo con los otros cuatro instrumentos. Finalmente debemos ir a propiedades de la pgina men para introducir una accin que compruebe si el valor de la variablecontador es cinco, y si es as debemos habilitar el botn que nos lleva a la

pgina evaluar (esto querr decir que el usuario de nuestra aplicacin ha accedido ya a las cinco pginas de los cinco instrumentos y est en disposicin de pasar a la pgina con ejercicios de evaluacin). El script de la pgina men debe quedar como sigue:

El comando Si (If) se encuentra en el grupo de acciones Control

El comando Habilitar Objeto (EnableObject) se encuentra en el grupo de acciones Objetos

Comprobacin final: sitate en la pgina depaso y ejecuta Funciona? No es tan difcil... verdad?

para ver si funciona todo.

Guarda la aplicacin con el nombre instrumentos.pub en tu carpetac:\instrumentos.

Neotoon > Qu es Neotoon?


Neotoon es una herramienta que nos permite el montaje de animaciones a partir de una serie de imgenes generadas con un programa de dibujo o de edicin de imgenes. . Estas animaciones se pueden insertar en las publicaciones elaboradas con NeoBook insertando el mandato de accin Reproducir archivo de vieta (PlayCartoonFile) que encontrars en la categora Multimedia. Recuerda que esta modalidad no est disponible en las versiones de evaluacin. . Neotoon coloca las imgenes que formar la animacin dentro de un nico archivo para as ejecutarlo de forma eficaz. Los cambios de posicin de los objetos contenidos dentro del cortometraje se percibirn como movimiento. . El montaje de una animacin es tan simple como importar una serie de imgenes creadas con un programa de dibujo, una utilidad de captura de imagen, etc. Muchos programas de edicin, animacin y vdeo permiten exportar las animaciones como una serie de imgenes que pueden ser importadas a Neotoon. Neotoon en s no es un editor de imgenes, por lo que debers usar una aplicacin de edicin de dibujo/imagen/iconos para crear y ajustar las imgenes dentro de tus animaciones.

Inicio del Programa Para arrancar Neotoon debes ejecutar: Inicio > Programas > Neobook 5 > Neotoon Si tienes abierto Neobook tambin puedes acceder desde: Herramientas > Neotoon

Neotoon > La pantalla


Al iniciar Neotoon aparecer esta pantalla:

Esta ventana es similar a la de cualquier aplicacin que funcione bajo Windows. Sus elementos son: Barra de ttulo: Barra de men: Barra de botones: Contiene accesos directos a las funciones de Neotoon que se utilizan con mayor frecuencia. A su derecha aparece un contador que indica la posicin del fotograma seleccionado y el nmero total de fotogramas que contiene la animacin.

rea de trabajo: Est situada debajo de la barra de botones. Es la zona destinada a colocar los fotogramas que contendr nuestra animacin.

Neotoon > Abrir una animacin

Para abrir una animacin ejecutaremos el comando Archivo > Abrir y seleccionaremos un archivo .CAR. Este archivo se cargar en Neotoon para su posterior edicin. Por ejemplo, abre el fichero Asterisk.car que se encuentra en la carpeta Prcticas Neotoon:

Neotoon > Presentacin preliminar

Puedes ver la animacin haciendo clic sobre el botn Reproducir abrir una ventana que contiene los siguientes botones:

. Al pasar a esta modalidad se

Detiene la reproduccin de la animacin. Inicia la reproduccin de la animacin. Al detener la animacin se activan los botones tipo VCR que nos permiten movernos por los diferentes fotogramas. Permite controlar la velocidad a la que se reproducir la animacin. Arrastra la barra deslizadora hacia la derecha para aumentar la velocidad o hacia la izquierda para disminuirla. El contador entra en funcionamiento durante la ejecucin de la animacin, de esta forma podremos determinar los puntos donde los fotogramas saltan debido a una mala alineacin o al no estar en orden correcto. Nos permite cerrar la ventana de vista previa y volver a la modalidad de edicin.

Neotoon > Crear un archivo animado

El montaje de un archivo animado es tan simple como importar una serie de imgenes y colocarlas en el orden correcto dentro de la secuencia de animacin. . Veamos el proceso:.

Haz clic sobre el botn Nuevo . Te aparecer el cuadro de dilogo Nueva Vieta:

En la ventana anterior puedes indicar el tamao (ancho y alto) que tendrn todos los fotogramas de la animacin o, por el contrario, aplicar a todos los fotogramas el tamao que posea el primero. Nosotros, como no conocemos el tamao, vamos a marcar la casilla:

Usar ancho y alto de la primera imagen.

Haz clic sobre Aceptar. Para insertar el primer fotograma a nuestra animacin haremos clic sobre el botn Aadir y aparecer el cuadro de dilogo Seleccionar una imagen:

Selecciona la imagen que desees insertar. En este caso insertaremos la imagen hipopotamo1.gif que se encuentra en la carpeta Prcticas Neotoon. Puedes insertar imgenes de los formatos ms usuales: .bmp, .tif, .pcx, .jpg, .gif o .png. Al hacer clic sobre el botn Abrir aparecer la pantalla de Neotoon que mostrar el fotograma insertado. Para aadir nuevos fotogramas repetiremos los tres pasos anteriores. Nosotros haremos clic en y ahora seleccionaremos hipopotamo2.gif. Inserta ahora hipopotamo3.gif. Por ltimo, inserta hipopotamo4.gif. Observa que el nuevo fotograma se aade siempre al final de la animacin.

Si todo ha ido bien, la pantalla tendr este aspecto:

Si deseas cambiar la situacin de un fotograma no tienes ms que arrastrarlo hasta la nueva posicin. Si has cometido algn error y deseas eliminar un fotograma no tienes ms que seleccionarlo y pulsar

la tecla Supr o hacer clic sobre el botn Borrar. .

Recuerda que para ver la animacin debes hacer clic sobre el botn Reproducir .

Se abrir una ventana en la que podrs ajustar la velocidad de reproduccin .

. Una vez completada la edicin de la animacin debers guardar este archivo. Para ello ejecuta Archivo > Guardar o haz clic sobre . En ambos casos aparecer el cuadro de dilogo Guardar para que le asignes un nombre al archivo y le indiques la carpeta en la que deseas guardarlo. Por ejemplo, puedes guardarlo en la carpeta Prcticas Neotoon con el nombrehipoptamo. El programa se encargar de aadirle la extensin .CAR.

Habrs observado que los fotogramas tienen un fondo negro; sin embargo desaparece cuando insertamos la animacin en una publicacin de Neobook. Esto se debe a que Neotoon designa transparente al color del pxel situado en el extremo inferior izquierdo del primer fotograma. Todos los pxeles de los fotogramas que coincidan con este color sern considerados transparentes. Por lo tanto, colorearemos este pxel con el color que nos interese definir como transparente. Si no nos interesa una animacin transparente, dibujaremos el pxel inferior izquierdo del primer fotograma con un color que no se utilice en el resto de las imgenes.

Crea una nueva animacin utilizando las imgenes luna1.jpg, luna3.jpg, luna4.jpg,... luna9.jpg. Guarda el archivo animado en la carpeta Prcticas Neotoon y asgnale el nombre luna.car.

Neotoon > La barra de men de Neotoon


Men Archivo

Nuevo

Abre una ventana en blanco en la que podrs montar una nueva animacin. Permite cargar una animacin .CAR para su posterior edicin. Este comando despliega una lista de vietas recientemente abiertas. Para abrir una de ellas, haz clic sobre su ttulo. Permite almacenar la animacin en un disco. Permite almacenar la animacin asignndole un nombre diferente o en una carpeta diferente a la de su ubicacin original. Permite abandonar Neotoon.

Abrir Volver a abrir Guardar Guardar como Salir

Men Marco

Aadir

Permite aadir un nuevo fotograma a la pelcula. La imagen ser aadida al final de la animacin. Si deseas reubicar la imagen, pulsa sobre el fotograma y arrstralo a la nueva posicin. Esta opcin permite aadir un nuevo fotograma que se situar delante del fotograma seleccionado. Permite aadir un nuevo fotograma. Este fotograma ser igual al seleccionado y se situar detrs del mismo. Debido a que muchas animaciones se componen de fotogramas que se repiten, ahorrars mucho tiempo si usas este mandato en lugar de aadir. Elimina el fotograma seleccionado. Esta opcin permite exportar el fotograma seleccionado a un archivo de imagen. Puedes exportar a los formatos .bmp, .tif, .pcx, .jpg, .gif, .png. Esto es til para realizar pequeos ajustes en un fotograma con un programa externo.

Insertar

Duplicar

Borrar Exportar

Men Vieta

Redimensionar

Esta funcin permite agrandar o reducir el tamao de la vieta usado para la animacin. El alto y ancho se especifica en pxeles. Usa esta opcin para reproducir la animacin que estamos editando.

Ejecutar

Men Opciones

Color de pantalla

Usa este comando para cambiar el color de fondo que se usa en el espacio de trabajo de Neotoon y en la Pantalla de Vista previa. El color elegido se mostrar a travs de las porciones transparentes en los fotogramas de las vietas. Este color sirve solamente como fondo para realzar los fotogramas en Neotoon y no se guardar como parte del archivo de vieta.

Neotoon > Insertando animaciones en las publicaciones


Veamos, a travs de un ejemplo, el proceso que tenemos que seguir para insertar la animacin hipopotamo.car que hemos creado previamente y tenemos almacenada en la carpeta C:\Prcticas Neotoon.

Entra en Neobook y crea una nueva publicacin. Inserta un botn de comando. Aparecer el cuadro de dilogo Propiedades del botn de comando. En su seccin General teclea por ejemploHipoptamo. Pasa a la seccin Acciones y pulsa sobre el botn Seleccionar accin. En la categora Multimedia selecciona el mandato Reproducir archivo de Vieta (PlayCartoonFile).

Te aparecer el cuadro de dilogo Seleccione un archivo de Vieta:

Localiza la animacin que deseas insertar. Nosotros seleccionaremos el fichero hipopotamo.car que se encuentra en la carpeta Prcticas Neotoon. Haz clic sobre Abrir y aparecer el cuadro de dilogo Propiedades Reproducir archivo de Vieta (PlayCartoonFile).

En primer lugar debes indicar las coordenados inicial y final a travs de las cuales transcurrir la animacin. Estas coordenadas se pueden introducir manualmente o mediante la herramienta Vista previa de la ruta seguida por la pantalla.

Si haces uso de esta herramienta aparecer el cuadro de dilogo PlayCartoonFile Posicin.

Arrastra el marcador s hasta la posicin de inicio y el marcador e hasta la posicin final. Si no deseas que la animacin se desplace por la pgina haz que coincidan los puntos de inicio y fin. Haz clic sobre el botn Probar para ver una presentacin preliminar de la animacin

Usa el campo Repetir para indicar el nmero de veces que se repetir la animacin desde el punto de inicio hasta el final.

Usa el controlador Velocidad para determinar la velocidad de la animacin. Realiza las pruebas oportunas y cuando hayas configurado la animacin pulsa sobre el botn Aceptar. Regresa al cuadro de dilogo Propiedades Reproducir archivo de Vieta (PlayCartoonFile). Aqu ya slo queda decidir entre: o Iniciar reproduccin y continuar. Si seleccionas esta opcin puedes seguir trabajando mientras se reproduce la animacin. o Esperar que termine antes de continuar. No podrs seguir trabajando con la aplicacn hasta que no finalice la reproduccin de la animacin. o Ejecutar de forma continua al fondo. La animacin se repetir de forma continua mientras trabajas con la aplicacin. Pulsa sobre el botn Aceptar.

Neopaint > Presentacin


NeoPaint es un excelente programa de dibujo y de retoque fotogrfico que permite alcanzar resultados de un nivel bastante alto y a precio bajo. Adems, es muy sencillo de utilizar y es el complemento ideal para editar imgenes utilizadas en Neobook. Vamos a ver cmo funciona.

Neopaint > Descripcin


Iniciamos este apartado con la descripcin del programa.

Instalacin de NeoPaint En el men inicial del curso tienes un apartado de instalacin de los programas de evaluacin. En l tienes la direccin donde conseguir Neopaint. Nos hemos bajado esta versin y la tienes en este cdrom, en la carpeta Neopaint-shareware, o pinchando en:

Neopaint Lo guardas en una carpeta de tu ordenador y ejecutas el archivo setup.exe. Inicio del Programa Para arrancar NeoPaint debes ejecutar: Inicio > Programas > NeoPaint for Windows > NeoPaint Antes de entrar en el programa aparece una pantalla que nos informa que se trata de una versin de evaluacin. Pulsa sobre el botn Continue para abrir NeoPaint. La pantalla La pantalla de NeoPaint es un rea de trabajo rodeada de herramientas botones y paletas. Esta ventana es similar a la de cualquier aplicacin que funcione bajo Windows. Sus elementos son: La barra de ttulo: En la que leemos: "Neopaint for Windows - Unregistered Version".

La barra de men: La barra de botones: Contiene accesos directos a las funciones de NeoPaint que se utilizan con mayor frecuencia.

Para ver la funcin de un botn, coloca el puntero del ratn sobre l y aparecer una etiqueta con la misma.

La barra de herramientas: Contiene una seleccin de herramientas que te permiten realizar tus dibujos.

La herramienta activa aparecer presionada y con un fondo gris ms claro. Para seleccionar una nueva herramienta haz clic sobre ella. Algunas herramientas contienen una flecha en el extremo inferior derecho. Esto indica que contienen herramientas adicionales que se desplegarn al mantener pulsado el ratn sobre la flecha durante un segundo. La caja de colores: Su apariencia vara dependiendo de la herramienta seleccionada. Ejemplos: A la izquierda aparece el color que se obtiene mientras arrastras pulsando el botn izquierdo, y a la derecha el color que se aplicar al arrastrar con el botn derecho presionado. Aparece al usar las herramientas rectngulo, elipse, polgono y herramientas 3D. Indica los colores del borde y relleno que tendrn las figuras que dibujemos. Al seleccionar la herramienta texto aparecern casillas desplegables para indicar la fuente y el tamao, y, adems, botones para la alineacin y el estilo. El botn situado en la esquina inferior derecha te permite intercambiar los colores. Los botones de relleno: Estos botones permiten respectivamente: relleno slido, hueco, slido con la trama seleccionada y hueco con la trama seleccionada. Las paleta de tramas: Contiene modelos de tramas que pueden utilizarse para colorear o rellenar

objetos.

Las paleta de colores: Para seleccionar un color haremos clic sobre l. Haciendo clic derecho selecciono el color del borde o segundo color. Los colores seleccionados aparecern en la caja de colores. En la parte inferior aparecen unos deslizadores que representan respectivamente la cantidad de rojo, verde y azul que contiene el color seleccionado. Podemos usar el ratn y arrastrar estos deslizadores para ajustar el color. A la derecha de los deslizadores hay una pequea caja que va mostrando los cambios. A la derecha del deslizador azul hay dos diminutos botones "L" "R". Cuando est seleccionado L, los cambios afectan al color izquierdo, y al seleccionar R los cambios se transmiten al segundo color o color del borde.

rea de dibujo: El rea de dibujo ocupa la mayora de la pantalla de NeoPaint. sta es la zona destinada a realizar nuestros dibujos. Si tu pantalla no la contiene haz clic el botn New o abre un archivo.

Neopaint > Herramientas


Veamos ahora las herramientas del programa: Las herramientas de seleccin Estas herramientas se utilizan para seleccionar reas, as como para copiar la seleccin al Portapapeles de Windows. Seleccin de reas rectangulares. Seleccin de reas poligonales. Seleccin reas a mano alzada. Seleccin de reas elpticas.

Seleccin reas de colores.

Tras realizar una seleccin con alguna de las herramientas anteriores aparecer un contorno punteado alrededor de la misma. Si deseas anular la seleccin, haz clic fuera del rea seleccionada. Tambin puedes elegir entre Cutout Style Slido o Transparente segn te interese seleccionar el color de fondo o no. Una vez que has seleccionado una superficie puedes moverla a otra posicin. Para ello lleva el cursor al centro de la seleccin y arrastra hasta la nueva posicin. Si pulsas Control mientras arrastras obtienes una copia idntica del rea seleccionada. Si mantienes la tecla de maysculas pulsada, mientras arrastras, obtienes un sendero de pintura similar al usar un pincel. Puedes modificar el tamao de seleccin arrastrando los marcadores que aparecen en los vrtices de la zona seleccionada.

Las herramientas de la goma de borrar NeoPaint incluye dos tipos de gomas de borrar: la normal y la de color. Goma de borrar normal. Goma de borrar de colores. El tamao y la forma se controla desde las opciones de la herramienta:

La herramienta texto

Selecciona la herramienta y haz clic en el lugar en el que desees insertar el texto. Aparecer el cuadro de dilogo Text Editor que te permite escribir y asignar propiedades.

Cuando hayas configurado el texto, haz clic sobre OK. Si necesitas hacer cambios, haz clic sobre el botn Edit text y a continuacin sobre el texto.

La herramienta zoom En un programa de dibujo, el zoom juega un papel imprescindible en la edicin de la imagen. El zoom que incluye NeoPaint es muy potente ya que incorpora un factor de reduccin hasta el 10 % y un factor de ampliacin desde el 2X hasta el 51X, y permite por tanto retocar la imagen con el mayor detalle posible. Para ampliar una zona seleccionaremos la herramienta, desplazaremos el cursor cerca del rea que deseamos ampliar y arrastraremos hasta seleccionar esta zona. Podemos aumentar el nivel del zoom haciendo clic sobre la zona ampliada. Haciendo clic derecho se reduce.

La herramienta selector de colores Esta herramienta puede usarse para seleccionar un color directamente de la superficie de una imagen. Para seleccionar un color haremos clic sobre el color deseado en la imagen. Haciendo clic derecho seleccionamos el color de relleno.

Las herramientas especiales NeoPaint incluye una serie de herramientas que te permite dibujar con medios naturales y reales. El tamao y comportamiento de cada herramienta se controla desde la barra de opciones que aparecer al seleccionar la herramienta.

Rotulador Fluorescente. Lpiz de carbn. La cera. La tiza. La acuarela. El cepillo de aceite.

La pluma. El sacapuntas. Soften tool. Pintura al dedo. La esponja. La herramienta de mezclar.

La brocha.

La herramienta de clonar.

La brocha Esta herramienta se usa para dibujar a mano alzada. Puedes dibujar arrastrando sobre la zona de trabajo o haciendo clic en un punto especfico. Si arrastras mientras mantienes pulsado el botn derecho del ratn, dibujars con el color de relleno. Tambin puedes dibujar con un color liso o con una trama. Para trazar lneas rectas pulsa la tecla Alt y arrastra desde el punto inicial hasta el punto final de la misma.

Las herramientas de relleno Estas herramientas de NeoPaint se utilizan para rellenar superficies cerradas. Relleno normal. Relleno de azulejo. Relleno de gradiente.

Relleno reemplazando colores.

Cada herramienta cuenta con unas opciones que permiten configurarla.

El aerosol Esta herramienta se usa para dibujar imitando a los aerosoles o botes de spray. La velocidad a la que desplacemos el cursor determinar la densidad de la pintura. Adems, esta herramienta dispone de unas opciones que permiten configurar el tamao, proporcin de flujo, estilo y forma:

La herramienta sello Esta herramienta es similar a un sello de caucho. Consiste simplemente en pequeos grficos, de 64X64 pxeles, que se pueden utilizar como pinceles (arrastrando sobre el rea de trabajo), como sellos (haciendo un clic) o se pueden utilizar para rellenar reas de dibujo. Con las opciones de esta herramienta puedes girar el sello y mostrar un cuadro de dilogo que permite seleccionar otros sellos e incluso manipularlos.

La herramienta lnea Esta herramienta permite dibujar varios tipos de lneas y curvas.

La lnea recta. Se dibuja arrastrando desde el punto inicial hasta el final. La lnea radiante. Se traza una recta y posteriormente se gira a la velocidad deseada. La lnea curva. Se traza una recta, para obtener una curva se arrastran los marcadores.

La anchura de la lnea se controla desde la barra de opciones. Si pulsas la tecla de maysculas obtienes lneas verticales, horizontales o con una inclinacin de 45. Las herramientas del rectngulo Estas herramientas se utilizan para trazar rectngulos y cuadrados. Para trazarlos basta con seleccionar la herramienta y arrastrar desde un vrtice hasta el opuesto en diagonal. Rectngulo normal. Rectngulo de gradiente. La barra de opciones permite seleccionar el estilo del gradiente. Rectngulo editable. Una vez trazado se puede girar.

Rectngulo con cuadrcula. Contiene opciones para configurar el nmero de filas (rows) y columnas.

Rectngulo biselado.

El ancho de la lnea del borde se establece en la barra de opciones. El interior del rectngulo se configura en el selector de relleno. Si pulsas la tecla de maysculas en lugar de rectngulos obtienes cuadrados.

La herramienta rectngulo con vrtices redondeados Esta herramienta se usa para dibujar rectngulos y cuadrados con los bordes redondeados.

Las herramientas de la elipse

Estas herramientas se utilizan para trazar elipses y crculos. Elipse normal. Elipse de gradiente. La barra de opciones permite seleccionar el estilo del gradiente. Elipse editable. Una vez trazada aparecern unos marcadores que permiten modificarla.

El ancho de la lnea del borde se establece en la barra de opciones. El interior de la elipse se configura en el selector de relleno. Si pulsas la tecla de maysculas en lugar de elipses obtienes crculos. Las herramientas del polgono Estas herramientas se utilizan para trazar polgonos.

Polgono normal. Para trazarlo haremos un clic en cada vrtice. Con clic derecho se cierra el polgono. Polgono a mano alzada. Para dibujarlo iremos arrastrando mientras trazamos los lmites. Al soltar se cierra.

Polgono editable. Una vez marcados los vrtices aparecen unos marcadores que permiten modificarlo.

Polgono a mano alzada editable.

El ancho de la lnea del borde se establece en la barra de opciones. El interior del polgono se configura en el selector de relleno. Si pulsas la tecla de maysculas las lneas de los polgonos sern verticales, horizontales o con una inclinacin de 45.

Las herramientas 3D Estas herramientas se utilizan para trazar objetos tridimensionales. Cubo 3D. Para trazar un cubo arrastra en diagonal hasta que adopte el tamao deseado. Una vez trazado aparecer el Editor 3D que te permite girarlo e incluso arrastrarlo hasta una nueva posicin. Pirmide 3D. Para trazar una pirmide arrastra en diagonal hasta que la base tenga el tamao deseado. Una vez trazada aparecer el Editor 3D que te permite girar la pirmide y arrastrarla hasta otra posicin. Polgono 3D. Para trazarlo seleccionaremos la herramienta e iremos haciendo clic en los puntos en los que deseamos situar un vrtice, para finalizar haremos clic derecho y se unir el ltimo vrtice con el primero. A continuacin aparecern unos marcadores sobre los vrtices y podremos modificar y girar el polgono. Tras hacer clic aparecer el Editor 3D que nos va a permitir girar el polgono e incluso arrastrarlo hasta una nueva posicin. El ancho de la lnea del borde se establece en la barra de opciones. El interior de las figuras 3D se configura en el selector de relleno.

Neopaint > Imgenes


Vamos ahora a trabajar con las imgenes. El objetivo de este curso no es, en realidad, realizar un estudio en profundidad de un programa de diseo o retoque de imgenes, pero s nos vamos a detener en algunos aspectos que nos pueden resultar de gran utilidad. stos son:

Crear un archivo nuevo

Para crear un archivo nuevo hacemos clic sobre el botn o ejecutamos File/New..., en ambos casos aparecer el cuadro de dilogo New Picture que se compone de los siguientes apartados: Picture Type. Si haces clic sobre la flecha de esta casilla se desplegar un marco en el que aparecen los diferentes formatos con los que puede trabajar NeoPaint: imagen normal, gif animado, animacin de Neobook, sello para NeoPaint, icono de Windows, cursor de Windows o imgenes transparentes para insertarlas en pginas web. De este marco seleccionaremos el tipo que a nosotros nos interese:

Picture Size. Permite seleccionar el tamao de la imagen. Puedes optar entre tamaos prefijados (Preset Size) o introducir un tamao manual en las casillas de Custom Size. Si vas a crear un icono o un cursor slo podrs seleccionar un tamao estndar:

Number of Colors (Nmero de colores). Selecciona el nmero de colores con el que deseas trabajar, tambin puedes hacerlo en escala de grises (grayescale) o en blanco y negro (black & white):

Background Color. Aqu indicars el color del fondo que deseas aplicar a tus imgenes. Si ests creando un icono o un cursor podrs seleccionar un color transparente:

Cambiar el formato de una imagen. NeoPaint trabaja con la mayora de los formatos de imgenes que se utilizan en la actualidad. Esto nos permite abrir una imagen en un formato y guardarlo en otro diferente, con las ventajas que ello conlleva. Veamos el proceso de cambio de formato mediante un ejemplo:

Abre una imagen. Por ejemplo caceres.pcx que se encuentra en la carpeta Prcticas Neopaint. Haz clic sobre el botn o ejecuta File > Save as... Aparecer el cuadro de dilogo Save en el que puedes introducir el nombre del archivo, adems si despliegasGuardar como puedes seleccionar el formato que te interese. Por ejemplo, selecciona el formato jpg.

Haz clic sobre el botn Guardar.

Ahora tendrs en la carpeta Prcticas Neopaint el fichero caceres.pcx y caceres.jpg.

Siguiendo el proceso anterior crea el fichero caceres.gif Abre la carpeta (Prcticas Neopaint) y comprueba que contiene los tres ficheros. Comprueba tambin el nmero de bytes que ocupa cada uno.

Los GIF animados y sus propiedades Un gif animado es un fichero que se compone de varias imgenes que se muestran secuencialmente y que al reproducirse dan la sensacin de movimiento. Internet ha influido de manera decisiva en la gran popularidad de la que hoy gozan los gif animados. De hecho, es casi imposible visitar un sitio web en el que no haya alguna animacin. Veamos un ejemplo de gif animado:

Haz clic sobre el botn Open o ejecuta File > Open... Busca en la carpeta Prcticas NeoPaint, selecciona el fichero nuevo.gif y haz clic sobre Abrir.

Aparecer a la izquierda de la pantalla una columna con todas las imgenes de nuestra animacin y un rea de trabajo que muestra la imagen activa. Arrastrando la barra de desplazamiento vertical puedes ver las diferentes imgenes de la animacin. Para seleccionar otra imagen no tienes ms que hacer clic sobre ella, e inmediatamente aparecer resaltada y se mostrar en el rea de trabajo. Haciendo uso de las herramientas de Neopaint podemos modificar la imagen que se muestra en el rea de trabajo. Pulsando sobre el botn Play nuestra imagen aparecer animada en el rea de trabajo. .

Para detener la animacin pulsaremos sobre el botn Stop

NeoPaint permite modificar las caractersticas individuales de las imgenes de la animacin. Para ello seleccionaremos la imagen y haremos clic sobre el botn Show Frame Settings le podemos aplicar: . A esta imagen

Duracin. Nmero de milisegundos que esta imagen aparecer durante la animacin. Undraw Method. Mtodo mediante el que se mostrar la imagen. Normalmente se utiliza Background, que consiste en mostrar una imagen completa detrs de otra. Si vamos a superponer una imagen encima de la anterior no utilizaremos ningn mtodo (None). Left/Top. Si la imagen seleccionada es ms pequea que el tamao que posee la animacin global, podrs especificar la distancia desde el borde izquierdo y superior a la que se mostrar la imagen. Transparent. Activa esta casilla si deseas que la imagen posea un color a travs del cual se vea. A continuacin haz clic sobre la casilla Color y aparecer un cuadro de dilogo que muestra la imagen. Al pasar el puntero por la imagen ste se transforma en la herramienta Selector de color y te permite elegir el color transparente. y ganars espacio

Cuando hayas definido la animacin pulsa sobre el botn Hide Frame Setting para ver las imgenes.

En la parte inferior aparece un contador que indica la posicin del fotograma seleccionado y el nmero total de fotogramas que contiene la animacin. A la derecha del contador aparecen los botones que permiten llevar la imagen adelante o atrs.

Abre el fichero mickey.gif que est en la carpeta Prcticas Neopaint y estudia sus propiedades.

Crear un archivo GIF animado. Crear un gif animado con NeoPaint es muy fcil, veamos con un ejemplo el proceso a seguir para crear un perro animado partiendo de cuatro imgenes estticas y en cuatro posiciones:

Haz clic sobre el botn New. En el men despegable Pinture Type selecciona Animated Gif. Selecciona el tamao deseado. No te preocupes si no lo conoces porque despus podrs adaptarlo al tamao de tus imgenes. Selecciona el nmero de colores, que en el caso de ficheros gif no puede ser superior a 256. Haz clic sobre OK y aparecer a la izquierda de la pantalla una columna con las imgenes de nuestra animacin y un rea de trabajo que muestra la imagen activa. Los fotogramas se pueden crear dibujando en el rea de trabajo o abriendo imgenes que ya estn creadas previamente. Nosotros vamos a optar por la segunda opcin. Para aadir fotogramas haz clic sobre el botn Add Frame y aparecer un submen con tres opciones: insertar fotograma en blanco, hacer una copia del fotograma actual o insertar una imagen desde el disco. Nosotros vamos a elegir la tercera opcin, por lo tanto aparecer un cuadro de dilogo para que selecciones la imagen, que en nuestro caso es perro1.gif que se encuentra en la carpeta Prcticas NeoPaint. Haz clic de nuevo sobre Add Frame y ahora selecciona perro2.gif. Aade los fotogramas perro3.gif, perro4.gif, perro5.gif y perro6.gif. Si todo ha ido bien, tendrs una animacin con seis perritos y un primer fotograma en blanco. Para eliminar este fotograma nos situaremos en l y haremos clic sobre el botn Frame. Delete

Por ltimo haz clic sobre el botn Global Animation Options para que aparezca el cuadro de dilogoAnimation Settings. Marca la casilla Auto Size y el tamao de la animacin se adaptar al de las imgenes. Comprueba el resultado pulsando el botn Play.

Si lo deseas puedes modificar las propiedades de la animacin tal y como vimos en el apartado anterior. Una vez creado ya slo resta guardarlo.

Haz clic sobre el botn Guardar, selecciona la carpeta Prcticas NeoPaint y asgnale el nombre perro.gif.

Crear una animacin para Neobook. Neobook trabaja con un tipo de fichero animado (.CAR) diseado especficamente para l. Estas animaciones son similares a los ficheros GIFs. Crear un dibujo animado para Neobook es muy fcil. Veamos el proceso a seguir para crear un hipoptamo animado:

Haz clic sobre el botn New. En el men despegable Pinture Type selecciona Neobook Cartoon. Selecciona el tamao deseado. No te preocupes si no lo conoces porque despus podrs adaptarlo al tamao de tus imgenes. Selecciona el nmero de colores. Haz clic sobre OK y aparecer a la izquierda de la pantalla una columna con las imgenes de nuestra animacin y un rea de trabajo que muestra la imagen activa. Los fotogramas se pueden crear dibujando en el rea de trabajo o abriendo imgenes que ya estn creadas previamente. Nosotros vamos a optar por la segunda opcin.

Para aadir fotogramas haz clic sobre el botn Add Frame y aparecer un submen con tres opciones: insertar fotograma en blanco, hacer una copia del fotograma actual o insertar una imagen desde el disco. Nosotros vamos a elegir la tercera opcin, por lo tanto aparecer un cuadro de dilogo para que seleccionemos la imagen, que en nuestro caso ser hipopotamo1.gif que se encuentra en la carpeta C:\Prcticas Neopaint. Haz clic de nuevo sobre el botn Add Frame y ahora selecciona hipotamo2.gif. Aade los fotogramas hipopotamo3.gif e hipopotamo4.gif. Tendrs ahora una animacin con cuatro hipoptamos y un primer fotograma en blanco. Para eliminar un fotograma nos situamos en l y hacemos clic sobre el botn Frame. Delete

Haciendo clic sobre el botn GlobalAnimation Options aparece el cuadro de dilogo Animation Settings que nos permite introducir el tamao de la animacin. El botn Play nos permite previsualizar la animacin. La velocidad a la que se reproduce la animacin se establece en la barra deslizadora . Arrastrando hacia lo derecha aumenta y hacia la izquierda disminuye. Haz clic sobre Guardar para almacenar tu animacin. Introduce slo el nombre (hipopotamo) pues NeoPoint se encarga de asignarle la extensin CAR y selecciona la carpeta Prcticas Neopaint.

Partiendo de las imgenes: luna1.jpg, luna2.jpg, luna3.jpg,...luna9.jpg, crea una animacin y gurdala con el nombre luna.car

Transformar un archivo GIF en archivo CAR. Navegando por Internet podemos encontrar cantidad de animaciones que pueden ser interesantes para incluirlas en las aplicaciones que estemos elaborando con Neobook, para ello no tenemos ms que transformar la imagen de formato GIF a formato CAR. Veamos el proceso de cambio de formato mediante un ejemplo:

Abre una imagen. Por ejemplo, la que hemos creado anteriormente, perro.gif que debe encontrarse en la carpetaPrcticas Neopaint. Haz clic sobre el botn o ejecuta File > Save as... Aparecer el cuadro de dilogo Save en el que puedes introducir el nombre del archivo, adems debes desplegarGuardar como para seleccionar el formato CAR - Neobook Cartoon.

Haz clic sobre el botn Guardar.

Ahora tendrs en la carpeta Prcticas Neopaint los ficheros perro.gif y perro.car.

Transformar una imagen en un icono. Para convertir una imagen en un icono:

Abre una imagen. Por ejemplo, gato1.gif que se encuentra en la carpeta Prcticas Neopaint. Haz clic sobre el botn o ejecuta File/Save as... Aparecer el cuadro de dilogo Save en el que puedes introducir el nombre del archivo, adems debes desplegarGuardar como para seleccionar el formato ICO -Windows Icon.

Haz clic sobre el botn Guardar.

Ahora tendrs en la carpeta Prcticas Neopaint el fichero gato1.gif y gato.ico.

Neopaint > Insertando animaciones en las publicaciones.


Veamos ahora, a travs de un ejemplo, el proceso que tenemos que seguir para insertar una animacin: en este caso la animacin hipopotamo.car que hemos creado previamente y tenemos almacenada en la carpeta C:\Prcticas Neopaint. Entra en Neobook y crea una nueva publicacin. Inserta un botn de comando. Aparecer el cuadro de dilogo Propiedades del botn de comando. En su seccin General teclea por ejemploHipoptamo. Pasa a la seccin Acciones y pulsa sobre el botn Seleccionar accin. En la categora Multimedia selecciona el mandato Reproducir archivo de Vieta (PlayCartoonFile).

Te aparecer el cuadro de dilogo Seleccione un archivo de Vieta:

Localiza la animacin que deseas insertar. Nosotros seleccionaremos el fichero hipopotamo.car que se encuentra en la carpeta Prcticas Neotoon. Haz clic sobre Abrir y aparecer el cuadro de dilogo Propiedades Reproducir archivo de Vieta (PlayCartoonFile)

En primer lugar debes indicar las coordenados inicial y final a travs de las cuales transcurrir la animacin. Estas coordenadas se pueden introducir manualmente o mediante la herramienta Vista previa de la ruta seguida por la pantalla. Si haces uso de esta herramienta aparecer el cuadro de dilogo PlayCartoonFile Posicin.

Arrastra el marcador s hasta la posicin de inicio y el marcador e hasta la posicin final. Si no deseas que la animacin se desplace por la pgina haz que coincidan los puntos de inicio y fin. Haz clic sobre el botn Probar para ver una presentacin preliminar de la animacin

Usa el campo Repetir animacin desde el punto de inicio hasta el final.

para indicar el nmero de veces que se repetir la

Usa el controlador Velocidad velocidad de la animacin.

para determinar la

Realiza las pruebas oportunas y cuando hayas configurado la animacin pulsa sobre el botn Aceptar. Regresa al cuadro de dilogo Propiedades Reproducir archivo de Vieta (PlayCartoonFile). Aqu ya slo queda decidir entre:

Iniciar reproduccin y continuar. Si seleccionas esta opcin puedes seguir trabajando mientras se reproduce la animacin. Esperar que termine antes de continuar. No podrs seguir trabajando con la aplicacn hasta que no finalice la reproduccin de la animacin. Ejecutar de forma continua al fondo. La animacin se repetir de forma continua mientras trabajas con la aplicacin.

Pulsa sobre el botn Aceptar.

Guarda la publicacin anterior, en la carpeta Prcticas Neopaint, con el nombre hipopotamo.pub

You might also like