Corona SDK maak een alfabetensoepspel

In deze tutorialserie leert u hoe u een minimalistisch alfabetensoepspel kunt maken. Het doel van deze game is om de speler in staat te stellen woorden uit een warrige reeks letters te kiezen. Lees verder!


Stap 1: Applicatieoverzicht

Met behulp van vooraf gemaakte afbeeldingen coderen we een leuk spel met Lua en de Corona SDK API's.

De speler kan een lijn trekken over het podium om een ​​woord te markeren. Je kunt de parameters in de code aanpassen om het spel aan te passen.


Stap 2: doelapparaat

Het eerste wat we moeten doen, is het platform selecteren waar we onze app binnen willen laten. Op deze manier kunnen we de grootte kiezen voor de afbeeldingen die we zullen gebruiken.

Het iOS-platform heeft deze kenmerken:

  • iPad: 1024x768px, 132 ppi
  • iPhone / iPod Touch: 320 x 480 px, 163 ppi
  • Iphone 4: 960x640 px, 326 ppi

Omdat Android een open platform is, zijn er veel verschillende apparaten en resoluties. Een paar van de meest voorkomende schermkenmerken zijn:

  • Google Nexus One: 480x800px, 254 ppi
  • Motorola Droid X: 854x480 px, 228 ppi
  • HTC Evo: 480x800px, 217 ppi

In deze zelfstudie concentreren we ons op het iOS-platform met het grafische ontwerp, dat zich specifiek ontwikkelt voor distributie naar een iPhone / iPod touch, maar de hier gepresenteerde code moet ook van toepassing zijn op Android-ontwikkeling met de Corona SDK.


Stap 3: Interface

Er zal een eenvoudige en gebruiksvriendelijke interface worden gebruikt, dit omvat meerdere vormen, knoppen, bitmaps en meer.

De interface grafische hulpmiddelen die nodig zijn voor deze tutorial zijn te vinden in de bijgevoegde download.


Stap 4: grafische afbeeldingen exporteren

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 Grootte aanpassen ... functie in de Preview-app op Mac OS X.

Vergeet niet om de afbeeldingen een beschrijvende naam te geven en deze in uw projectmap op te slaan.


Stap 5: App-configuratie

Een extern bestand zal worden gebruikt om de applicatie op verschillende apparaten op volledig scherm weer te geven, de config.lua het dossier. Dit bestand toont de oorspronkelijke schermgrootte en de methode die wordt gebruikt om die inhoud te schalen in het geval de app wordt uitgevoerd in een andere schermresolutie.

 toepassing = content = width = 320, height = 480, scale = "letterbox",

Stap 6: Main.lua

Laten we de applicatie schrijven!

Open de gewenste Lua-editor (elke teksteditor werkt, maar u hoeft geen syntax te markeren) en bereid u voor op het schrijven van uw geweldige app. Vergeet niet om het bestand op te slaan als main.lua in je projectmap.


Stap 7: codestructuur

We zullen onze code structureren alsof het een Klasse is. Als u ActionScript of Java kent, zou u de structuur vertrouwd moeten vinden.

 Necesary Classes Variabelen en constanten Declare Functions contructor (Hoofdfunctie) class methods (other functions) call Hoofdfunctie

Stap 8: Statusbalk verbergen

 display.setStatusBar (display.HiddenStatusBar)

Deze code verbergt de statusbalk. De statusbalk is de balk boven op het scherm van het apparaat die de tijd, het signaal en andere indicatoren toont.


Stap 9: Achtergrond van het spel

Een eenvoudige afbeelding wordt gebruikt als achtergrond voor de applicatie-interface, de volgende regel code slaat deze op.

 -- Afbeeldingen - [Achtergrond] - [game achtergrond] lokale gameBg = display.newImage ('bg.png')

Stap 10: Titelweergave

Dit is de titelweergave, het is het eerste interactieve scherm dat in onze game verschijnt. Deze variabelen slaan de componenten op:

 -- [Titeloverzicht] lokale titelBg lokale titel local startBtn local aboutBtn - [TitleView Group] lokale titelView

Stap 11: Over bekijken

Deze weergave toont de credits, versie en copyright van de game. Deze variabele wordt gebruikt om het op te slaan:

 -- [CreditsView] local over

Stap 12: Woordenlijst

De lijst met te vinden woorden en de reeds gevonden woorden worden opgeslagen door de volgende regels.

 -- [Woordenlijst Textfield] lokale woordenList local currentWords

Stap 13: Spelweergave

De gameweergave is samengesteld door de TextFields waarin de afzonderlijke letters zijn opgeslagen, de regel die wordt gebruikt om woorden te markeren en de waarschuwing die wordt gebruikt wanneer het spel is voltooid. Voeg de volgende regels toe aan uw code om met deze elementen om te gaan.

 -- [Letter Texfields Container] lokale tfs = display.newGroup () - [Selectielijn] lokale regel lokale regels = display.newGroup () - [Alert] lokale waarschuwing

Stap 14: Variabelen

Dit zijn de variabelen die we zullen gebruiken. Lees de opmerkingen in de code om meer over hen te weten. Sommige van hun namen verklaren zichzelf, dus daar zal geen commentaar zijn.

 -- Lijst met woorden om lokaal te vinden L1 = 'IPHONE', 'ANDROID', 'CORONA', 'MOBILE', 'GAMES' - Multidimensionale tabel, deze wordt gebruikt als een 'kaart' om de woorden in de lijst weer te geven stage local L1Map = 0, 0, 'I', 0, 0, 0, 'G', 0, 0, 0, 0, 0, 'P', 0, 0, 0, 'A', 0, 0, 0, 0, 0, 'H', 0, 0, 0, 'M', 0, 0, 0, 0, 'M', 'O', 'B', 'I ',' L ',' E ', 0, 0, 0, 0, 0,' N ', 0, 0, 0,' S ', 0, 0, 0, 0, 0,' E ', 0, 0, 0, 0, 0, 0, 0, ' C ',' O ',' R ',' O ',' N ',' A ', 0, 0, 0, 0 , 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, A, N, D, R, O, I, D, O, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 lokaal alfabet = 'A', 'B', 'C', 'D', 'E', ' F ', G, H, I, J, K, L, M, N, O, P, Q, R , 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z' lokaal correct = 0 - aantal gevonden woorden

Stap 15: Code Review

Hier is de volledige code die in deze zelfstudie is geschreven, samen met opmerkingen om u te helpen bij het identificeren van elk onderdeel:

 -- Alphabet Soup Game - Ontwikkeld door Carlos Yanez - Hide Status Bar display.setStatusBar (display.HiddenStatusBar) - Graphics - [Achtergrond] - [Game Background] local gameBg = display.newImage ('bg.png') - - [Titeloverzicht] lokale titelBg lokale titel lokale startBtn lokaal overBtn - [TitelView Groep] lokale titelView - [CreditsView] local about - [Woordenlijst Textfield] lokale woordenList local currentWords - [Letter Texfields Container] local tfs = display .newGroup () - [Selectielijn] lokale regel lokale regels = display.newGroup () - [Alert] lokale melding - lokale variabelen L1 = 'IPHONE', 'ANDROID', 'CORONA', 'MOBILE', 'GAMES' local L1Map = 0, 0, 'I', 0, 0, 0, 'G', 0, 0, 0, 0, 0, 'P', 0, 0, 0, ' A ', 0, 0, 0, 0, 0,' H ', 0, 0, 0,' M ', 0, 0, 0, 0,' M ',' O ',' B ' , 'I', 'L', 'E', 0, 0, 0, 0, 0, 'N', 0, 0, 0, 'S', 0, 0, 0, 0, 0 , 'E', 0, 0, 0, 0, 0, 0, 0, 'C', 'O', 'R', 'O', 'N', 'A', 0, 0, 0 , 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 , 0, 'A', 'N', 'D', 'R', 'O', 'I', 'D', 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 lokaal alfabet = 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', ' J ', K', L, M, N, O, P, Q, R, S, T , 'W', 'X', 'Y', 'Z' lokaal correct = 0

De volgende keer…

In dit deel van de serie heb je de interface en de basisinstellingen van de game geleerd. Houd ons in de gaten voor deel twee, waar we de logica van de applicatie, het gedrag van knoppen en meer zullen behandelen. Tot de volgende keer!