IFCT083PO · App Inventor · Bloque 6

Mundial 2026

Vamos a crear una aplicación informativa de fútbol usando ListView, Labels, imagen, sonido y condicionales simples.

ListView Label Image Button Sound if / else if

1. ¿Qué vamos a crear?

Vamos a crear una app llamada Mundial 2026.

El usuario tocará una selección de fútbol en un ListView y la aplicación mostrará información básica sobre ese equipo.

            La app permitirá:
            Mostrar una lista de selecciones del Mundial.
Seleccionar una selección con ListView.
Mostrar información del equipo.
Mostrar un jugador destacado.
Limpiar la pantalla con un botón.
Reproducir un sonido al seleccionar una opción.

          

Selecciones que vamos a usar

Selección	Información esperada
España	Campeona del Mundial 2010
Argentina	Actual campeona del mundo
Brasil	Selección con más títulos mundiales
Francia	Una de las favoritas del torneo
Portugal	Selección con grandes jugadores ofensivos
Alemania	Cuatro veces campeona del mundo

Esta práctica sirve como simulacro sencillo para el examen final del Bloque 6.

2. Diseño de la aplicación

MUNDIAL 2026

⚽

Selecciona una selección:

España
Argentina
Brasil
Francia
Portugal
Alemania

Información:

España fue campeona del Mundial 2010.

Jugador destacado: Pedri.

LIMPIAR

Diseño recomendado

Título grande: Mundial 2026.
Imagen de fútbol, balón, estadio o copa.
ListView con las selecciones.
Label para mostrar la información.
Label para mostrar el jugador destacado.
Botón para limpiar el resultado.

El diseño no tiene que ser idéntico. Lo importante es que aparezcan los componentes y que la aplicación funcione.

3. Componentes necesarios

Componente	Nombre recomendado	Función
Label	LabelTitulo	Muestra el título de la aplicación.
Image	ImageFutbol	Muestra una imagen relacionada con el Mundial.
Label	LabelInstruccion	Indica al usuario que seleccione una selección.
ListView	ListViewSelecciones	Muestra las selecciones disponibles.
Label	LabelInfo	Muestra la información de la selección.
Label	LabelJugador	Muestra el jugador destacado.
Button	ButtonLimpiar	Borra la información mostrada.
Sound	Sound1	Reproduce un sonido al seleccionar una opción.

El componente nuevo o más importante de esta práctica es ListView.

4. Configura el ListView

Propiedad ElementsFromString

Selecciona el componente ListViewSelecciones y configura sus elementos con este texto:

España,Argentina,Brasil,Francia,Portugal,Alemania

También puedes escribirlos en líneas separadas si tu versión de App Inventor lo permite.

Importante

Los textos deben coincidir exactamente con los que usarás en los bloques.

No escribas Espana en la lista y luego compares con España.
No añadas espacios innecesarios al final.
Respeta mayúsculas y acentos para evitar errores.

5. Funcionamiento esperado

Selección	Información	Jugador destacado
España	España fue campeona del Mundial 2010.	Pedri.
Argentina	Argentina es la actual campeona del mundo.	Lionel Messi.
Brasil	Brasil es la selección con más títulos mundiales.	Vinícius Jr.
Francia	Francia es una de las favoritas del torneo.	Kylian Mbappé.
Portugal	Portugal cuenta con grandes jugadores ofensivos.	Cristiano Ronaldo.
Alemania	Alemania ha ganado cuatro Mundiales.	Jamal Musiala.

El alumno no tiene que memorizar estos textos. Puede copiarlos en los bloques o escribir una versión parecida.

6. Bloques principales

Usaremos el evento ListViewSelecciones.AfterPicking y una cadena de condicionales.

when ListViewSelecciones.AfterPicking

    if ListViewSelecciones.Selection = "España"
        set LabelInfo.Text to "España fue campeona del Mundial 2010."
        set LabelJugador.Text to "Jugador destacado: Pedri."
        call Sound1.Play

    else if ListViewSelecciones.Selection = "Argentina"
        set LabelInfo.Text to "Argentina es la actual campeona del mundo."
        set LabelJugador.Text to "Jugador destacado: Lionel Messi."
        call Sound1.Play

    else if ListViewSelecciones.Selection = "Brasil"
        set LabelInfo.Text to "Brasil es la selección con más títulos mundiales."
        set LabelJugador.Text to "Jugador destacado: Vinícius Jr."
        call Sound1.Play

7. Bloques continuación

    else if ListViewSelecciones.Selection = "Francia"
        set LabelInfo.Text to "Francia es una de las favoritas del torneo."
        set LabelJugador.Text to "Jugador destacado: Kylian Mbappé."
        call Sound1.Play

    else if ListViewSelecciones.Selection = "Portugal"
        set LabelInfo.Text to "Portugal cuenta con grandes jugadores ofensivos."
        set LabelJugador.Text to "Jugador destacado: Cristiano Ronaldo."
        call Sound1.Play

    else if ListViewSelecciones.Selection = "Alemania"
        set LabelInfo.Text to "Alemania ha ganado cuatro Mundiales."
        set LabelJugador.Text to "Jugador destacado: Jamal Musiala."
        call Sound1.Play

No hay cálculos, no hay porcentajes y no hay if dentro de otro if. Solo selección, condición y texto.

8. Botón Limpiar

Bloques del botón

when ButtonLimpiar.Click
    set LabelInfo.Text to ""
    set LabelJugador.Text to ""

¿Para qué sirve?

Deja la pantalla preparada para otra selección.
Permite comprobar que el botón funciona.
Hace que la aplicación parezca más completa.

El botón limpiar es sencillo, pero suma calidad a la práctica.

9. Prueba la aplicación

☐ El ListView muestra las seis selecciones.

☐ Al pulsar España aparece la información correcta.

☐ Al pulsar Argentina aparece la información correcta.

☐ Al pulsar Brasil aparece la información correcta.

☐ Al pulsar Francia aparece la información correcta.

☐ Al pulsar Portugal aparece la información correcta.

☐ Al pulsar Alemania aparece la información correcta.

☐ El botón Limpiar borra los resultados.

☐ El sonido se reproduce si se ha añadido.

☐ El diseño se entiende correctamente.

No des por terminada la aplicación hasta probar todas las opciones del ListView.

10. Documento Word para Classroom

Cuando termines la app, debes rellenar un documento de Word y subirlo a Google Classroom.

            El documento debe incluir:
            Nombre y apellidos.
Nombre de la aplicación.
Componentes utilizados.
Explicación breve de lo que hace la app.
Bloques principales escritos.
Pruebas realizadas.
Dificultades encontradas.

          

Preguntas que debes responder

¿Qué componente muestra la lista de selecciones?
¿Qué evento se utiliza al seleccionar una opción?
¿Qué Labels cambian según la selección?
¿Para qué sirve el botón Limpiar?
¿Qué selección te ha parecido más interesante?

Añade una captura del diseño de la app si puedes.

11. Reto opcional para alumnos rápidos

Reto 1

Añade dos nuevas selecciones al ListView:

Inglaterra
Países Bajos

Después añade dos nuevos else if para mostrar su información.

Reto 2

Añade un componente Image que cambie según la selección.

Ejemplo:

set ImageFutbol.Picture to "espana.png"

El reto es opcional. Primero debe funcionar la aplicación básica.

Fin de la actividad

Simulacro completado

Esta práctica te prepara para el examen final: ListView, condicionales simples, Labels, botón y prueba de funcionamiento.

Diseño terminado ListView configurado Bloques creados App probada Entrega en Classroom

Índice de páginas