Kwik Page Turn-animatie

• Mei 21, 2024

Voor de laatste paar tutorials hebben we gewerkt aan de paginasjabloon voor onze Kwik-boek-app. We moeten nog een ding toevoegen aan de sjabloon, dat is de lineaire animatie die een paginaomslag emuleert.

We willen dat deze animatie onmiddellijk wordt afgespeeld wanneer de pagina wordt geladen. We hebben de afbeelding voor de animatie al op de kwkpgTurn-laag op pagina 1. Deze laag is ook ingesteld als een gedeeld activum zodat deze door de boek-app werkt.

Lineaire animatie

Op dit punt zullen we een zeer eenvoudige animatie maken en de meeste standaardinstellingen gebruiken. Maar we zullen veel leren over lineaire animaties als we er veel aan het boek toevoegen.

Een lineaire animatie verplaatst een object van het ene punt op het scherm naar het andere. Daarom zijn de hoofdinstellingen voor een lineaire animatie het begin- en eindpunt. Kwik stelt automatisch het startpunt voor de animatie in als de huidige positie van het object op de laag. We moeten het eindpunt voor de animatie instellen.

We zullen ook de duur van de animatie in seconden instellen, omdat dit zal bepalen hoe snel het object beweegt. Ten slotte zullen we de animatie instellen om te starten wanneer de pagina wordt geladen.

Page Turn Animation

1. Selecteer pagina 1 in het gedeelte Pagina / Componenten van het Kwik-paneel. Je zou "@ page1" bovenaan de sectie moeten zien.
   
   
2. Klik op de Schakel naar Components View icon om uw lijst met componenten te zien die al aan deze pagina zijn toegevoegd.
   
   
3. Selecteer de laag kwkpgTurn in het deelvenster Lagen.
   
   
4. Klik in de categoriebalk op Animaties pictogram.
   
   
5. Klik op de Lineair animatiepictogram (eerste pictogram in eerste rij gereedschappen).
   
   
6. Wijzig in het dialoogvenster Lineaire animatie de animatie "pgTurn".
   
   
7. Laag kwkpgTurn: Dit vertelt Kwik om de afbeelding op de kwkpgTurn-laag te gebruiken voor de animatie. Houd dit geselecteerd
   
   

In de sectie Eigenschappen toont Kwik de X- en Y-posities voor het object op de laag kwkpgTurn en de breedte en hoogte van het grafische object. Omdat we de hele afbeelding van het scherm willen verplaatsen, moeten we deze minstens evenveel pixels verplaatsen als de breedte van de afbeelding (732 px). Laten we het 732 pixels naar links verplaatsen. Omdat de huidige X-positie 0 is. Dit resulteert in een negatief getal voor de eindpositie. We willen het object niet verticaal verplaatsen, dus houden we de Y-positie op 0. Hierdoor zal het object alleen horizontaal bewegen.

8. Eind positie:
   x -732
   y 0
   
   
9. Gerandomiseerde eindpositie: we zullen deze functie niet gebruiken, dus laat deze ingesteld op de standaardwaarden.
   
   
10. Duur: we willen dat de afbeelding zeer snel beweegt om het flip-effect te geven. Laten we dit dus instellen op 1 seconde en 0,25 seconde vertraging.
    
    
11. Schakel het selectievakje in voor Onderbroken wanneer voltooid.
    
    
12. Lus: stel deze optie in op l tijd.
    
    
13. Begint: Stel dit in op Wanneer pagina begint.
    
    
14. Klik op Maken.
    
    
15. Je zou moeten zien dat de pgTurn-animatie is toegevoegd aan de componentenlijst voor deze pagina.
    
    

Dit is een goed moment om het project te testen. Klik op de knop Publiceren in het Kwik-paneel. Test de navigatieknoppen en de animatie van de paginaomslag.

Copyright 2018 Adobe Systems Incorporated. Alle rechten voorbehouden. Schermafbeeldingen van Adobe-producten herdrukt met toestemming van 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 en Flash Paper is / zijn ofwel [a] geregistreerde handelsmerken [s] of een handelsmerk [s] van Adobe Systems Incorporated in de Verenigde Staten en / of andere landen.
Kwik-product, het Kwik-logo en Kwiksher zijn eigenschappen van Kwiksher.com - Copyright 2011. Schermafbeeldingen gebruikt met toestemming.

Deze tutorials zijn voor de oudere versie van Kwik 2 en bieden mogelijk niet veel hulp bij het gebruik van Kwik 3 en hoger. Gebruik het Kwik-forum als u problemen ondervindt.

Video-Instructies: Simpsons Ride VS Minion Mayhem - Which One Wins (Mei 2024).