Body

Bemærk: En færdig projektfil til denne tutorial kan findes i slutningen af denne artikel.

Introduktion

I denne tutorial vil vi oprette et Pong-lignende spil fra bunden. Vi vil dække nogle mere avancerede funktioner og adfærd i hyperPad, så denne tutorial forudsætter en grundlæggende viden om hyperPad-editoren. Hvis du mener, at du skal gøre dig mere bekendt med at lave et spil fra bunden, kan du først tjekke Komplet Guide - Oprettelse af et Platformspil tutorial.

Pong er et simpelt to-spiller spil, der kun består af to paddles og en bold, og kan betragtes som en simpel digital version af bordtennis. Hver spiller kontrollerer en paddle, begge på modsatte sider af bordet. Paddles kan kun bevæge sig fremad og tilbage og ramme bolden mod den modstående spiller. Hvis en spiller misser bolden, får den anden spiller et point. Den første spiller, der når 11 point, vinder!

For vores Pong-spil vil vi inkludere muligheden for at spille i 1 Spiller-tilstand (Spiller mod AI), 2 Spiller-tilstand (Spiller mod Spiller) eller 0 Spiller "Se"-tilstand (AI mod AI).

Del 1: Projektopsætning og Hovedmenu

Lad os komme i gang med at oprette et nyt projekt.

Åbn Projekter-menuen i hyperPad, og tryk på Ny Projekt. Giv dit projekt et navn, og tryk på Næste. Orienteringen kan efterlades som standard i liggende tilstand. For denne tutorial er enhedsstøtte indstillet til iPad 4:3. På den næste skærm, vælg "Fugleperspektiv" og efterlad resten som standard.

Nu hvor vi har et nyt projekt klar til at gå, lad os hurtigt komme i gang med at opsætte en hovedmenu, før vi hopper direkte ind i selve spillet. Det første, vi skal gøre, er at omdøbe vores scene til "Hovedmenu".

Tryk på Projekt/Scene Menu-knappen, og tryk på tandhjulsikonet ved siden af vores "Scene 1".

Tryk på Indstillingsmuligheden, og omdøb vores scene til "Hovedmenu". Tryk på Gem for at gemme og lukke indstillingsvinduet.

Næste skridt, for at forblive tro mod tidlige retrospil som arkade Pong, kan vi gøre vores baggrundsfarve sort.

Tryk på Sceneindstillinger-knappen, og vælg Baggrund. Tryk på "Ændr farve"-knappen og sæt den til sort (#000000FF).

Nu lad os tilføje en titellabel til vores hovedmenu. Tryk på knappen Specielle objekter, og vælg Label.

Indtast navnet på dit spil i tekstfeltet ("hyperPong" blev indtastet til denne tutorial), indstil skriftstørrelsen til noget stort, men ikke for stort. For en titlen "hyperPong" er 72 point en god størrelse. Skift farven til hvid (#FFFFFFFF) og placer den i midten af menuen nær toppen.

Nu har vi en hovedmenu-scene, som vi kan fylde med knapper for alle vores spilleregler. Vi lader menuen være som den er for nu, og vi afslutter den, efter vi har et spillbart spil.

Del 2: Opsætning af Spilscenen og Paddle

Tryk på Projektmenu-knappen, og tryk på "Tilføj Scene". Navngiv den "Spil" og tryk på Opret. Nu i Spilscenen bør du se et tomt lærred. Som vi gjorde med Hovedmenu-scenen, så gå videre og tryk på Sceneindstillinger-knappen igen og ændr baggrunden til sort (#000000FF).

Lad os gå i gang med at oprette vores spillerpaddles. Opret et tomt objekt ved at gå til knappen Specielle Objekter og vælge "Tomt Objekt". Skift dets farve til hvid (#FFFFFFFF) og sørg for, at opacitetsskyderen er helt tændt.

Omdøb objektet til "Spiller-1" og indstil dens fysiktilstand til Fysik, og lad Passable aktiveret.

Årsagen til, at vi holder Passable aktiveret, er, så vi får større kontrol over, hvordan bolden vil interagere med paddlen, når den rammer den. Vi vil gerne kunne styre hastigheden og retningen, bolden vil gå manuelt.

I objektets Player-1 egenskaber skal du gå til Transform-fanen og indstille skalaen X til 25% og flytte det til venstre for spillefeltet.

Næste, vi vil tilføje nogle kontroller til vores paddle, så den kan bevæge sig. Med paddlen valgt, gå til dens adfærdsredigerer ved at gå tilbage til fanen Fysik.

Placer en Joystick Analog-adfærd, som findes under Interaktion-sektionen (hvis du ikke kan finde det, skal du muligvis trykke på fanen Avanceret). Dette vil automatisk oprette en joystick til dig i sceneeditoren.

Men vi vil ikke kun tillade, at paddlen kan bevæge sig via joystick-bevægelse. Vi vil også gerne have, at en AI også kan udføre bevægelser.

Under den brugerdefinerede sektion skal du placere en Box Container. Dette vil gemme, hvilken retning paddlen skal bevæge sig. På den måde kan både en spiller, der kontrollerer en joystick, eller en AI, der udfører beregninger kan bevæge sig ved at ændre denne ene værdi. Dens standardværdi skal indstilles til 0. Det er også en god idé at give den et godt navn, så den er lettere at arbejde med, "Bevægelsesretning" virker passende.

Med Box Containeren valgt, tryk på "Ændre inputfelt"-knappen og tryk ja. Dette vil skabe en Set Input Field-adfærd for boksbeholderen, så vi kan ændre værdien, når vi har brug for det. Forbind Set Input Field til Joystick Analog.

Med Set Input Field-adfærden valgt, træk outputværdien fra Joystick Analog ind i New Value-feltet. Vælg "y"-egenskaben. Nu vil Move Direction bokscontaineren spore, hvor langt spilleren flytter joysticket op eller ned (y-aksen).

Nu hvor vi holder øje med, hvor langt joysticket bevæger sig op eller ned, skal vi også nulstille det til nul, hvis spilleren slipper joysticket. Ellers vil paddlen fortsætte med at bevæge sig i den retning, den sidst husker.

Under interaktionssektionen skal du tilføje en Stopped Touching-adfærd, og tryk på den for at åbne dens egenskaber. Som standard sporer den, hvornår spilleren stopper med at røre ved paddlen, men vi vil spore, hvornår spilleren stopper med at røre ved joysticket.

Tryk på objektets egenskab for at ændre den, og vælg joysticket. Du skal muligvis vælge det globale UI-lag for at kunne vælge det. Når det er valgt, skal du trykke på kontrolknappen. Adfærden skal nu vise joysticket som det sporede objekt.

Tryk på den Set Input Field, vi lavede tidligere, og duplicer den. Med den duplikerede Set Input Field, forbind den til Stopped Touching-adfærden, og indstil dens New Value-egenskab til 0.

Nu vil vores Move Direction bokscontainervariabel spore op- og nedbevægelserne af joysticket og nulstille sig til 0, når joysticket slippes. Det giver os en fremragende måde at fortælle vores paddle, hvordan den skal bevæge sig, så lad os fortsætte og give vores paddle noget bevægelse.

Under den brugerdefinerede sektion skal du droppe en Timer-adfærd. I dens egenskaber skal du indstille intervallet til 0. Denne timer vil blive udført så ofte den kan (én gang per billede), hvilket giver os muligheden for at opdatere paddles bevægelse meget hyppigt.

Før vi indstiller paddles hastighed, vil vi sikre os, at værdien for Move Direction bokscontaineren er begrænset inden for et rimeligt område, bare hvis den går for højt eller for lavt. Ellers vil vores paddle bevæge sig for hurtigt i nogle tilfælde.

Under logiksektionen skal du placere ned et Minimum- og et Maksimum-adfærd. Forbind Minimum-adfærd til timeren, og Maksimum-adfærd til Minimum. Du bør have noget der ligner dette:

I Minimum-adfærdens egenskaber skal du indstille den første værdi til outputværdien af Move Direction-adfærden, og den anden værdi skal indstilles til 1.

Minimum-adfærden vil outputte det mindste tal, den får. Så hvis Move Direction-værdien går højere end 1, vil den outputte 1. Ellers vil den simpelthen outputte værdien for Move Direction.

I Maksimum-adfærdens egenskaber skal du indstille den første værdi til resultatet af Minimum, og den anden værdi til -1.

Maksimum-adfærdens egenskaber outputter det største tal, den får. Så hvis Move Direction-værdien går lavere end -1, vil den outputte -1. Ellers vil den outputte værdien af Minimum (som er enten 1 eller Move Direction, hvilket som er lavere).

Hvad dette hele betyder er, at den resulterende værdi af Maksimum effektivt er værdien af Move Direction afgrænset mellem -1 og +1. Dette giver os fuld kontrol over, hvor hurtigt paddlen kan bevæge sig!

Et interval fra -1 til +1 er let at arbejde med, men vil være for langsomt, hvis vi bruger det direkte som paddle-hastighed.

Under logiksektionen igen, drop ned en Multiply Values-adfærd og forbind den til Maksimum-adfærdens output. For den første værdi, skal den indstilles til resultatet af Maksimum-adfærdens output. For den anden værdi kan vi indstille den til en god "max hastighed" værdi.

For nu skal vi indstille den til 20. Hvis du senere synes, at paddlen bevæger sig for langsomt eller for hurtigt, kan du blot ændre dette tal til et højere eller lavere tal.

Den Multiple Values-adfærd giver nu os et godt hastighedsinterval at arbejde med, fra så lavt som -20 til så højt som +20.

Nu er det et godt tidspunkt at indstille paddens hastighed. Under fysiksektionen skal du tilføje en Set Velocity-adfærd og forbinde den til Multiply Values-adfærd. Indstil feltet "x" til 0 og "y"-feltet til resultatet fra Multiply Values-adfærd.

Prøv det! Når du spiller spillet, skal paddlen bevæge sig, mens du bevæger joysticket op og ned.

Som du nok har bemærket under dit test, stopper intet paddlen fra at forlade skærmen. I den næste del vil vi tilføje nogle grænser for at holde alt i udsigt.

Del 3: Spilgrænser

Før vi fortsætter, lad os bruge noget forudseenhed og overveje godt spildesign. Spillerpaddlen vil ikke være i centrum af skærmen, men tættere på kanterne, mens vi samler vores spil. Dette vil blive et problem, da vi har UI-elementer (dvs. joysticks), der vil overlappe med vores spilelementer (dvs. paddles).

I stedet for at bruge hele skærmen som det spilleområde, bør vi indsætte grænserne, så vores paddlen ikke går under joysticket, hvor vores fingre er, hvor vi ikke nemt kan se det. På den måde vil vi ikke miste overblikket over vores paddle nær bunden af det spillbare område. Vi kan også bruge denne indsnævring som en hård grænse for at holde vores objekter indenfor det spillelige felt.

Tryk på knappen Specielle objekter og opret et nyt Tomt Objekt. Tryk på det nye tomme objekt for at åbne dets egenskaber.

Hold dens fysiske tilstand indstillet til Væg, og deaktiver Passable. Indstil dens farve, så vi visuelt kan se det, en opak mørkegrå (#1F1F1FFF) passer pænt. Indstil friktion til 0% og hop til 100%.

Nu, i Transform-fanen for væggen, skal du indstille Y-skalaen til 200% og flytte den til toppen af skærmområdet. Stræk den nu, så den passer til hele bredden af skærmområdet. Du kan også tænde for gittersnaptilstand for at hjælpe dig med at placere det præcist.

Nu skal du duplikere væggen og flytte kopien til bunden.

Dupliker igen og indstil dens skala X til 200% i stedet. Stræk derefter højden for at passe til skærmen og sæt den til venstre for skærmen.

Og igen, dupliker den lodrette væg og flyt den til højre for skærmen. Du skulle nu have et helt indelukket spillefelt:

Når du spiller spillet nu, vil du sandsynligvis straks bemærke, at du kan bevæge dig gennem væggene, som om de ikke var der. Dette skyldes to grunde; vi har indstillet paddlen til at være "Passable" og vi tvinger paddlens hastighed hver ramme. Dette er fint, vi skal blot implementere en måde at forhindre paddlen i at bevæge sig ind i væggen.

Hvad vi vil gøre for at implementere den adfærd er at tjekke spillerens position mod væggens position. Hvis det er sandt, så flyt spilleren tilbage ind i det spillelige område.

For at gøre det lidt lettere for os at implementere det, skal du trykke på den øverste væg og ændre Y-ankerpunktet til 0%. Dette vil anker væggens position til meget bunden af sig selv. Du kan muligvis skulle låse ankerfelterne ved at trykke på låseikonet.

På samme måde med bunden væg, ændr bunden vægs Y-ankerpunkt til 100% denne gang. Dette vil anker bunden vægs position til meget toppen af sig selv.

Nu er vi klar til at implementere vores grænsekontrol adfærd. Tryk på paddlen, og åbn dens adfærdsredigerer.

Start med at placere en Get Bounding Box fra logiksektionen. Den skal være indstillet til at bruge paddlen som standard. Denne adfærd vil give os bund-/venstre koordinaterne og størrelsen på paddlen.

Næste, drop og forbind en Add Values under logiksektionen og forbind det til Get Bounding Box-adfærden. I Add Values-egenskaberne skal den første værdi være resultatet af Get Bounding Box