COMO SOLUCIONAR EL PROBLEMA DE LÍMITE DE PANTALLAS EN APP INVENTOR 2

Hola y bienvenidos una vez más a inventordeaplicaciones.es.

En el artículo de hoy vamos a ver cómo solucionar el problema de límite de pantallas en App Inventor 2.

Hace ya algunas semanas un usuario de nuestra página web nos hizo una consulta sobre las pantallas en App Inventor 2, él estaba desarrollando una aplicación en la que necesitaba crear un número bastante importante de pantallas, y me comentaba que App Inventor 2 no le permitía seguir su desarrollo ya que estaba limitado en el número de pantallas, eso le hacía sentir bastante frustrado  porque llevaba tiempo desarrollando la aplicación y veía que no podía culminar su proyecto. vamos a ver cómo podemos ayudar a nuestro amigo dandole una solución práctica y muy simple, solo creando dos pantallas.

DISEÑO DE LA APLICACIÓN

Para nuestra nueva aplicación crearemos dos pantallas y antes de hacer nada, en la propiedad animación de cierre de pantalla y animación al abrir la pantalla seleccionar zoom, con esto conseguiremos un efecto de cambio de pantalla más profesional, también he seleccionado del desplegable de la opción Theme de la Screen 1, la opción Device default .

Continuando con el diseño en la primera pantalla pondremos dos disposiciones verticales que tanto el alto como el ancho esté ajustado al contenedor, a la primera disposición vertical, la llamaremos Pantalla 3 y la segunda Pantalla 1, en la primera disposición a la que llamamos Pantalla 3, meteremos dentro una etiqueta en la que introduciremos el texto ESTAS EN LA PANTALLA 3, y seguido metemos debajo una disposición vertical en la que dentro meteremos un botón, este contendrá el texto de siguiente, para la segunda disposición a la que llamamos Pantalla 3 haremos exactamente lo mismo, pero el texto de la etiqueta será ESTÁS EN LA PANTALLA 1,  a la disposición vertical Pantalla 3 le desactivaremos la casilla de visible, de esta manera cuando ejecutemos nuestra aplicación solo veremos una disposición vertical, ya vas intuyendo cómo lo vamos a solucionar…

Para nuestra segunda Screen, haremos exactamente los mismo, pondremos dos disposiciones verticales a las que llamaremos Pantalla 2 y Pantalla 4 y dentro nuevamente meteremos dos etiquetas y dos disposiciones verticales, donde meteremos dos botones, las etiquetas contendrán el texto  ESTAS EN LA PANTALLA 2 y ESTAS EN LA PANTALLA 4, los botones contendrán el mismo texto menos el botón de la disposición vertical pantalla 4, a este último le pondremos el texto VOLVER. Las dos disposiciones verticales creadas en esta segunda pantalla le dejaremos la casilla de visible desactivada, de esta manera por ahora la única disposición vertical visible será la de la Pantalla 1. Te quedara algo asi como lo que te muestro en la imagen.

PROGRAMANDO LA APLICACIÓN

Ya que tenemos el diseño de nuestra aplicación terminada vamos a comenzar la programación de la primera Screen, empezaremos por esta ya que es la que por defecto App Inventor mostrará al iniciar nuestra aplicación.

Vamos a crear en primer lugar una variable global que utilizaremos para saber y controlar en qué pantalla estamos en ese momento nos y que llamaremos NúmeroPantalla.

Cuando nombro pantalla en este tutorial me refiero a la disposición vertical que tengo activada la vista en ese momento

Lo segundo que haremos es que cuando arranque nuestra Screen le diremos programáticamente que muestre la disposición vertical (Pantalla3) y oculte la disposición vertical 2 (Pantalla1). Más adelante y según vayamos construyendo nuestra aplicación añadiremos más bloques, pero de momento lo dejaremos tal cual se muestra en la imagen.

Ahora le diremos a nuestra aplicación que cuando pulsemos el botón 1 abra la Screen 2 pero pasandole un valor inicial a esa pantalla, utilizaremos para ello el bloque:

Abre otra pantalla con valor inicial, nombre de pantalla, valor inicial.

Para el nombre de pantalla pondremos Screen 1, para el valor inicial que le pasaremos a esta pantalla le pondremos el valor de 2.

Para el botón 2 haremos exactamente lo mismo, la diferencia estará en el valor que le pongamos al valor inicial que será 4. Date cuenta que el valor corresponderá a la pantalla que queramos mostrar en ese momento.

Bien ahora iremos a la pantalla de bloques de la Screen2, y crearemos una variable global a la que también llamaremos NúmeroPantalla y le daremos el valor de cero.

Cuando inicie la Screen 2, lo que haremos es darle a nuestra variable el valor que nos manda la Screen 1 y comprobaremos que el valor de la variable sea igual a 2, si es así, pondremos nuestra Pantalla 2 visible y ocultaremos nuestra Pantalla 4, si de lo contrario la variable no contiene el valor de dos, entonces haremos lo contrario, haremos visible la Pantalla 4 y ocultaremos la Pantalla 2.

Para el botón 1 y 2 de la Screen 2 haremos exactamente lo mismo que con los dos botones de la Screen 1, la diferencia estará que abriremos esta vez la Screen1 y en el valor que le pongamos al valor inicial será para el botón 1  el valor de 3, y para el botón 2 será 1. Te recuerdo que el valor corresponderá a la pantalla que queramos mostrar en ese momento.

Bien antes de probar la aplicación vamos a volver a nuestra Screen 1, y es que ahora deberemos meter la lógica necesaria para que cuando volvamos de nuestra Screen 2, nuestra primera Screen nos muestre la pantalla que corresponda al valor mandado por el valor inicial, esto es facil, solo deberemos hacer lo mismo que en la Screen 2, comprobaremos que el valor de la variable sea igual a 3, si es así, pondremos nuestra Pantalla 3 visible y ocultaremos nuestra Pantalla 1, si de lo contrario la variable no contiene el valor de tres, entonces haremos lo contrario, haremos visible la Pantalla 1 y ocultaremos la Pantalla 3. Quedará de la siguiente manera.

Si ahora ejecutamos nuestra aplicación y  pulsamos los correspondientes botones, pasaremos de una disposición vertical a otra utilizando la animación de cierre de pantalla y de abrir pantalla, de esta manera queda solucionado el problema de límite de pantallas en Appinventor 2.

Si quieres que hablemos de algun asunto en concreto, o te has quedado atascado en algun desarrollo, no olvides dejarlo en los comentarios, intentaremos solucionarlo,

si quieres descargar el proyecto AIA para abrirlo en App Inventor pulsa aquí.

Sin más me despido hasta el próximo videotutorial. Un saludo

Si te ha gustado compartelo
Share on Facebook
Facebook
Tweet about this on Twitter
Twitter
Share on LinkedIn
Linkedin
Pin on Pinterest
Pinterest

12 comentarios en “COMO SOLUCIONAR EL PROBLEMA DE LÍMITE DE PANTALLAS EN APP INVENTOR 2”

  1. hola, estoy tratando de crear una aplicación para agendar citas, pero me encuentro con el siguiente problema:
    no puedo crear un calendario con fechas y horas a tomar, no se si tendré que crear las 365 screen como si fuese calendario y en cada screen el itinerario diario para que asi los usuario puedan tomar sus citas, no se si explico bien.
    espero me pueda dar una mano con eso.
    Saludos

    Responder
    • Hola Juan.
      Bueno no sé muy bien lo que tienes pensado hacer. Esto podrías conseguirlo guardando los datos de cada día, Me explicó mejor. Podrías utilizar el componente selector de fecha para seleccionar un día del año y guardar en una base de datos tanto la fecha seleccionada como los datos asociados a esa agenda. Después en otra pantalla podrías hacer lo contrario. Al seleccionar la fecha se recuperaría las notas guardadas. Espero explicarme bien.
      De todas formas me parece un buen tema para crear un tutorial, si tienes paciencia haré uno tratando el asunto.
      Un saludo

      Responder
  2. Gracias por tu respuesta Raul, si me entendiste super bien mi proyecto, lo estoy intentando pero cuando quiero guardar mas de un dato en el mismo día se me sobre escribe, he hecho tal cual tu me comentas con el selector de fecha y me resulta pero tengo ese problema de sobreescritura, espero me puedas ayudar es un proyecto lindo que tengo pensado para mi barberia.

    Responder
    • Puedes probar a crear una variable que se incremente cada vez que guardes datos distintos en la misma fecha, y utilizar esta misma variable para etiquetar lo guardado para más tarde recuperarlo.
      Si tengo una fecha y le añado una variable para utilizarlo como etiqueta, podré guardar más de un dato en la misma fecha.

      Responder
  3. Buenos días, mi pregunta es, porque cuando diseño mi app en la pantalla de diseño, todo esta bien distribuido y cuando la envió al celular y la iinstaló, todo me sale buen junto y me sobra bastante espacio en la parte de abajo

    Responder
    • Hola Misael
      Colocaste tus objetos en alguna disposición?? Los objetos se suelen colocar en disposiciones verticales u horizontales y estás a su vez deben coger el ancho y el alto del contenedor, es decir el ancho y el alto de la pantalla. También puedes utilizar porcentajes para ocupar solo un espacio de la pantalla.
      Un saludo

      Responder
  4. Hola, tengo una duda, a la hora de generar el codigo Qr me sale un error y entonces lo que tengo que hacer es inhabilitar algunos bloques, entonces si genera el codigo. ¿Existe número máximo de bloques en AppInventor?

    Gracias.

    Responder
    • Existe un número limitado de espacio de 10 megas para las aplicaciones creadas con App inventor 2. Si eliminando algunos bloques y te funciona , puedes intentar ver si esos bloques que eliminas son siempre los mismos, si es así podría ser un error de programación. De lo contrario podría ser que superarás el límite de megas.

      Responder
  5. Hola estoy intentando crear una app si la prueba en algun emulador tofo bien pero cuando la insgtlao como app en el celular la primera pantalla normal pero al pasar a la segunda se prende y apaga constantemente. Akguna sugerenci

    Responder
    • Revisa todos los bloques puede que algunos estén ocasionando el problema. Si sigues teniendo problemas te puedo ayudar si me manadas el código.
      Un saludo

      Responder

Deja un comentario

error: Content is protected !!