Flash Page Transition Effect Copy till Grid

• Maj 16, 2024

I denna Flash-tutorial skapar vi en mycket populär sidövergångseffekt med hjälp av Flash Copy to Grid-assistenten. Denna Copy to Grid-assistent har funnits i flera versioner av Flash som en del av tidslinjeeffekterna. Men eftersom det är en så användbar och tidsbesparande funktion, anser jag att den borde vara en del av varje Flash-designers verktygslåda.

Här är övergången vi kommer att bygga. Som ni ser expanderar elva vertikala rektanglar över scenen och fungerar som en mask för att avslöja bakgrundsbilden. Med hjälp av Assistenten Copy to Grid behöver vi bara skapa ett rektangelfilmklipp och sedan tilldela en Motion Tween-animation till den. Resten av arbetet med att skapa sidövergångsanimationen görs för oss av Flash.

Låt oss starta en ny film på 550 x 400 pixlar och vi kommer att använda ActionScript 2.0. Den tomma filmen bör bara ha en ram och ett "lager 1" -lager i tidslinjen. Byt namn på detta lager till "Övergång". För vårt exempel har jag importerat en bakgrundsbild till scenen. Detta gav mig ett nytt lager i tidslinjen. Jag döpte om detta lager till "Bakgrund" och drog ner det för att göra det till det undre lagret i tidslinjen. Vi kommer att arbeta med övergångsskiktet.

1. Klicka på ram 1 i övergångsskiktet. Använd rektangelverktyget för att rita en liten rektangel var som helst på scenen (Stroke till null, Fyll till svart eller valfri färg).
   
   
2. Välj rektangeln med markeringsverktyget. I fastighetsinspektören ställer du in rektangelns bredd till 50 pixlar, höjd till 400 pixlar och X- och Y-positionerna till 0,0. Om du använder ett scen av en annan storlek, vill du att höjden på din rektangel ska vara scenens höjd. Dela sedan scenens bredd med valfritt nummer för att få bredden på din rektangel.
   
   
3. Med rektangeln fortfarande vald, gå till menyfältet och klicka på Infoga - Tidslinjeeffekter - Assistenter - Kopiera till rutnät. Detta öppnar dialogrutan Kopiera till rutnät. Det tar elva av våra rektanglar för att täcka hela scenen. För alternativ för rutstorlek ställer du in antalet rader till 1 och kolumnerna till 11. (Om du använder ett annat antal rektanglar, byt ut 11 mot ditt antal rektanglar.) Ställ också in raderna och kolumnerna för alternativet Grid Space till noll. Klicka på knappen Förhandsgranska uppdatering och vänta några avsnitt tills Flash är klar. Klicka sedan på OK för att stänga dialogrutan. Du bör nu se svart över hela scenen.
   
   
4. Gå till biblioteket. Där hittar du en grafik med namnet "Kopiera till rutnät 1" och en annan grafik med namnet "effektSymbol" (inuti Effektmappen). Högerklicka på effectSymbol-grafiken och välj Egenskaper på menyn. I dialogrutan Egenskaper ändrar du typen från grafik till filmklipp. Upprepa detta för bilden Copy to Grid 1.
   
   

Nu är vi redo att ansluta Motion Tween till filmklippet effectSymbol. I biblioteket dubbelklickar du på effectSymbol-filmklippet och du kommer till filmklippets tidslinje.

Nästa →

Copyright 2018 Adobe Systems Incorporated. Alla rättigheter förbehållna. Adobes produktskärmbild (ar) tryckta 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.

Video Instruktioner: Page Load Animation - Webflow interactions and animations tutorial (Maj 2024).