Kwik 2 Path Animation för en filmklipp eller Sprite
Nu kan vi skapa sökvägsanimationen. Skillnaden mellan en linjär och bananimation är linjen. I båda animationerna rör sig objektet längs en bestämd linje. Som vi upptäckte med flip-animationen på sidan flyttar en linjär animation objektet längs en rak linje. I denna bananimation kommer vi att rita en väg längs en krökt linje för objektet att följa. Vårt första steg är att rita vägen med Photoshop Pen-verktyget.

  1. Med det lager som innehåller objektet (klippfilmklippet) valt, klicka på flugan med pennverktyget. Vi kommer att placera den andra punkten för banan cirka 3 svänglängder ovanför toppen av sidan. Klicka på den andra punkten och dra musen upp och till höger för att skapa en böjd linje.

  2. Byt namn på arbetsvägen till "flypath1" på panelen Paths (grupperad med panelen Layers).

    Nu kan vi säga Kwik att använda den här vägen för vår sökvägsanimation.

  3. Med fly_pg8-lagret fortfarande valt klickar du på Animationsikonen i kategorifältet.

  4. Klicka på Path Animation icon för att öppna dialogrutan.

  5. Namnge denna animation "fly1Ani".

  6. Denna animering kommer att vara för lager fly_pg8.

  7. Sökväg: Välj stigväg1 från listrutan.

    När flugan rör sig längs kurvan vill vi att han ska rotera något så att hans huvud fortsätter att peka i riktning mot banan.

  8. Markera rutan för automatisk vridning och ställ in mängden för rotationsvinkeln till bara -10 grader.

  9. Flugor rör sig snabbt. Låt oss ställa in varaktigheten till 1 eller 0,5 sekunder.

  10. Vi vill att flugan ska ligga utanför sidan efter animeringen. Markera rutan för paus när du är klar och ställ in slingan till 1 tid. Låt bakåt när slutet avmarkeras.

  11. Låt oss lägga till lite realism genom att få flugan att tveka när den klickar och sedan flyga av. Vi kan göra detta genom att ställa in Easing till inOutExpo.

  12. Ställ ankarpunkten till TopCenter så att hans kropp roterar mer än huvudet.

  13. Vi vill inte att flugan ska röra sig förrän du klickar på knappen. Ställ in Wait Request.

  14. Lämna rutan för att gå tillbaka till startposition inte avmarkerad.

  15. Klicka på Skapa.

Nu kan vi lägga till knappen. Fortfarande på fly_pg8-lagret.

  1. Klicka på Interaktionsikon från kategorifältet.

  2. Klicka på Lägg till knappikon för att öppna dialogrutan.

  3. Namnge knappen "fly1btn".

  4. Vi vill ha lagret fly_pg8 för både Standard- och Över-knapptillstånd.

  5. Expandera avsnittet Animering från interaktionsavsnittet.

  6. Välj Spela animering. Välj fly1Ani i listrutan.

  7. Utöka avsnittet Ljud.

    Välj Stoppa ljud och välj det första ljudet i listrutan.

    Fortfarande i avsnittet Ljud, välj Spela ljud och välj den andra ljudfilen i listrutan.

  8. Klicka på Skapa.

Nu kan vi testa vår interaktiva sekvens. När sidan laddas bör flugan fladda med sina vingar på sidan med bakgrundens flugrör att spela kontinuerligt. När vi klickar på sidan bör vi höra ett högre flygeljud och han flyttar sig från sidan.

Spara ändringarna på sidan8.

Klicka på Exportera endast aktuell sida och ikonen Publicera för att testa din animation.

Gå till din LearnKwik-mapp och skapa en säkerhetskopia av mall-projektmappen. Byt namn på säkerhetskopimappen genom att lägga till aktuellt datum i slutet. (TemplateMM-DD-YY).

← Tillbaka

Dessa tutorials är för den äldre versionen av Kwik 2 och kanske inte till mycket hjälp när du använder Kwik 3 och högre. Om du har problem, använd Kwik-forumet.

Copyright 2018 Adobe Systems Incorporated. Alla rättigheter förbehållna. Adobes produktskärmbild (ar) tryckta om med tillstånd från Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst och Flash Paper är / är antingen [a] registrerat varumärke [s] eller ett varumärke [s] från Adobe Systems Incorporated i USA och / eller andra länder.
Kwik-produkten, Kwik-logotypen och Kwiksher är egenskaper hos Kwiksher.com - Copyright 2011. Skärmbilder som används med tillstånd.