Share
Aunque algunas aplicaciones pueden ejecutarse completamente en una sola vista, la mayoría de las veces necesitará más de una pantalla o vista para mostrar el contenido de su aplicación. En este tutorial, aprenderá cómo crear y cambiar entre diferentes vistas usando Corona.
Usando la corona monitor clase y la Transición desde() Método, agregaremos algunas imágenes al escenario y cambiaremos entre ellas. También aprenderás más sobre Mesas y Funciones tanto como Los grupos, que son contenedores para objetos de exhibición.
La transición será llamada por un Grifo evento.
Lo primero que debes hacer es seleccionar la plataforma en la que deseas ejecutar tu aplicación, de esta manera podrás elegir el tamaño de las imágenes que usarás.
La plataforma iOS tiene estas características:
Debido a que Android es una plataforma abierta, hay muchos dispositivos y resoluciones diferentes. Algunas de las características de pantalla más comunes son:
En este tutorial nos centraremos en la plataforma iOS, específicamente desarrollando para su distribución a un iPhone / iPod touch.
Crearemos una interfaz limpia con tres imágenes, la primera será una única imagen que contenga el fondo y un gráfico de botón. El resto de las imágenes seguirán el mismo concepto, pero se agregarán por separado para mostrarle cómo usarlas. Los grupos. Esto es muy útil cuando necesita cambiar una vista llena de botones, textos, imágenes, etc..
Dependiendo del dispositivo que haya seleccionado, es posible que necesite exportar los gráficos en el PPI recomendado, puede hacerlo en su editor de imágenes favorito.
Usé el Ajustar el tamaño Funciona en la aplicación Preview en Mac OS X.
Recuerde dar a las imágenes un nombre descriptivo y guardarlas en la carpeta de su proyecto.
Es hora de escribir nuestra aplicación!
Abra su editor Lua preferido (cualquier editor de texto funcionará, pero no tendrá resaltado de sintaxis) y prepárese para escribir su increíble aplicación.
Primero, escondemos la barra de estado, esta es la barra en la parte superior de la pantalla que muestra la hora, la señal y otros indicadores.
display.setStatusBar (display.HiddenStatusBar)
Ahora agregamos la primera vista, esta será la imagen con el título verde..
Accentsconagua
defaultView = display.newImage ('defaultView.png') Esta línea crea la variable global. vista predeterminada y usa el monitor API para agregar la imagen especificada al escenario. Por defecto, la imagen se agrega a 0,0 usando la esquina superior izquierda como punto de referencia.
La siguiente variable almacenará la última vista pulsada para determinar qué vista debe mostrarse a continuación. También se utilizará para eliminar la vista cuando ya no esté visible..
lastView =
La siguiente función es muy importante porque maneja la dirección de la nueva vista de transición. Este es también un nuevo tipo de función que no hemos utilizado antes en la serie Corona: una función basada en parámetros. Sin embargo, no se preocupe, las funciones basadas en parámetros son bastante simples, especialmente si conoce cualquier otro lenguaje de programación. Vamos a ver:
Función local swapViews (actual, nuevo, desde)
lastView = actual
si (desde == 'abajo') entonces
transition.from (nuevo, y = new.height * 2, onComplete = removeLastView)
elseif (desde == 'arriba') entonces
transition.from (nuevo, y = -new.height, onComplete = removeLastView)
elseif (desde == 'izquierda') entonces
transition.from (nuevo, x = -new.width * 2, onComplete = removeLastView)
elseif (desde == 'derecho') entonces
transition.from (nuevo, x = new.width * 2, onComplete = removeLastView)
fin
fin
Tiene tres parámetros:
Cuando se completa la transición, el removeLastView la función será llamada.
Esta función borra la vista que se intercambió previamente..
removeLastView =
función removeLastView ()
lastView: removeSelf () - aquí usamos la variable lastView
fin
Estas líneas declaran algunas variables utilizadas en la siguiente función..
modos locales = 'arriba', 'abajo', 'izquierda', 'derecha' - los cuatro modos disponibles para la animación local changeView = - declara la siguiente función local cambiado = falso - comprueba si la vista tiene ha sido cambiado
Esta función se ejecuta cuando el usuario toca la pantalla..
Detecta la pantalla actual y llama a la función swapViews utilizando los parámetros determinados por el cambiado variable. El código crea el objeto Grupo y agrega la vista correspondiente y su escucha. También selecciona una dirección de transición aleatoria de la modo mesa.
función changeView: toque (e) si (cambiado == falso) luego secondView = display.newGroup () bg = display.newImage ('secondViewBg.png') button = display.newImage ('button.png', 40, 223) secondView.insert (secondView, bg) secondView.insert (secondView, botón) secondView: addEventListener ('tap', changeView) swapViews (defaultView, secondView, modos [math.random (1, 4)]) cambiado = true else defaultView = display.newImage ('defaultView.png') defaultView: addEventListener ('tap', changeView) swapViews (secondView, defaultView, modos [math.random (1, 4)]) cambiado = final falso final La siguiente línea agrega el oyente requerido a la vista de pantalla.
defaultView: addEventListener ('tap', changeView) 
Si todo funciona como se espera, estamos casi listos para construir nuestra aplicación para la prueba de dispositivos. Solo una cosa más: nuestro ícono de aplicación..
Al usar los gráficos que creó antes de poder crear un ícono bonito y atractivo, el tamaño del ícono para el ícono del iPhone (sin retina) es de 57x57px, pero la tienda iTunes usa una versión de 512x512px, por lo que es mejor crear su ícono en este tamaño.
No necesita tener las esquinas redondeadas o el brillo transparente porque se agregará automáticamente por iTunes e iOS.
Ahora tiene una forma útil y atractiva de cambiar vistas en sus aplicaciones. Pruébalo y añade tu propio toque.!
Gracias por leer este tutorial. Espero que lo hayas encontrado útil.!
