Importera och använda animationer

Med hyperPad kan du skapa objekt med anpassade animationer. Du har två valmöjligheter när det kommer till animationer. Du kan importera animationer som individuella bilder, eller en komplett sprite-sheet.

Individuella bilder:

Du kan skapa en animationscykel genom att importera en sekvens av individuella bildrutor.

För att börja måste du importera din första bildruta eller en bild för att representera ditt objekt från "Resursbibliotek" (Se Importera tillgångar). När du har importerat ditt objekt, tryck och håll fingret på det objekt du vill lägga till animationer på, detta kommer att visa Resursmenyn.

Från Resursmenyn, välj "Lägg till animation", detta öppnar alternativ för att importera från Kamera Roll eller Dropbox. Se "Importera tillgångar" för mer info om dessa alternativ.

När du har valt din önskade importkälla kan du välja alla ramar för animationen, och sedan trycka på "Klar" i det övre högra hörnet för att fortsätta importera dessa ramar.

Du kommer då att bli ombedd att ange ett namn för animationscykeln.

När du har angett namnet på cykeln kommer hyperPad att skapa en sprite-sheet med alla animationscykler för den tillgången (inklusive den ursprungliga grafiken för tillgången). Tänk på att hyperPad endast kommer att generera en sprite-sheet med en maximal upplösning på 2048x2048 pixlar. Detta innebär att den totala storleken för varje importerad ram (inklusive den ursprungliga tillgången) inte får överskrida den maximala storleken för sprite-sheeten.

Om du har med större bilder, många animationsramar, eller båda. Kommer du nog att stöta på ett felmeddelande som säger att du har överskridit den maximala storleken för sprite-sheeten. Om du är fast besluten att använda sådana stora grafik finns det ett par sätt att kringgå detta.

1. Dela upp dina animationssekvenser över flera objekt. Var och en kommer att ha sin egen 2048x2048 sprite-sheet. Så ha ett "gå"-objekt, ha ett "hoppa"-objekt, etc. Där varje objekt lagrar animationscykeln (eller flera cykler). På så sätt genererar du flera 2048x2048 sprite-sheets.

2. Importera dem inte som animationscykler. Importera helt enkelt varje animationsram som sin egen bild. Använd sedan beteendet Spela animation och lägg till varje ram manuellt till animationstidslinjen i beteendeinställningarna.

Sprite Sheets:

Du kan skapa anpassade sprite-sheets och importera dem till hyperPad genom att länka ditt projekt med Dropbox. För att lära dig mer om att länka ditt projekt med Dropbox, se "Importera tillgångar".

För att skapa anpassade sprite-sheets kan du använda vilket program som helst som kan skapa ett sprite-sheet som är kompatibelt med "Cocos2D". Alla sprite-sheets måste ha en par PLIST-fil som innehåller metadata för sprite-sheeten. Du kan se hjälpartikeln "Stödda tillgångstyper" för att lära dig mer om kompatibla sprite-sheets.

Visa animationer:

Om din tillgång har animationer kommer den att märkas i "Resursbibliotek" som en "Animerad" tillgång.

För att förhandsgranska en tillgångs animationer, öppna "Resursmenyn" genom att trycka och hålla fingret på den animerade tillgången och välj "Visa animationer".

Härifrån kan du öppna "Resursmenyn" igen och välja "Förhandsgranska animation". Popup-fönstret kommer att spela animationen och även visa dig användbar information.

Om du trycker och håller fingret på en animationscykel kommer det att öppna Resursmenyn så att du kan se de individuella ramarna för den cykeln.

Använda animationer:

Du kan lägga till en animerad tillgång direkt på duken, eller använda beteendet "Spela animation" för att köra en animation på begäran.

För att lägga till en animerad tillgång direkt på duken, öppna "Resursbiblioteket" och visa de animerade tillgångarnas animationer. Om du väljer en animationscykel kommer den att läggas till "Dockan", så att du kan dra den direkt in i din scen.

När du lägger till en animationscykel på duken, kommer det att skapa ett objekt och automatiskt lägga till beteendet "Spela animation" till det. Om du behöver ändra inställningarna för animationens uppspelning för det objektet kan du göra det från beteendena för objektet.

Använda beteendet "Spela animation":

Om du behöver spela en animation vid en händelse, som när en användare trycker på en knapp eller rör en joystick, kan du använda beteendet "Spela animation".

Börja med att lägga till en animerad tillgång på duken. Välj sedan objektet och starta "Beteende editorn" från "Objektets egenskaper".

I detta exempel kommer vi att låta objektet spela en animation när det trycks. Börja med att lägga till beteendet "Påbörjad beröring".

Nästa lägg till beteendet "Spela animation" från FX-kategorin, och koppla det till det "Påbörjade beröring"-beteende som du tidigare la till.

När det är kopplat, tryck på beteendet "Spela animation" för att se "Beteendeckens egenskaper". Från beteendeckens egenskaper kan du ändra vilket objekt som ska animeras, vilken animation som ska spelas och andra olika parametrar som påverkar animationens uppspelning.

I beteendeckens egenskaper, tryck på rutan märkt "Välj animation". Detta kommer att öppna animationstidslinjen, så att du kan lägga till ramar eller en animationscykel.

För att lägga till animationer till tidslinjen kan du trycka på "Resursbibliotek"-ikonen, för att öppna resursbiblioteket. Alla grafiska tillgångar du trycker på kommer automatiskt att väljas och läggas till tidslinjen.

Om du vill lägga till en animationscykel, tryck och håll på en animerad tillgång för att öppna "Resursmenyn". Från Resursmenyn, välj "Visa animationer". Resursbiblioteket visar nu alla animationscykler du tidigare har lagt till för tillgången. Genom att trycka på en cykel läggs den till tidslinjen.

När du är klar med att lägga till animationer till tidslinjen kan du trycka på beteendesidan för att stänga tidslinjen och återgå till beteendeeditorn.

Om du trycker på "Spela", kommer objektet endast att animera när du berör det.