PIE APPlica: FrayFilma

Vamos a conocer cómo se realiza una App para Android, «Fray Filma», para aprender sobre el material utilizado paras las grabaciones de los cortometrajes y sobre las grandes películas de la historia del cine. También servirá para poner a prueba el conocimiento del usuario con un test.

Es la aplicación creada como trabajo final del Proyecto de Innovación Educativa APPlica, para el IES Fray Diego Tadeo González (Ciudad Rodrigo, Salamanca).

Está relacionada con uno de sus Grupos de Trabajo, «Fray Filma», de creación de videos, creado a partir del desarrollo del Proyecto de Innovación Educativa «Filma» (se aprende sobre Cine). También como parte del Proyecto de Innovación Educativa «Internacionaliza-Innova» (Todas las pantallas se muestran en los idiomas principales del teléfono).

  1. Los Proyectos de Innovación Educativa
  2. El PIE APPlica
  3. Android
  4. Android Studio
    1. Cómo instalar Android Studio
    2. Cómo crear el Primer proyecto
    3. Cómo utilizar el simulador
    4. Cómo conectar tu teléfono Android por USB
    5. Cómo añadir un icono para tu Aplicación
    6. Cómo cambiar el nombre de una Activity
    7. Cómo editar el texto «Hello World»
    8. Cómo una Activity con TextViews y Buttons
    9. Cómo visualizar el ciclo de vida de nuestra app
    10. Cómo saltar de una Activity a otra
    11. Cómo crear un test de múltiple respuesta
    12. Cómo pasar información de de una Actividad a otra
    13. Cómo crear un Activity con visualización de imágenes
    14. Cómo hacer que al pulsar botones se muestre un elemento
    15. Cómo incorporar strings en las matrices
    16. Cómo modificar la Status Bar
  5. Cómo distribuir nuestra app
  6. Cómo es la app final
  7. Hoja de ruta (RoadMap)
    1. Añadir más idiomas
    2. Añadir nuestros cortometrajes
    3. Añadir colores fondo layouts
    4. Añadir pantalla de inicio
    5. Añadir música
    6. Añadir preguntas en test
    7. Añadir número versión
    8. Preguntas del test aleatorias
    9. Modo oscuro
  8. APK de nuestra App

Los Proyectos de Innovación Educativa

En la ORDEN EDU/763/2017, de 31 de agosto, se regulan los Proyectos de Innovación Educativa relacionados con la integración de las TIC.

  • La Comunidad de Castilla y León considera de especial importancia las TIC para promover la mejora continua de la calidad del sistema educativo.
  • Se basa en la Ley Orgánica 8/2013, de 9 de diciembre (en cuanto a que las TIC son pieza fundamental para conseguir la mejora de la calidad educativa), el Decreto 51/2014, de 9 de octubre (en el que se regula la formación permanente del profesorado) y la Orden EDU/1057/2014, de 4 de diciembre (que regula la formación permanente del profesorado).
  • Desde el curso 2015-16 ha puesto en marcha diversos Proyectos de Innovación Educativa en relación a la integración de las TIC.

En la convocatoria de 2023-24 se han convocado unos Proyectos de Innovación Educativa (PIE) para Secundaria: «APPlica», «Filma», «Sintoniza» y CanSat».

  • Inscripción: del 15 al 29 de septiembre de 2023.
  • Listado provisional de participantes: 6 de octubre de 2023.
  • Listado de admitidos definitiva: 11 de octubre de 2023.

El PIE APPlica

El PIE APPlica pretende formar al profesorado en técnicas de programación de APPs para usar en dispositivos Android haciendo uso de Android Studio, posibilitando la creación de APPs de uso didáctico para ser integradas en el currículo.

  • Para la formación se realizan 5 sesiones (10 horas en total) de videoconferencia entre octubre y noviembre, y otra más en enero.
  • Si se ha certificado en el proyecto, se asiste a un encuentro (3h) para la puesta en común de los proyectos, en mayo.

Se pondrá en práctica mediante la creación de una aplicación por parte de los profesores que participan en el proyecto de utilidad dentro del aula o el centro para fomentar las competencias STEAM entre el alumnado mediante el uso didáctica del Mobile Learning.

Android

Android es un sistema operativo basado en el núcleo Linux, diseñado para dispositivos móviles con pantalla táctil. Lo desarrolló Android Inc., que Google respaldó y más tarde compró.

Android es el sistema operativo móvil más utilizado del mundo (unos 3000 millones de dispositivos lo usan).

Nuestro trabajo va a ir enfocado en hacer una aplicación (app) que utilice como interfaz una pantalla táctil, y donde vamos a ir añadiendo botones, barras, imágenes para interactuar en los diferentes menús o acciones que se quieran realizar.

Android Studio

Android Studio es el entorno oficial de desarrollo integrado (IDE) para desarrollar aplicaciones Android.

Cómo instalar Android Studio

  • Si trabajas en un Centro Educativo con Escuelas Conectadas, puedes ver si está disponible en el Centro de Software, e instalarlo:
  • Si el programa no se encuentra disponible en ese listado, se solicita que se instale de forma remota al Centro de Atención al Usuario (CAU), indicando el número de serie de los equipos (System>>About).
  • Tienes que tener en cuenta que te va a pedir ciertos permisos de acceso a redes o instalación de actualizaciones:
  • Puede que al instalarlo tengas algún error (como por ejemplo, en Intel HAXM):
  • Un paso importante de la instalación es la cantidad de memoria RAM que le quieres dar al emulador de Android (deja la que venga recomendada por defecto). Posteriormente lo podemos cambiar dentro de File>Settings>Appearance&Behavior>System Settings>Memory Settings.

Cómo crear el Primer proyecto

Para crear un nuevo proyecto haz clic en “Start a new Android Studio project” si estás en la ventana de inicio de Android Studio, o File>New>New Project si ya has creado otros:

  • La plantilla que vamos a seleccionar es, dentro del apartado «Phone and Tablet» la de «Empty Activity» o «Empty Views Activity«:
  • Para tu proyecto debes seleccionar:
    • un nombre, como AprendiendoConAndroid, o FrayFilma (1)
    • un lenguaje de programación, en nuestro caso java (2)
    • la API de destino de la aplicación (3), es decir, la versión de dispositivo mínima para la que funcionará (pulsa en Help me choose). En nuestro caso API 24 («Nougat»; Android 7.0).
  • Aquí tienes el entorno inicial, en el MenuPrincipal.java:

Cómo utilizar el simulador

Para añadir nuestro primer dispositivo simulado tenemos que ir a Tools>Device Manager>Create Device.

  • En nuestro caso hemos seleccionado el Pixel3a (API24, Android 7.0 «Nougat» |x86):
  • Aquí podemos ver la primera aplicación de «Hello World«, en emulador seleccionado, Pixel 3a API 24:
  • En el simulador puedes ver nuestra «app» con el icono que viene por defecto de Android (que cambiaremos posteriormente):

Cómo conectar tu teléfono Android por USB

Necesitamos activar en nuestro teléfono Android las Opciones para Desarrolladores. Esto te permite depurar el rendimiento de tu app más rápidamente que desde .

  • Una vez realizados los pasos puedes ver en la barra de herramientas tu teléfono cuando lo conectes (en la imagen el samsung SM-A145R), y podrías compilar y desplegar tu app en el dispositivo.

Cómo añadir un icono para tu Aplicación

Con Android Asset Studio vamos a crear un icono con distintas densidades. Los iconos se encuentran dentro de app>res>drawable.

  • Para crear uno nuevo, accede desde File>New>Image Asset:
  • Puedes cambiar el color de fondo (Background Layer):
  • Para comprobar cómo se vería en el dispositivo, pulsa en «Run app» (triángulo verde de la barra de herramientas):

Cómo cambiar el nombre de una Activity

Al crear nuestro primer proyecto la Activity se denomina «MainActivity».

  • Se recomienda que los layouts se deben poner con minúsculas y separando las palabras con guiones bajos, así como los nombres de las clases java se ponen con mayúsculas en el inicio de cada palabra y seguidas.
  • Para renombrarlo, pulsamos con el botón derecho sobre «MainActivity» y pulsamos en Refactor>Rename.
  • Para el archivo de layout procedemos de igual manera.

Cómo editar el texto «Hello World»

  • Dentro de la carpeta resouces, donde se encuentran los recursos (imágenes, estilos, colores,…) tenemos las cadenas de caracteres (strings).
  • Accede a tu archivo strings.xml para modificar el «Hello World» de tu app:
  • Aquí tenemos otros strings incorporados (no hay que poner espacios en los identificadores de las cadenas de textos):
  • Accedemos al layout del Menú principal, menu_principal.xml. Podemos añadir más textos para la pantalla, desde Palette>Common>TextView:
  • Android Studio viene preparado para el multilenguaje de nuestras aplicaciones.
  • Desde los Atributos del TextView, puedes declarar el identificador a utilizar (@string/welcome, por ejemplo):
  • El idioma por defecto es el que se utiliza si no se encuentra una traducción al idioma del teléfono del usuario, por lo que se recomienda que se configure por defecto en inglés, y luego se añadan el resto de los idiomas
  • Vemos que en res>strings se han creado automáticamente una para cada idioma:
  • Comprueba que funciona en el simulador:
  • Si cambias el idioma del teléfono se cambia automáticamente el idioma de los TextViews.
  • Para dar consistencia a nuestra app, vamos a utilizar una serie de atributos comunes a los TextViews:
    • textColor:
      • Títulos: Negro (#FF000000), Rojo (#F44336)
      • Botones: Blanco (#FFFFFFFF)
    • textAligment: center
    • fontFamily: monospace
    • textSize:
      • Títulos: 34sp, 20sp.
      • Botones: 24sp (principal), 20 sp (resto).
  • «sp» hace referencia a «scalable pixels», y trata de definir tamaños de texto independiente de la densidad de píxeles de la pantalla del dispositivo.

Cómo una Activity con TextViews y Buttons

En este apartado vamos a crear una Activity como la que ves a continuación: una pantalla en la que aparezca la puntuación obtenida, con varios TextViews y un Button:

  • Creamos una nueva activity pulsando con el botón derecho sobre app>New>Activity>Empty Activity:
  • Como va a ser de la puntuación, la nombramos como ScoreActivity:
  • Creamos un nuevo TextView:
  • Añadimos más TextViews, cambiando atributos comunes:
  • También vamos a cambiar el fondo de la pantalla principal (component tree: main), a #D09886:
  • Posiciona todos los elementos con las restricciones (Constraints) apropiadas y totalmente definidas:
  • Si queremos probar y ver cómo queda esta Activity en nuestro móvil o simulador, tenemos que editar el AndroidManifest.xml que se encuentra en app>manifests:
  • Aquí puedes ver que se arranca por defecto la activity .MenuPrincipal:
  • Aquí están los cambios para que sea .ScoreActivity:
  • Aquí podemos ver el resultado. Después de comprobar que todo se visualiza correctamente, deja el AndroidManifest.xml como estaba para que se cargue al iniciar MenuPrincipal.
  • Nos queda por hacer que el «botón» no sea un texto y tenga una funcionalidad. Ahora vamos a añadir código:
  • Todo lo que hemos hecho de forma gráfica también se puede realizar con código:
  • Aquí podemos ver el identificador de ese botón del menu_principal: tiene un identificador «button2» y un texto «JAQU3»:
  • Aquí puedes ver el .java del menú principal:
  • Definimos una función (cambioMensaje) para poder acceder a ella. También necesitamos la variable privada texto (textoCambiar). Utilizamos una función llamada setText para cambiar el texto por el que tenemos dentro de las comillas, y vinculamos la función con el TextView que pretendemos modificar:
  • Dentro del layout puedes cambiar las propiedades del atributo «OnClick» y seleccionar «changeMessage/cambioMensaje». Comprueba que se realiza correctamente:

Cómo visualizar el ciclo de vida de nuestra app

Una activity es cada una de las pantallas que forman una aplicación.

Cuando un usuario sale de nuestra app y vuelve a entrar, la activity pasa por diferentes estados de su ciclo de vida.

La clase Activity proporciona una serie de devoluciones de llamada que permiten a la actividad saber que cambió un estado, es decir, que el sistema está creando, deteniendo o reanudando una actividad, o finalizando el proceso en el que se encuentra.

  • Para ver qué eventos (onCreate(), onStart(), onRestart(), onResume(), onPause(), onStop(), onDestroy()) se invocan según que haga el usuario o el sistema, podemos añadir unos métodos a nuestra activity MenuPrincipal.
  • Podemos visualizarlos estados en la parte inferior (Logcat):
  • Si quieres probar Test onPause, crea un nuevo Activity (en nuestro ejemplo, TransparentActivity»):
  • Vamos a probar onDestroy. Para invocar este evento vamos a girar la pantalla, lo que hace que finaliza la activity y la vuelve a crear.
  • Para hacer que nuestra aplicación sólo funcione en un sentido e impedir la regeneración de la activity si el usuario gira la pantalla vamos a forzar que la app sólo funcione en modo vertical («Portrait»):

Cómo saltar de una Activity a otra

  • Para navegar entre varias pantallas, Creamos una nueva activity, FilmActivity, con un botón para ir a la actividad menu_principal.
  • Una vez que hayas creado los botones en los dos layouts, vamos a añadirle una id identificativa (button_film en el MenuPrincipal):
  • Ahora añadimos las líneas de código en el MenuPrincipal.java, tanto la de la variable de tipo Button con el mismo nombre de la id del botón (línea 16 en la imagen), como la creación de un listener dentro del método onClick para definir el salto:
  • Creamos el botón para volver atrás en la FilmActivity:
    • String: Back
    • id: button_film_back
  • Le añadimos al .java:
  • Para que vuelva al activity desde el que ha sido creado, invocamos al método finish() que termina la activity en la que nos encontramos y nos devuelve a la que la lanzó (menú principal).

Cómo crear un test de múltiple respuesta

  • Disponemos de la actividad «FilmActivity» que creamos en el apartado anterior pero que por ahora solo tiene un botón de BACK.
  • Modificamos el layout con más Button y TextView como vemos a continuación:
  • Ahora vamos a crear la base de datos para las preguntas y respuestas y respuesta correcta.
  • Vamos a crear una «clase» que sea base de datos dentro de nuestro MenuPrincipal.java:
  • La llamamos «FilmDataBase»:
  • Las preguntas (questions) se almacenan en un array de 1 dimensión:
  • Creamos otro array con las posibles respuestas, en este caso de 2 dimensiones:
  • Para saber cuál de las respuestas es la correcta, creamos otro array de 1 dimensión:
  • Ahora desde nuestro FilmActivity vamos a acceder a nuestra clase de base de datos para extraer la información necesaria. Definimos las variables privadas que vamos a utilizar posteriormente.
  • Generamos el código para asignar las variables a los objetos que tenemos en los layouts, dentro del método onCreate:
  • Modificamos el botón «button_film_back»:
  • También lo hacemos con el botón que está en MenuPrincipal.java, «button_film»:
  • Con la llamada a startTest() (startAcvitivity anteriormente) logramos que la actividad comience con la primera pregunta cargada. Esta es la función:
  • El comportamiento cada botón es tal que, al presionarlo el usuario, compara lo escrito con lo correcto, y si es igual se suma un punto a la puntuación y se cambia la pregunta. Si es incorrecto no se suma punto y se cambia de pregunta:
  • Por último, vamos a definir qué hace la función updateInformation (): Cada vez que se ejecuta debemos actualizar el número de pregunta (pasar a la siguiente), actualizar el texto de la pregunta, el texto de cada uno de los botones de respuesta y por último, cargar la respuesta correcta en la variable correctAnswer. Todo lo anterior lo hacemos siempre y cuando no hallamos llegado al final de las preguntas, en cuyo caso lo que haríamos sería finalizar la actividad test y volveríamos al menú principal:
  • Creamos una función para cada uno de los botones de respuesta.
  • Vamos a añadir una pausa 2 segundos antes de cerrar el test, antes de finalizar:
  • Si quieres entender el ciclo de vida de la aplicación hasta ahora, cambiamos el nombre de la etiqueta (a «TAG»):
  • En el método onCreate añadimos el mensaje de log:

Cómo pasar información de de una Actividad a otra

  • Aquí puedes ver un ejemplo básico de paso de información entre Activities (en la imagen puedes ver las 4). En nuestro caso con las preguntas sobre cine y puntuación.
  • Vamos a crear la Activity que nos queda: En la que pregunta el nombre del jugador. Como otras veces, app>New>Activity>Empty Views Activity:
  • Este es el aspecto final que va a tener:
  • Para el input voy a añadir un Plain Text:
  • Para el nombre de jugador, un TextView (id: namePlayerEditTxt), utilizando los atributos «hint», «InputType» (textPersonName, textCapWords»)
  • Utiliza las guías (Guidelines):
  • Aquí puedes ver que hemos creado una guía al 50%:
  • Termina de añadir los botones con sus id y string:
  • Ahora incorporamos la parte .java:
  • Ahora hacemos que desde el menú principal pueda ir a esta pantalla.
  • Esto había antes en el botón de film y probamos que funcione:
  • Ahora vamos a incluir el nombre jugador en la siguiente pantalla. Antes teníamos un delay de 2 segundos para volver al menú principal:
  • Así quedaría:
  • Nos falta definir la variable (a nivel de clase) «namePlayer» que almacenará el valor:
  • Ahora la variable ya no aparece en rojo:
  • Nos falta qué valor tiene esa variable, que lo hacemos desde onCreate:
  • Ya sólo nos queda trabajar con la Activity final de puntuación. Esta es la que teníamos:
  • Asignamos id «textName»:
  • Cambiamos id del nombre, puntos y botón:
  • Vamos ya a la parte de código ScoreActivity.java. Como siempre, dentro de la clase añado las variables:
  • Leemos las variables que nos hemos pasado de los otros activities:
  • Para terminar, tenemos que crear el listener del botón de menú principal:
  • Probamos y vemos que funciona:
  • Nos queda por último modificar el button_film del menú principal:
  • Ahora generamos la variable «alive», en el FilmActivity.java (se ha generado automáticamente antes). Es de tipo boolean (Verdadero / Falso)
  • Vamos a asegurarnos de que cuando de verdad hemos terminado el test pasamos la variable «alive» a falso.
  • Ahora si volvemos atrás mantiene puntuación, preguntas y respuestas:

Cómo crear un Activity con visualización de imágenes

Las imágenes van en la ruta app>src>main>res>drawable:

  • Es importante reducir las imágenes a WebP. ¡¡OJO que tienen que ser todas en minúsculas!!
  • Al pulsar en «Convert to WebP» se abre un asistente:
  • Nos permite definir la ratio de calidad que queremos dejar y el tamaño original y final:
  • Una vez que tenemos las imágenes, ya podemos empezar con el layut. Vamos a hacer los botones intentando que sean como los que ya teníamos:
  • Añadimos un elemento nuevo: ImageView, que permite mostrar imágenes en nuestra aplicación. Está dentro de Palette>Widgets>ImageView.
  • Al arrastrarlo y soltarlo nos pide que seleccionemos una imagen. Elegimos una de las imágenes que hemos convertido a WebP. Realmente no es importante pues después vamos a definir las imágenes que se mostrarán por código, no es una imagen estática:
  • Añadimos los botones y los textos con las restricciones:
  • Ahora añadimos a la base de datos el array con el dato curioso de cada una de las películas (triviaFilm):
  • Como también vamos a colocar fotos, creamos un array (photos) con los nombres de los archivos de cada foto:
  • Para acceder a esta base de datos tenemos que hacer públicas las funciones para cada uno de los datos a los que pretendemos acceder:
  • Con la base de datos editada ya podemos comenzar a programar la actividad lista de películas. También necesitamos programar un botón «next» para que se muestre la siguiente película de la lista, y el botón «previous» que vaya al puesto anterior de la lista.
  • Necesitamos declarar que vamos a usar la base de datos (filmDataBase), las variables asignadas a los TextView (question, answer, triviaFilm), a los ImageView (image), a los Button (previous, next, menu), y al número entero total de preguntas (numberQuestion, totalQuestion):
  • Ahora asignamos las variables a los objetos concretos del layout dentro del método onCreate():
  • Seguidamente, en este mismo método inicializamos los siguientes valores. La función updateInformation() modifica la información que se muestra en los TextView y en el ImageView.
  • Para cambiar la imagen utilizamos setImageResource con los datos almacenados y la carpeta drawable donde están las fotos.
  • Ahora vamos a definir el comportamiento de cada uno de los botones (establecemos los listeners), dentro del método onCreate():
  • Para poder acceder a la actividad “lista de películas” necesitamos que la actividad menú principal tenga un botón “Film Learning”. Aquí puedes ver el layout:
  • Simplemente tenemos que añadir el botón y el código para gestionarlo:

Cómo hacer que al pulsar botones se muestre un elemento

  • Vamos a añadir una nueva funcionalidad a nuestra aplicación. Esto es lo que vamos a crear: Una Activity con distintas imágenes de nuestro material de grabación, y una serie de botones con los nombres de todos los elementos. También aparece el botón «Home» para volver a la pantalla principal:
  • empezamos creando una Empty Views Activity, con el nombre «LearnEquipment»:
  • Tenemos una imagen con todo el material de cine, que colocaremos con un ImageView. No te olvides de convertirla a WEBP:
  • Utiliza una guía vertical para colocar la imagen y los distintos elementos:
  • Recuerda que para los nombres utilizamos un «string», en los idiomas Inglés (por defecto), español y francés:
  • Aquí puedes ver todos los elementos:
  • Ahora creamos posicionamos los asteriscos (Tagregados como TextViews):
  • En el LearnEquipment.java describimos el comportamiento de la actividad. Cada vez que se pulse cualquiera de los botones de los materiales de cine, se señalará con el asterisco el lugar donde se encuentra. Por lo que vamos a hacer que se hagan visibles e invisibles los asteriscos dependiendo del botón que se pulse. Para ello primero definimos las variables necesarias para los botones:
  • Una vez definidas, asignamos las variables declaradas a los ID de cada uno de los botones:
  • También asignamos las variables a los ID de los TextView:
  • Para poder hacer visible o invisible cualquiera de los objetos usamos la función setVisibilility donde le pondremos como argumento si lo queremos invisible o visible:
  • Ahora debemos definir el comportamiento que tendrá cada uno de los botones del material de cine. Comenzamos definiendo el código para el botón de “djipocket2Btn”. Cuando se pulse el botón lo único que tenemos que hacer es poner invisibles todos los textos (asteriscos) menos el que señala a la cámara DJI Pocket 2:
  • Por último, añadimos el código para el comportamiento del botón button_equipment:
  • Para el resto de los botones sería similar.
  • Para acceder a la activity creamos un nuevo botón en el Menú Principal,
  • Después de definir la variable añadimos en el método onCreate el comportamiento al hacer un click:

Cómo incorporar strings en las matrices

Para los elementos de la matriz triviaFilm, puedes utilizar identificadores únicos en forma de strings en tu archivo strings.xml.

<string name=»trivia_casablanca»>It is the masterpiece of unrepeatable films. An unforgettable tale of love, sacrifice, and moral ambiguity set against the backdrop of war-torn Casablanca.</string>

Luego, en el archivo Java, se referencian estos strings utilizando los identificadores definidos en strings.xml

Cómo modificar la Status Bar

  • Para la Status bar, necesitamos crear un fichero XML de tipo Values.xml con el nombre «Styles»:
  • Podemos modificar el color de la status bar. En nuestro caso, con un color «dark_red» y otro «light_red»:
  • Aquí podemos ver cómo queda en la aplicación después de simularla:

Cómo distribuir nuestra app

  • Lo primero que debemos hacer es definir la versión de nuestra aplicación. Se pueden definir los valores incluyéndolos en el archivo build.gradle dentro de app>Gradle Scripts>build.gradle.kts, dentro del bloque android {} en el bloque defaultConfig {} anidado de tu módulo. El «versionCode» debe ser un valor entero positivo. No es la versión que se muestra en los usuarios. El «versionName» es una cadena que se muestra como el número de versión para los usuarios:
  • Vamos a distribuirla sin PlayStore. Como primera opción, creamos una APK de pruebas (un archivo con extensión .apk (android Application PacKage) es un paquete para el sistema operativo Android que se utiliza para distribuir e instalar componentes empaquetados. Contiene el código del programa, recursos, activos, certificados y archivo de manifest. Es básicamente un archivo comprimido ZIP con diferente extensión.
  • Se genera un archivo .apk que podemos posteriormente transferirlo por USB al almacenamiento del teléfono y proceder a la instalación:
  • En vez de una apk de pruebas podemos generar una apk para nuestra app final. Lo realizamos mediante Build>Generate Signed APK:
  • Si nunca hemos creado una firma en el Store tenemos que hacerlo ahora, y nos servirá para todas nuestras aplicaciones:
  • Al pulsar en el botón de Next, seleccionamos la opción «release» y tendremos el archivo app-release.apk:
  • Para instalar nuestra apk firmada seguiremos los siguientes pasos:
    • Conectamos por USB el teléfono móvil al que queremos transferir la app.
    • Habilitamos el modo de transferencia de archivos por USB.
    • Desde el ordenador donde tenemos la apk abrimos la aplicación Android File Transfer o cualquier otra que nos permita transferir archivos al dispositivo (instalarla en caso de no disponer de ella).
    • Transferimos la apk a una ruta dentro del teléfono.
    • En el teléfono vamos a esa ruta (por ejemplo, con la app Files de Google) y pulsamos sobre el archivo .apk para que se inicie la instalación.

Cómo es la app final

Se trata de una aplicación para el IES Fray Diego Tadeo González (Ciudad Rodrigo, Salamanca) relacionada con uno de sus Grupos de Trabajo, «Fray Filma», de creación de videos, creado a partir del desarrollo del Proyecto de Innovación Educativa «Filma» (se aprende sobre Cine). También como parte del Proyecto de Innovación Educativa «Internacionaliza-Innova» (Todas las pantallas se muestran en los idiomas principales del teléfono).

Con la aplicación «Fray Filma» se va a aprender sobre el material utilizado paras las grabaciones de los cortometrajes y sobre las grandes películas de la historia del cine. También servirá para poner a prueba el conocimiento del usuario con un test.

  • Pantalla principal, con botones a las 3 actividades: Aprendizaje de Equipo (para el material de filmación), Aprendizaje de cine (con sinopsis y nombre de director de mejores películas de la historia del cine) y Cuestionario de cine (con preguntas sobre película y director):
  • Pantalla de Aprendizaje de Equipo, en la que inicialmente aparecen todos los asteriscos sobre el material de cine. Al pulsar en cualquier elemento desaparecen todos los asteriscos excepto el correspondiente al material elegido:
  • Para la actividad de Cuestionario de cine primero aparece una pantalla en la que pide el nombre al jugador, y después aparece otra en la que tienes que acertar el director de una película de entre tres posibles. Cada pregunta que aciertes incrementa en 1 el marcador «Score:
  • Para la actividad de Aprendizaje de Cine tenemos una pantalla donde aparece el nombre de la película (questionFilm), el nombre del director (answerFilm) y una sinopsis de la misma (triviaFilm), junto a una imagen del cartel:
  • Algunas videos de la aplicación en funcionamiento:

Hoja de ruta (RoadMap)

Añadir más idiomas

  • En la base de datos de películas (FilmDataBase.java) mejorar el array triviaFilm para que tenga strings en cada componente (aquí lo tienes más explicado, ¡ha sido muy laborioso desarrollarlo!)
    • Status: Completado
    • Versión App: (App versionCode=3, versionName = «5.0»)

Añadir nuestros cortometrajes

Añadir los cortometrajes realizados en el IES Fray Diego Tadeo (El Pregón y JAQU3).

  • Status: Completado
  • Versión App: (App versionCode=3, versionName = «5.0»)

Añadir colores fondo layouts

Tener en cuenta fondo de layouts para móviles con tema «Dark».

  • Status: Completado
  • Versión App: (App versionCode=3, versionName = «3.0»)

Añadir pantalla de inicio

Añadir una pantalla de inicio estática

Añadir música

Añadir un audio al inicio de la app.

Añadir preguntas en test

En el test de conocimientos no está claro qué se pregunta. Añadir todas las preguntas en todos los idiomas.

  • Status: Completado ! (versión 9.0)

Añadir número versión

Añadir en el res>layout activity_splash_screen.xml un número que indique la versión de nuestra app para que sea más fácil identificar a la hora de depurar en los dispositivos que instalen la APK.

  • Status: En fase de estudio preliminar.

Preguntas del test aleatorias

Escoger cada vez un número determinado de preguntas de entre las disponibles en la base de datos FilmDataBase, y mostrarlas de modo aleatorio al usuario.

  • Status: En fase de estudio preliminar.

Modo oscuro

Ahora la app está diseñada únicamente para el modo claro, en modo oscuro no quedan bien los colores al instalarla en los dispositivos.

  • Status: En fase de estudio preliminar.

APK de nuestra App

Aquí tienes las distintas APK (paquete de aplicación de Android) de nuestra App, por si lo quieres instalar en tu dispositivo Android:

LinkversionCodeversionNameMejoras
frayFilmav222.0Más idiomas
frayFilmav333.0Background Layouts
frayFilmav555.0FilmDataBase: Array con strings, JAQU3 y Pregón
frayFilmav7.177.0Pantalla de inicio estática, Tamaño texto trivia 16sp
frayFilmav888.0Música en pantalla de inicio
frayFilmav999.0Mejores preguntas en test
frayFilmav101010.0Disposición elementos activity, erratas

[Entrada en construcción]

ÚLTIMA VERSIÓN APP: 10.0

Deja un comentario

Comments (

0

)

Diseña un sitio como este con WordPress.com
Comenzar