|     Inicio    |   |         |  |   FOROS      |  |      |      
   Elastix - VoIP B4A (Basic4Android) App inventor 2 PHP - MySQL
  Estación meteorológica B4J (Basic4Java) ADB Shell - Android Arduino
  Raspberry Pi Visual Basic Script (VBS) FireBase (BD autoactualizable) NodeMCU como Arduino
  AutoIt (Programación) Visual Basic Cosas de Windows Webs interesantes
Translate:
Búsqueda en este sitio:


.

App inventor 2 en español
Cómo programar los teléfonos móviles con Android
mediante App inventor 2 - Juan Antonio Villalpando

-- Tutorial de iniciación de App Inventor 2 en español --

Volver al índice del tutorial

____________________________

193B.- Poner un GIF animado y hacer Click sobre él. Fondo transparente.

- En la página 293B_extension_gif_animado_click.htm, veremos otra forma de poner gif animados, pero la que veremos en esta página es mejor y la recomendable.

- Vamos a utilizar una extensión para poder poner GIF animados y hacer Click sobre ellos.

- Además cuando hacemos click sobre una imagen se dispara un evento.

- Para insertar una imagen GIF debemos poner componente Imagen y un Reloj.

- La extensión descompondrá el archivo gif en sus frames y los irá mostrando en un componente Imagen al Intervalo del Reloj.

___________________________
___________________________
______________________________________________________
1.- Ejemplo 1. Descompila un cuadro y lo muestra.

p193A_gif_animado.aia

com.KIO4_AniGif.aix

- Características:

- Necesita un componente Imagen y un Reloj.

- Cargamos el archivo gif mediante LoadGif.

- Los archivos deben estar en el directorio base (Subir archivo...)

- Los archivos se identifican por su nombre.

- Los archivos también pueden estar en la SdCard, en este caso pondríamos su dirección absoluta: /mnt/sdcard/directorio/miarchivo.gif

- Para la máscara de color transparente ebemos probar varios colores, blanco, negro, amarillo,... con alguno obtendremos fondo transparente.

- Mediante el Reloj y NextFrame, vamos visualizando cada cuadro en su Imagen.

- GetFrameCount, nos indica el número de cuadros que tiene ese gif animado.

- GetCurrentFrameIndex, muestra el número del cuadro actual.

- GetNextDelay, muestra el tiempo del próximo cuadro, en el archivo gif.

- CopyFrames, copia los cuadros que componen el gif animado en el directorio indicado. Si el directorio no existe, se crea automáticamente.

- Los cuadros se van descompilando y mostrando según se descompila, es decir no se descompilan todos y se muestran (aunque también se puede hacer así).

____________________
- Diseño.

____________________
- Bloques.

___________________________
___________________________
______________________________________________________
2.- Ejemplo 2. Descompilando todos los cuadros y luegos mostrandolos secuencialmente.

p193A2_gif_animado.aia

- En el ejemplo anterior, los cuadros se van descompilando y mostrando según se descompilan.

- Ahora vamos a realizar la visualización de otra manera, descompilaremos todos los cuadros mediante el bloque CopyFrames en un directorio, y los iremos mostrando uno a uno mediante el Reloj en el componente Imagen.

____________________
- Diseño.

____________________
- Bloques.

- En este caso he puesto 7 como número de cuadros que se van a visualizar.

- Se podría haber conseguido este número mediante el bloque GetFrameCount, pero también habría sido necesario cargarlo antes con LoadGif, así que es mejor poner ese número manualmente y nos ahorramos dos bloques.

- Observa que ahora el archivo de Imagen.Foto comienza por file:///mnt/sdcard/.......

___________________________
___________________________
______________________________________________________
3.- Ejemplo 3. Sin fondo transparente.

p193A3_gif_animado.aia

- Sin fondo transparente.

- A veces tomamos un gif y no podemos conseguir que tenga fondo totalmente transparente debido a que no tiene colores planos en una determinada área.

- En este caso debemos poner un fondo de color como indico en estas imágenes:

___________________________
- Diseño.

____________________
- Bloques.

------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------------------------

- Bloques en inglés.

 

 

 

___________________________

 

- Mi correo:
juana1991@yahoo.com
- KIO4.COM - Política de cookies. Textos e imágenes propiedad del autor:
© Juan A. Villalpando
No se permite la copia de información ni imágenes.
Usamos cookies propias y de terceros que entre otras cosas recogen datos sobre sus hábitos de navegación y realizan análisis de uso de nuestro sitio.
Si continúa navegando consideramos que acepta su uso. Acepto    Más información