I denne veiledningen viser jeg deg hvordan du bruker Flow Graph System i Amazon Lumberyard. Du vil leke med det visuelle skriptystemet for å animere knapper og opprette interaksjoner mellom brukergrensesnittet og 3D-scenene dine. Deretter vil du opprette et nytt skript for å modifisere 3D-scenen din, tatt i betraktning av din avatar-plassering. Til slutt vil du bli utsatt for en utfordring.
Legg merke til at du anbefales å lese resten av serien for å få full forståelse av notatene fra denne delen.
Denne opplæringsserien er primært rettet mot to grupper av spillutviklere: de som er helt ukjente med spillmotorer i det hele tatt, og de som er kjent med andre spillmotorer (for eksempel Unity, Unreal Engine eller Cry Engine), men ikke med Lumberyard . Jeg antar at du har litt kunnskap om datagrafikknotasjon, så jeg vil ikke fullt ut dekke alle notasjoner.
Flow Graph er et visuelt skript system som lar deg implementere komplekse spill logikk uten å måtte programmere en enkelt linje med kode. All logikk kan opprettes, endres og fjernes med bare noen få UI-interaksjoner. Flow Graph er også nyttig for prototyping av spill-spill-scenarier, effekter og lyder.
Kjernen består av Flow Graph av noder og lenker. Den førstnevnte representerer vanligvis nivå enheter eller handlinger som kan utføre en bestemt handling på en målenhet. Sistnevnte brukes til å koble til noder og er representert som piler som forbinder innganger og utganger mellom noder.
Flowgrafen kan åpnes på to hovedveier; den første er gjennom hovedmenyen, ved å bruke linken på Utsikt > Åpne visningspanel > Flow Graph.
Den andre måten er gjennom Flow Graph-ikonet som er tilgjengelig i Redaktør verktøylinje.
Åpne flowgrafen ved hjelp av ett av de tilgjengelige alternativene.
Flow Graph Editor er sammensatt av følgende komponenter:
Før du hopper rett inn i handlingen, må du lære det grunnleggende av Flow Graph-skript.
Flow Graph-skript er organisert i fire forskjellige kategorier og finnes i Flowgrafer (Nummer 3 i det forrige bildet) mappetreet i Flow Graph Editor.
I den forrige opplæringen opprettet du et UI-lærred som inneholder noen knapper. Du kan også huske at det ikke var fullt testet. Det er nå på tide å gå tilbake og fullføre det.
Hovedideen bak brukergrensesnittet er følgende:
Åpne Lumberyard Editor og deretter UI Editor. Klikk Åpen og åpne din MyCanvases.uicanvas.
Under hierarki ruten, velg Bakgrunn element. Nå, under Eiendommer ruten, klikk Legg til komponent ... og velg deretter Fader komponent.
Under Bilde eiendommer; en ny eiendom kalt Fader vil bli vist.
Dette Fader eiendom vil bli brukt til å fade ut brukergrensesnittet når du legger inn nivået ditt.
Begynn med å åpne CompleteFirstLevel og åpne deretter Flow Graph Redaktør. En tom flytdiagram skal vises.
Under komponenter ruten, velg grafen Start, under Spill kategori.
Legg merke til at du også kan bruke Søkeord å søke bestemte nodene (når du vet hva du skal søke).
Nå klikker du på Fil> Ny å opprette en ny nodediagram. Standardnavnet er Misligholde, og den er plassert under Eksterne filer delen i grafer ruten.
Dra nå Start knutepunkt i knutepunktet (midt på skjermen).
Startnoden er standardnoden som utføres når du starter spillet ditt ved hjelp av Bytt til spill alternativ. Derfor starter vanligvis de fleste nodediagrammer ved denne noden.
Før du legger til nødvendige noder for å vise brukergrensesnittet ditt, må du lære mer informasjon om nodediagrammet og dens noderegenskaper.
En knute er representert i Flow Graph som en boks med innganger og utganger.
En knute består av inngangsporter på venstre side for å motta informasjon og utgangsporter på høyre side for overføring av informasjon. Utgangsporter aktiveres avhengig av nodens funksjon. Portene kan ha følgende forskjellige datatyper.
Data-type | Farge | Beskrivelse |
---|---|---|
Noen | Grønn | Uspesifisert, hvilken datatype som helst kan mottas |
boolean | Blå | Sant eller usant |
ENTITYID | Grønn / Rød | En unik verdi som identifiserer alle enheter i et nivå |
Flyte | Hvit | En 32-biters flytpunktsverdi |
int | rød | Et 32-biters positivt eller negativt nummer |
uint64 | n / a | Et 64-biters positivt eller negativt nummer |
string | turkis | En rekke tegn som brukes til lagring av tekst |
Vec3 | Gul | En 3D-vektor bestående av tre flytende punktverdier. Kan brukes til å lagre stillinger, vinkler eller farger |
Tomrom | n / a | Brukes for porter som ikke godtar noen verdi, men utløses istedet for å sende strømmen av kontroll gjennom en flytdiagram |
Tatt i betraktning det forrige bildet:
For å konsultere en komplett dokumentasjon om Flow Graph noder, bør du lese den offisielle dokumentasjonen.
Når spillet starter, vil du laste inn UI-lerretet ditt. Heldigvis har Lumberyard en node for det. Velg Laste node under UI> Lerret og dra den inn i nodediagrammet.
Denne knuten har to hovedegenskaper:
Velg Laste knutepunkt og under Eiendommer ruten, endre CanvasPathname eiendom til MyCanvases.uicanvas.
Når du trykker på Tast inn nøkkel, eiendommen CanvasPathname inne i Laste noden bør endres tilsvarende.
Dette Laste noden er nesten fullført. Ditt neste skritt er å koble til Start node inn i Laste node. Dette utføres ved å dra en lenke (eller pil) fra Start utdata i Last inn Aktiver inngang.
Hvis du gjør en feil når du kobler en pil, kan du enkelt fikse det. Du må bruke høyre museknapp for å klikke på pilen og Fjerne den. Merk at du også kan velge andre alternativer som Deaktiver, Utsette, eller Noen. Jeg vil ikke forklare dem i denne opplæringen siden de ikke er viktige for det vi ønsker å oppnå.
Siden vi vil bruke en knapp for å utløse en handling, må vi legge til en Action node. Under UI > Lerret, dra Action inn i nodediagrammet.
De Action har tre svært viktige egenskaper:
Jeg dekker ikke Aktiver igjen siden jeg forklarte det tidligere.
Det første trinnet er å koble til På Last til ActionListener Aktiver. Deretter må du koble til begge deler for å sende passordet ID CanvasID utgang og inngang. Legg merke til at når du kobler dem til CanvasID = 0 endres til CanvasID.
De ActionName er ikke så enkelt siden vi må først definere en handling for vår knapp. Tanken er å legge til en Handling klikk til Start spill knapp.
Åpne UI Editor, og åpne MyCanvases.uicanvas. Velg Start spill knappen, og under Eiendommer ruten, legg til strengen NewGameClick til Klikk på Handling.
Lagre MyCanvases.uicanvas og gå tilbake til Flow Graph redaktør. Velg Action node og endre ActionName eiendom til NewGameClick.
De Action er nå konfigurert. Det som gjenstår nå er å konfigurere handlingen som utføres når dette Action utløses. Minner om Fader komponent lagt til tidligere. Det er nå på tide å bruke det.
For det må du legge til animasjon node inne i UI > Fader tre i grafnoden.
De nye egenskapene å se på er:
Det første trinnet er å verifisere ElementID fra Fader komponent. For det, åpne UI Editor, last opp lerretet ditt, og velg Bakgrunn komponent. Inne i Eiendommer ruten, ta en titt på nummeret inne i id element.
Merk at du valgte Bakgrunn element, siden det er den som har Fader komponent. Lukk UI Editor og endre ElementID av animasjon node til 2.
Deretter endrer du StartValue til 1 og Målverdi til 0. La Hastighet verdi som standard.
Nå, koble til VedHandling (Action)til Aktiver inngang (animasjon). Igjen, koble til CanvasID sammen (Laste node til animasjon node).
Dette Flow Graph er nesten fullført. For å forstå hva som mangler, spill spillet (Kontroll-G). Hva ser du? Din meny med riktig handling inne i Start spill knappen, men ingen musemarkør for å hjelpe deg. La oss fikse det da.
Se etter MouseCursor node inne i Input tre og legg det til grafnoden. Denne noden har bare to innganger (Vise fram og Gjemme seg). Begge er selvforklarende, riktig?
Koble til Start utgang (Start node) inn i Vise fram inngang (MouseCursor node). Deretter kobler du til VedHandling utdata til Gjemme seg inngang.
Du kan nå kjøre spillet og teste om alt er greit. Du vil innse at det er.
Vi vil imidlertid utføre ett ekstra ytelsestrinn. Siden vi ikke vil lage spill med minnelekkasje, bør vi bli vant til å gjøre ting riktig. Etter avsluttende animasjon slutter, bør vi laste av lerretet.
Legg til Lesse knutepunkt (UI > Lerret) som din endelige node i nodediagrammet. Koble til onComplete (animasjon) Utgang til Aktiver noden (Lesse). Til slutt kobler du til CanvasID sammen (Laste node til Lesse node).
Den komplette flytdiagrammet er:
Lagre flytdiagrammet ditt og navnet på det mygraphdemo.
Det neste trinnet i denne opplæringen er å opprette en annen flytdiagram. Men denne gangen vil du direkte samhandle med objektene i 3D-scenen din for å konstruere grafen. Hovedideen er å bruke spillerens plassering for å samhandle med en nærhetsutløser for å slå på en lampe.
I RollupBar, å velge Entity > Triggers og dra a Nærhet Trigger inn i 3D-scenen.
Plasser Nærhet Trigger nær en lampe. Den gule 3d-boksen representerer utløserområdet.
Høyreklikk på Nærhet Trigger og velg Lag flytdiagram alternativ.
Navngi det TriggerGraph og klikk OK. Flow Graph Editor skal åpnes. Du vil legge merke til at denne gangen grafen vil bli plassert inne i Nivå> Enheter seksjon.
Nå omorganisere grensesnittet ditt for å se Nærhet Trigger, de lampe (Light1) og Flow Graph Editor samtidig.
Velg Nærhet Trigger og, inne i grafnoden, bruk høyre museknapp og velg Legg til valgt enhet alternativ.
En ny ProximityTrigger node vil vises.
De eneste egenskapene vi vil bruke, vil være Tast inn og Permisjon utganger. Den første blir utløst når spilleren går inn i Nærhet Trigger område, mens det andre utløses når spilleren forlater Nærhet Trigger område.
Deretter velger du din Light1 element og avmarker Aktiv alternativet inne i Entity Properties ruten.
Med Light1 valgt, inne i Flow Graph bruk høyre museknapp og velg Legg til valgt enhet en gang til.
Nå må du koble til ProximityTrigger knutepunkt med Lys node. Koble til Tast inn utdata i Aktiver input. Til slutt kobler du til Permisjon utdata i Deaktiver inngang.
Lagre flytdiagrammet og navnet på det TriggerGraph. Nå er det dags å kjøre spillet og validere den nye flytdiagrammet. Alt skal fungere som forventet.
For å teste kunnskapen du har kjøpt så langt, er du nå utfordret til å gjenskape standard Lumberyard komme-i gang-ferdig-nivå. For det må du leke med børster, belysning, materialer, teksturer, terreng og flytdiagrammer. Kort sagt, bruk alt du har lært så langt. Ditt siste nivå bør se ut som følgende:
Dette avslutter denne opplæringen på Lumberyard. I denne veiledningen har jeg vist deg hvordan du bruker Flow Graph System. Du har spilt med det visuelle skriptystemet for å konfigurere brukergrensesnittet som standardvisning, og har skapt interaksjoner mellom brukergrensesnittet og 3D-scenene dine. Deretter opprettet du et skript for å modifisere 3D-scenen din, med tanke på spillerens plassering og nærhetstrykk. Hvis du har spørsmål eller kommentarer, kan du som alltid gjerne slippe en linje i kommentarene.