Share
Hoewel sommige toepassingen volledig in één weergave kunnen worden uitgevoerd, hebt u meestal meer dan één scherm of weergave nodig om uw app-inhoud weer te geven. In deze zelfstudie leert u hoe u met Corona tussen verschillende weergaven kunt maken en schakelen.
De Corona gebruiken tonen klasse en de transition.from () methode, we zullen wat afbeeldingen toevoegen aan het podium en schakelen tussen de twee. Je leert ook meer over tabellen en functies net zoals groepen, die containers zijn voor weergave-objecten.
De overgang wordt aangeroepen door een Tik evenement.
Het eerste dat u hoeft te doen, is het platform selecteren waarop u uw app wilt uitvoeren, op deze manier kunt u de grootte kiezen voor de afbeeldingen die u wilt gebruiken.
Het iOS-platform heeft deze kenmerken:
Omdat Android een open platform is, zijn er veel verschillende apparaten en resoluties. Een paar van de meest voorkomende schermkenmerken zijn:
In deze zelfstudie concentreren we ons op het iOS-platform, dat zich specifiek ontwikkelt voor distributie naar een iPhone / iPod touch.
We zullen een schone interface met drie afbeeldingen maken, de eerste zal een enkele afbeelding zijn met de achtergrond en een grafische afbeelding. De rest van de afbeeldingen zullen hetzelfde concept volgen, maar ze zullen afzonderlijk worden toegevoegd om u te laten zien hoe u ze moet gebruiken groepen. Dit is erg handig als u een weergave vol knoppen, teksten, afbeeldingen, enz. Wilt wijzigen.
Afhankelijk van het apparaat dat u hebt geselecteerd, moet u mogelijk de afbeeldingen in de aanbevolen PPI exporteren, u kunt dit doen in uw favoriete afbeeldingseditor.
Ik gebruikte de Pas grootte aan functie in de Preview-app in Mac OS X.
Vergeet niet om de afbeeldingen een beschrijvende naam te geven en deze in uw projectmap op te slaan.
Tijd om onze applicatie te schrijven!
Open de Lua-editor van uw voorkeur (elke teksteditor werkt, maar u hoeft geen syntax te markeren) en bereid u voor op het schrijven van uw geweldige app.
Eerst verbergen we de statusbalk, dit is de balk bovenaan het scherm met de tijd, het signaal en andere indicatoren.
display.setStatusBar (display.HiddenStatusBar)
Nu voegen we de eerste weergave toe, dit is de afbeelding met de groene titel.
Accentsconagua
defaultView = display.newImage ('defaultView.png') Deze regel maakt de globale variabele standaard weergave en gebruikt de tonen API om de opgegeven afbeelding aan het werkgebied toe te voegen. Standaard wordt de afbeelding toegevoegd aan 0,0 met de linkerbovenhoek als referentiepunt.
De volgende variabele slaat de laatste aangetikte weergave op om te bepalen welke weergave als volgende moet worden weergegeven. Het wordt ook gebruikt om de weergave te verwijderen wanneer deze niet meer zichtbaar is.
lastView =
De volgende functie is erg belangrijk omdat deze de richting van de nieuwe view-transtion afhandelt. Dit is ook een nieuw type functie dat we nog niet eerder in de Corona-serie hebben gebruikt: een op parameters gebaseerde functie. Maakt u zich geen zorgen, parametergebaseerde functies zijn vrij eenvoudig, vooral als u een andere programmeertaal kent. Laten we kijken:
lokale functie swapViews (huidig, nieuw, van)
lastView = current
if (from == 'down') dan
transition.from (nieuw, y = new.height * 2, onComplete = removeLastView)
elseif (from == 'up') dan
transition.from (nieuw, y = -new.height, onComplete = removeLastView)
elseif (from == 'left') dan
transition.from (nieuw, x = -new.width * 2, onComplete = removeLastView)
elseif (from == 'right') dan
transition.from (nieuw, x = new.width * 2, onComplete = removeLastView)
einde
einde
Het heeft drie parameters:
Wanneer de overgang voltooid is, wordt de removeLastView functie wordt gebeld.
Met deze functie wordt de weergave verwijderd die eerder was verwisseld.
removeLastView =
functie removeLastView ()
lastView: removeSelf () - hier gebruiken we de laatsteView-variabele
einde
Deze regels verklaren enkele variabelen die in de volgende functie worden gebruikt.
lokale modi = 'up', 'down', 'left', 'right' - de vier beschikbare modi voor animatie local changeView = - verklaart de volgende functie local changed = false - controleert of de weergave is gewijzigd geruild
Deze functie wordt uitgevoerd wanneer de gebruiker op het scherm tikt.
Het detecteert het huidige scherm en roept de functie swapViews aan met behulp van de parameters bepaald door de veranderd variabel. De code maakt het groepsobject en voegt de bijbehorende weergave en de bijbehorende listener toe. Het selecteert ook een willekeurige overgangsrichting van de mode tafel.
functie changeView: tik op (e) if (changed == false) then secondView = display.newGroup () bg = display.newImage ('secondViewBg.png') button = display.newImage ('button.png', 40, 223) secondView.insert (secondView, bg) secondView.insert (secondView, button) secondView: addEventListener ('tap', changeView) swapViews (defaultView, secondView, modes [math.random (1, 4)] changed = true else standaardView = display.newImage ('defaultView.png') defaultView: addEventListener ('tap', changeView) swapViews (secondView, defaultView, modes [math.random (1, 4)] changed = false end end De volgende regel voegt de vereiste luisteraar toe aan de schermweergave.
defaultView: addEventListener ('tap', changeView) 
Als alles werkt zoals verwacht, zijn we bijna klaar om onze app te bouwen voor apparaattesten. Nog één ding: ons toepassingspictogram.
Met behulp van de afbeeldingen die u hebt gemaakt voordat u een mooi en goed uitziend pictogram kunt maken, is de pictogramgrootte voor het iPhone-pictogram (niet-retina) 57x57 px, maar de iTunes Store gebruikt een 512x512px-versie, dus het is beter om uw pictogram in dit formaat te maken.
Het hoeft niet de afgeronde hoeken of de transparante schittering te hebben, want dat wordt automatisch toegevoegd door iTunes en iOS.
U hebt nu een handige, goed ogende manier om weergaven in uw toepassingen te wijzigen. Probeer het uit en voeg je eigen touch toe!
Bedankt voor het lezen van deze tutorial. Ik hoop dat je het nuttig hebt gevonden!
