Å lage et Blackjack-spill i Corona - Opprette grensesnittet

I denne opplæringen vil jeg vise deg hvordan du lager et Blackjack-spill for iPad ved hjelp av Corona SDK. La oss komme i gang!

Vil du lære hvordan dette spillet ble designet? Denne opplæringsserien er basert på arbeidet til Andrei Marius, som opprinnelig utgav en grundig Illustrator-veiledning som demonstrerer hvordan å designe spillet på Vectortuts+.


1. Nytt prosjekt

Åpne Corona Simulator og velg "Nytt prosjekt".


På følgende skjermbilde velger du følgende innstillinger.

Prosjektinnstillinger

Trykk "neste"-knappen, velg deretter åpne i redaktør. Dette vil åpne "Main.lua"i standard tekstredigeringsprogrammet.


2. Prosjektering

Åpen "Config.lua"slette alt og endre det til følgende.

 søknad = content = width = 768, height = 1024, skala = "letterBox", fps = 30,

Dette setter prosjektets standardbredde, høyde, skala og FPS. "letterbox"skalainnstilling betyr at appen skal skalere opp i begge retninger like jevnt som mulig, og om nødvendig vise spillet" Letter Boxed ", som du ser på noen DVD-filmer.


3. Skjul statuslinjen

Vi vil ikke at statuslinjen vises i vår app, så skriv inn følgende i "Main.lua"

 display.setStatusBar (display.HiddenStatusBar);

4. Lokale variabler

Legg til følgende under koden du skrev inn i trinnet ovenfor.

 lokal cardTable = display.newImage ("table.png", true); lokale penger10; - $ 10,00 lokale penger25; - $ 25.00 chip lokale penger50; - Den $ 50.00 chip lokale dealBtn; - Avtale knappene lokale hitBtn; - Slå knappen Local StandBtn; - Stand-knappen lokale instruksjoner Tekst; - Gi instruksjoner og vis vinnerens lokale dragter = "h", "d", "c", "s"; - hjerter = h, diamanter = d, klubber = c, spader = s lokale dekk; - Dekket av Kort lokale coinContainer; - en gruppe som vil holde chipset lokale forhandlerGroup; - Vi setter forhandlerskortene i denne gruppen lokal playerGroup; - vi setter spillerkortene i denne gruppen lokal avtaleTo = "spiller"; - som for øyeblikket blir utdelt til lokal playerHand = ; - et bord for å holde spillerne kortene lokale dealerHand = ; - et bord for å holde forhandlerne kortene lokale alleCards =  - et bord for å holde alle kortene lokale betAmount = 0; - hvor mye spilleren satser totalt lokale penger; - hvor mye penger spilleren har lokal blackJack = false; - om spiller eller forhandler har blackjack local firstDealerCard = ""; - en referanse til det første kortet som forhandleren er utdelt lokal playerYields = false; - om spilleren har stått på hånden eller ikke - hvem vinneren av runden er lokal bet = 0; - hvor mye spilleren legger til betAmount variable local bankText; - viser spillerne penger lokal betText; - viser hvor mye spilleren satser på lokal dealerCardsY = 120; - Y-posisjon for forhandlerskort lokal playerCardsY = 810; - Y posisjon av spillerkort

Dette er alle variablene vi skal bruke i dette spillet. Les kommentarene for å forstå hva de er for.


5. Oppsett ()

Oppsettfunksjonen blir kalt når appen lastes inn. Skriv inn følgende under koden du skrev inn i trinnet ovenfor.

 funksjon Setup () end

Nå ring oppsettingsfunksjonen rett under der du erklærte det.

 Oppsett ()

6. SetupCoins ()

Legg til følgende over hvor du ringer Oppsett () i trinnet ovenfor.

 funksjon setupCoins () money10 = display.newImage ("money10.png", 50.960); money10.betAmount = 10; money25 = display.newImage ("money25.png", 110.960); money25.betAmount = 25; money50 = display.newImage ("money50.png", 170.960); money50.betAmount = 50; slutt

Dette setter opp våre pengerbilder og legger til a betAmount nøkkel.

Ring nå denne funksjonen innvendig Oppsett ().

 funksjon Setup () setupCoins (); slutt

7. SetupButtons ()

Legg til følgende under setupCoins () funksjonen du erklærte i trinnet ovenfor.

 funksjon setupButtons () dealBtn = display.newImage ("deal_btn.png", 250.960); dealBtn.isVisible = false; hitBtn = display.newImage ("hit_btn.png", 400 960); hitBtn.isVisible = false; standBtn = display.newImage ("stand_btn.png", 550 960); standBtn.isVisible = false; slutt

Dette setter opp knappene våre og gjør dem alle usynlige.

Ring denne funksjonen innvendig Oppsett ().

 funksjon Setup () setupCoins (); setupButtons (); slutt

8. SetupTextFields ()

Legg til følgende under setupButtons () funksjonen du skrev inn i trinnet ovenfor.

 funksjon setupTextFields () instructionsText = display.newText ("Plasser din innsats", 300, 300, native.systemFont, 30); instructionsText: setTextColor (0,0,0) bankText = display.newText ("Din bank: $", 10,905, native.systemFont, 30); bankText: setTextColor (0,0,0) betText = display.newText ("", 650.906, native.systemFont, 30); betText: setTextColor (0,0,0); slutt

Dette setter opp Tekstfelt og setter tekstfargen til svart.

Legg dette til i Oppsett () funksjon.

 funksjon Setup () setupCoins (); setupButtons (); setupTextFields () slutten

9. SetupGroups ()

Legg til følgende under setupTextFields () funksjon.

 funksjon setupGroups () coinContainer = display.newGroup () coinContainer.x = 250; coinContainer.y = 600; dealerGroup = display.newGroup (); playerGroup = display.newGroup (); slutt

Dette setter opp gruppene som vil bli brukt til å holde kortene og pengene spilleren satser

Legg dette til i Oppsett () Fungerer akkurat som du har gjort i de foregående trinnene.


10. Kontroller fremdriften

Hvis du tester appen, bør du se at grensesnittet kjører riktig.

Spillgrensesnitt

11. AddListeners ()

Legg til følgende under setupGroups () funksjon.

 funksjon addListeners () money10: addEventListener ('touch', betHandler); money25: addEventListener ( 'touch', betHandler); money50: addEventListener ( 'touch', betHandler); dealBtn: addEventListener ( 'touch', deal); hitBtn: addEventListener ( 'touch', traff); standBtn: addEventListener ( 'touch', stand); slutt

Dette legger til lyttere til grensesnittelementene våre slik at brukeren kan samhandle med dem. Vi må opprette de funksjonene som vil bli kalt når brukeren klikker på dem.


12. BetHandler ()

Skriv inn følgende under addListeners () funksjon.

 funksjon betHandler (event) slutten

Denne funksjonen håndterer innsatsen. Det sørger for at brukeren ikke prøver å satse mer enn han har i banken sin.


13. Deal ()

Skriv inn følgende under koden du skrev inn i trinnet ovenfor.

 funksjon avtale () ende

Denne funksjonen er hvor hjertet av spillet ligger. Alt logikken i spillet blir håndtert i denne funksjonen.


14. Hit ()

Legg til følgende under avtale() funksjon.

 funksjons hit (event) slutten

Denne funksjonen blir kalt når brukeren trykker på "truffet"-knappen.


15. Stand ()

Skriv inn følgende under koden du skrev inn i trinnet ovenfor.

 funksjonsstand () ende

Når spilleren bestemmer seg for å stå, blir denne funksjonen kalt.


16. CreateDeck ()

Legg til følgende under createDeck () funksjon.

 funksjonen createDeck () dekk = ; for i = 1, 4 gjør for j = 1, 13 gjør lokale tempCard = passer [i] ... j; table.insert (dekk, tempCard); sluttendens ende

Dette nullstiller dekkbordet og lager et nytt dekk. Den går gjennom hver verdi i drakter bord og legger til nummeret 1 gjennom 1. 3 til dem. Vi angir variabelen tempCard lik resultatet, og sett det inn i Dekk bord.

Ring nå dette i Oppsett () funksjon.

 funksjon Setup () setupCoins (); setupButtons (); setupTextFields (); setupGroups (); createDeck (); slutt

Vi får noen tilfeldige kort fra kortstokken, så sørg for at det er virkelig tilfeldig at vi må frøke tilfeldige generatoren. Hvis vi ikke gjør dette, vil hver gang spillet starter, generere den samme tilfeldigheten. Legg til følgende createDeck ().

 funksjon Setup () setupCoins (); setupButtons (); setupTextFields (); setupGroups (); math.randomseed (os.time ()); createDeck (); slutt

Konklusjon

Dette bringer en del av denne opplæringen til en avslutning. I neste del av serien begynner vi å integrere spillet. Takk for at du leste. Hold deg innstilt for del to!