Implementeer 8-weg sprite-loopanimatie voor personages
Verificatie omgeving
- Ramen
-
- Vensters 11
- Unity-editor
-
- 2020.3.25f1
- Pakketten met invoersystemen
-
- 1.2.0
Vereisten voor deze tip
De volgende instellingen zijn vooraf geconfigureerd als voorwaarde voor de uitleg van deze tips.
Referentie site
Over de 4-weg wandelanimatie
We hebben je in onze vorige tips laten zien hoe je een vierwegloopanimatie maakt. In dit artikel zullen we de 8 richtingen uitleggen, maar de meeste stappen zijn hetzelfde als de 4-weg loopanimatie, dus we zullen hier alleen de verschillen uitleggen.
Voorbereiding van wandelende afbeeldingen
De vorige keer hebben we afbeeldingen voor 4 richtingen voorbereid, maar deze keer zullen we als volgt afbeeldingen voor 8 richtingen voorbereiden. "Linksonder", "Rechtsonder", "Linksboven" en "Rechtsboven" zijn toegevoegd.
Wat de volgorde van oriëntatie betreft, lijkt het erop dat de 8 richtingen niet zo duidelijk bepaald zijn in vergelijking met de 4 richtingen. De volgende formaten komen echter relatief vaak voor, dus we zullen deze keer doorgaan met deze regeling.
| onder | Linksonder |
| Links | Rechtsonder |
| Rechts | Linksboven |
| Boven | Rechtsboven |
Een project maken en afbeeldingen voorbereiden
Deze keer zal ik proberen iets te maken dat een personage kan plaatsen en verplaatsen met de cursortoetsen op het toetsenbord. Aangezien het 8 richtingen zijn, worden de afbeeldingen diagonaal weergegeven als u diagonaal beweegt.
De eerste stap is het maken van een nieuw 2D-project. Voeg de personageafbeelding toe die je voor je project hebt voorbereid.
Selecteer de afbeelding die u hebt toegevoegd en configureer de infovensterinstellingen. Deze instelling is hetzelfde als voor 4 richtingen.
Splits de afbeelding in de sprite-editor. Het aantal afbeeldingen zal toenemen, maar de taken zullen hetzelfde zijn.
Het is OK als de afbeelding in het project als volgt wordt weergegeven.
Animatiegegevens maken
Wat je hier doet is hetzelfde als de 4-way walking animatie. Uiteindelijk is het OK als je een animatie in 8 richtingen kunt maken. Houd er rekening mee dat de getallen in de afbeelding niet synchroon lopen met de tijd in de vier richtingen.
Afbeelding van het van| instellen | de naam van het animatiebestand |
|---|---|
| IwamaruDown | Iwamaru_0, Iwamaru_1, Iwamaru_2, Iwamaru_1 |
| IwamaruLinks | Iwamaru_6, Iwamaru_7, Iwamaru_8, Iwamaru_7 |
| IwamaruRechts | Iwamaru_12, Iwamaru_13, Iwamaru_14, Iwamaru_13 |
| IwamaruUp | Iwamaru_18, Iwamaru_19, Iwamaru_20, Iwamaru_19 |
| IwamaruLeftDown | Iwamaru_3, Iwamaru_4, Iwamaru_5, Iwamaru_4 |
| IwamaruRightDown | Iwamaru_9, Iwamaru_10, Iwamaru_11, Iwamaru_10 |
| IwamaruLeftUp | Iwamaru_15, Iwamaru_16, Iwamaru_17, Iwamaru_16 |
| IwamaruRightUp | Iwamaru_21, Iwamaru_22, Iwamaru_23, Iwamaru_22 |
Zorg ervoor dat elke richting correct wordt geanimeerd.
Instellingen voor animatie-overgang
De instellingen zijn hetzelfde als wanneer het in 4 richtingen is tot het midden, dus ik zal het weglaten.
Zodra je de Blend Tree hebt ingesteld, moet je 8 Motions maken.
We zetten de .anim die aan het project is toegevoegd op de 8 items in Motion.
Geef de richting van elke animatie numeriek op.
| Richting | X | Y |
|---|---|---|
| onder | 0 | -1 |
| Boven | 0 | 1 |
| Links | -1 | 0 |
| Rechts | 1 | 0 |
| Linksonder | -1 | -1 |
| Rechtsonder | 1 | -1 |
| Linksboven | -1 | 1 |
| Rechtsboven | 1 | 1 |
Hiermee is de animatie-instelling voltooid.
Controle van de beweging
Beweging doe je door op een toets op het toetsenbord te drukken, zodat je een script kunt maken om het te besturen. De inhoud van dit script is precies hetzelfde als het script dat in de 4 richtingen is gemaakt, dus raadpleeg het. De naam van het script moet "CharacterMove" zijn.
Nadat u het script hebt gemaakt, koppelt u het aan het tekenobject.
uitvoering
Hiermee is het hele proces voltooid. Probeer het spel uit te voeren en op de cursortoetsen op je toetsenbord te drukken om het te verplaatsen. Als het personage beweegt in de richting waarin je erop hebt gedrukt en de loopanimatie beweegt terwijl de afbeelding van richting verandert in de richting waarin je kijkt, ben je klaar. Deze keer ondersteunt het 8 richtingen, dus controleer of de afbeelding ook diagonaal wordt toegepast wanneer u diagonaal beweegt.