Användarhandbok Avbryt

Lägga till interaktivitet med kodfragment i Animate

  1. Användarhandbok om Adobe Animate
  2. Introduktion till Animate
    1. Nyheter i Animate
    2. Visuell ordlista
    3. Systemkrav för Animate
    4. Tangentbordsgenvägar för Animate
    5. Arbeta med flera filtyper i Animate
  3. Animering
    1. Grunderna vid animering i Animate
    2. Så här använder du bildrutor och nyckelbildrutor i Animate
    3. Animering bildruta för bildruta i Animate
    4. Så här arbetar du med klassiska övergångsanimeringar i Animate
    5. Pensel
    6. Rörelseguide
    7. Rörelseinterpoleringar och ActionScript 3.0
    8. Om övergångsanimeringar med rörelse
    9. Animeringar med rörelseinterpolering
    10. Skapa en animering med rörelseinterpolering
    11. Använda nyckelbildrutor för egenskaper
    12. Animera placering med en interpolering
    13. Så här redigerar du rörelseinterpoleringar med rörelseredigeraren
    14. Redigera rörelsebanan för en interpolerad animering
    15. Ändra rörelseinterpoleringar
    16. Lägga till anpassade övergångar
    17. Skapa och använda förinställda rörelser
    18. Konfigurera interpoleringsintervall för animeringar
    19. Arbeta med rörelseinterpoleringar sparade som XML-filer
    20. Rörelseinterpoleringar jämfört med klassiska interpoleringar
    21. Skapa övergångar
    22. Använda animeringar med benverktyget i Animate
    23. Arbeta med figurriggning i Animate
    24. Så här använder du maskeringslager i Adobe Animate
    25. Så här arbetar du med scener i Animate
  4. Interaktivitet
    1. Så här skapar du knappar med Animate
    2. Konvertera Animate-projekt till andra dokumenttypsformat
    3. Skapa och publicera HTML5 Canvas-dokument i Animate
    4. Lägga till interaktivitet med kodfragment i Animate
    5. Skapa anpassade HTML5-komponenter
    6. Använda komponenter i HTML5 Canvas
    7. Skapa anpassade komponenter: Exempel
    8. Kodfragment för anpassade komponenter
    9. God praxis - annonsera med Animate
    10. Redigera och publicera VR
  5. Arbetsyta och arbetsflöde
    1. Skapa och hantera målarpenslar
    2. Använda Google Fonts i HTML5 Canvas-dokument
    3. Använda Creative Cloud Libraries och Adobe Animate
    4. Använda scen- och verktygspanelerna i Animate
    5. Arbetsflöde och arbetsyta i Animate
    6. Använda webbteckensnitt i HTML5 Canvas-dokument
    7. Tidslinjer och ActionScript
    8. Arbeta med flera tidslinjer
    9. Ange inställningar
    10. Använda redigeringspanelerna i Animate
    11. Skapa tidslinjelager med Animate
    12. Exportera animeringar för mobilprogram och spelplattformar
    13. Flytta och kopiera objekt
    14. Mallar
    15. Söka och ersätta i Animate
    16. Ångra, gör om och panelen Historik
    17. Kortkommandon
    18. Så här använder du tidslinjen i Animate
    19. Skapa HTML-tillägg
    20. Optimeringsalternativ för bilder och animerade GIF-filer
    21. Exportinställningar för bilder och GIF-filer
    22. Panelen Resurser i Animate
  6. Multimedia och video
    1. Omforma och kombinera grafikobjekt i Animate
    2. Skapa och arbeta med symbolinstanser i Animate
    3. Bildkalkering
    4. Så här använder du ljud i Adobe Animate
    5. Exportera SVG-filer
    6. Skapa videofiler för användning i Animate
    7. Så här lägger du till en video i Animate
    8. Rita och skapa objekt med Animate
    9. Omforma linjer och former
    10. Linjer, fyllningar och övertoningar med Animate CC
    11. Arbeta med Adobe Premiere Pro och After Effects
    12. Färgpaneler i Animate CC
    13. Öppna Flash CS6-filer i Animate
    14. Arbeta med klassisk text i Animate
    15. Placera grafik i Animate
    16. Importerade bitmappar i Animate
    17. 3D-grafik
    18. Arbeta med symboler i Animate
    19. Rita linjer och former med Adobe Animate
    20. Arbeta med bibliotek i Animate
    21. Exportera ljud
    22. Markera objekt i Animate CC
    23. Arbeta med Illustrator AI-filer i Animate
    24. Använda blandningslägen
    25. Ordna objekt
    26. Automatisera uppgifter med kommandomenyn
    27. Flerspråkig text
    28. Använda kameran i Animate
    29. Grafikfilter
    30. Ljud och ActionScript
    31. Ritinställningar
    32. Rita med ritstift
  7. Plattformar
    1. Konvertera Animate-projekt till andra dokumenttypsformat
    2. Stöd för anpassade plattformar
    3. Skapa och publicera HTML5 Canvas-dokument i Animate
    4. Skapa och publicera ett WebGL-dokument
    5. Så här paketerar du AIR för iOS-program
    6. Publicera AIR for Android-program
    7. Publicera för Adobe AIR för datorprogram
    8. Inställningar för ActionScript-publicering
    9. God praxis – organisera ActionScript i ett program
    10. Så här använder du ActionScript med Animate
    11. Hjälpmedel på arbetsytan i Animate
    12. Skriva och hantera skript
    13. Aktivera stöd för anpassade plattformar
    14. Översikt över stöd för anpassade plattformar
    15. Arbeta med plugin-program för anpassade plattformar
    16. Felsöka ActionScript 3.0
    17. Aktivera stöd för anpassade plattformar
  8. Exportera och publicera
    1. Så här exporterar du filer från Animate CC
    2. OAM-publicering
    3. Exportera SVG-filer
    4. Exportera bilder och video med Animate
    5. Publicera AS3-dokument
    6. Exportera animeringar för mobilprogram och spelplattformar
    7. Exportera ljud
    8. God praxis – tips för att skapa innehåll på mobila enheter
    9. God praxis – videokonventioner
    10. God praxis – riktlinjer för utveckling av SWF-program
    11. God praxis – strukturera FLA-filer
    12. De bästa sätten att optimera FLA-filer för Animate
    13. Inställningar för ActionScript-publicering
    14. Ange publiceringsinställningar för Animate
    15. Exportera projektorfiler
    16. Exportera bilder och animerade GIF-filer
    17. Publiceringsmallar för HTML
    18. Arbeta med Adobe Premiere Pro och After Effects
    19. Dela och publicera animeringar snabbt
  9. Felsökning
    1. Åtgärdade fel
    2. Kända fel

 

Panelen Kodfragment är avsedd att göra det enkelt för den ovane programmeraren att snabbt komma igång att använda JavaScript och ActionScript 3.0. Här kan du lägga till -kod i FLA-filen för att aktivera vanliga funktioner. Du behöver inte ha några kunskaper om JavaScript eller ActionScript 3.0 för att kunna använda panelen Kodfragment.

På panelen Kodfragment kan du:

  • Lägga till kod som påverkar beteendet hos ett objekt på scenen

  • Lägga till kod som kontrollerar spelhuvudets rörelser på tidslinjen.

  • (endast CS5.5) – Lägg till kod som tillåter att användaren interagerar med pekskärmen.

  • Lägga till nya kodfragment som du skapar på panelen.

Att använda kodfragmenten som finns i Animate är också ett bra sätt att börja lära sig JavaScript eller ActionScript 3.0. Genom att läsa koden i fragmenten och följa instruktionerna för kodfragment kan du få en förståelse för kodstrukturen och språket.

Alternativet Kodfragment i Animate
Alternativet Kodfragment i Animate

Innan du börjar

När du arbetat med panelen Kodfragment är det viktigt att förstå följande grunder i Animate:

  • För många av kodfragmenten måste du ändra något i koden. I Animate gör du detta åtgärdspanelen. Varje fragment innehåller specifika instruktioner angående detta.

  • Alla inkluderade kodfragment är antingen JavaScript eller ActionScript 3.0.

  • Vissa fragment påverkar ett objekts beteende så att det går att klicka på det eller få det att röra sig eller försvinna. Du använder dessa fragment på objekt på scenen.

  • Vissa fragment orsakar att en åtgärd inträffar omedelbart när spelhuvudet kommer in i bildrutan med fragmentet. Du kan använda dessa fragment för en bildruta i tidslinjen.

  • När du använder ett kodfragment läggs koden till i den aktuella bildrutan i lagret Åtgärder på tidslinjen. Om du inte har skapat lagret Åtgärder läggs det till automatiskt ovanför alla andra lager i tidslinjen.

  • Om ett objekt på scenen ska kunna styras av ActionScript-kod måste objektet ha ett instansnamn i egenskapsinspektören.

  • Du kan du på knapparna Visa beskrivning och Visa kod, som visas när du markerar ett kodfragment på panelen.

Lägga till ett kodfragment till ett objekt eller en bildruta i tidslinjen

Gör så här om du vill lägga till en åtgärd som påverkar ett objekt eller spelhuvudet:

  1. Markera ett objekt på scenen eller en bildruta i tidslinjen.

    Om du markerar ett objekt som inte är en symbolinstans konverteras objektet till en filmklippssymbol i Animate när du använder fragmentet.

    Om du markerar ett objekt som inte redan har ett instansnamn läggs ett sådant till i Animate när du använder fragmentet.

  2. Dubbelklicka på det kodfragment som du vill använda på panelen Kodfragment (Fönster > Kodfragment).

    Om du har markerat ett objekt på scenen läggs fragmentet till på åtgärdspanelen i de bildrutor som innehåller det markerade objektet.

    Om du markerade en bildruta i tidslinjen kommer Animate att lägga till fragmentet i just denna bildruta.

  3. Visa den nya koden på åtgärdspanelen och byt ut eventuella objekt enligt instruktionerna längst upp i fragmentet.

Kodfragment på åtgärdspanelen

Lägga till nya fragment på panelen Kodfragment

Det finns två sätt att lägga till nya kodfragment på panelen Kodfragment:

  • Ange ett fragment i dialogrutan Skapa nytt kodfragment.

  • Importera ett kodfragment som en XML-fil.

Gör så här för att använda dialogrutan Skapa nytt kodfragment:

  1. Välj på panelen Kodfragment Skapa nytt kodfragment på panelmenyn.

  2. Ange i dialogrutan titeln, texten för verktygstipset och JavaScript- eller ActionScript 3.0-koden för fragmentet.

    Genom att klicka på knappen Fyll i automatiskt kan du lägga till all kod som är markerad på åtgärdspanelen.

  3. Markera kryssrutan ”Ersätt instance_name_here automatiskt” om koden innehåller strängen ”instance_name_here” och du vill att den ska ersättas med rätt instansnamn i Animate när fragmentet används.

    I Animate läggs det nya fragmentet till på panelen Kodfragment i en mapp med namnet Anpassad.

Så här importerar du ett kodfragment i XML-format:

  1. Välj på panelen Kodfragment Importera XML-fil med kodfragment på panelmenyn.

  2. Markera den XML-fil som du vill importera och klicka på Öppna.

Om du vill se rätt XML-format för kodfragmentet väljer du Redigera XML-fil med kodfragment på panelmenyn.

Om du vill ta bort ett kodfragment högerklickar du på det på panelen och väljer Ta bort kodfragment på snabbmenyn.

Interaktiva animeringar med HTML5

Vissa animeringar kräver kodfragment för att stödja olika publiceringsplattformar. Vill du lära dig hur du använder kodfragment för att göra interaktiva animeringar? Titta på självstudiekursen i slutet av det här exemplet och följ stegen.

  1. I biblioteket klickar du på Publiceringsinställningar.

  2. Välj JavScript/HTML .

  3. På fliken HTML/JS klickar du på Exportera och väljer följande alternativ:

    • Filnamn: Skriv namnet på filen.
    • Spara som typ: Välj HTML.
  4. Klicka på OK.

Så här förbättrar du dina interaktiva HTML5-animeringar

Titta på videon när du vill veta hur du redigerar koderna.

Få hjälp snabbare och enklare

Ny användare?