Eigenschappen van Symbolen en Instances (Properties)

uit de cursus HTML5 Canvas in Animate CC: JavaScript Basics

Eigenschappen van Symbolen en Instances (Properties)
5 (100%) 1 stem[men]

Hallo vreemdeling,

wat leuk dat je onze site bezoekt. Bekijk gerust een paar video's en als het je bevalt kun je altijd abonnee worden.

Automatisch afspelen

Geef een reactie of stel een vraag

Geef een reactie

Registreer als je wilt reageren.

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

HTML5 Canvas in Animate CC: JavaScript Basics

perm_identity Belinda | video_library 31 video's | query_builder 2:04:51

Interactieve animaties met geavanceerde tekentools

In Adobe Animate CC kun je interactieve HTML5 publicaties maken met behulp van het zogeheten Canvas-element. Het programma biedt standaard een aantal codefragmenten aan waarmee je heel snel een interactieve animatie of -infographic kunt maken. Met de nadruk op interactief, want daarvoor gebruik je de zogeheten Code Snippets.

In deze online cursus leer je met duidelijke instructievideo’s hoe je de standaard codefragmenten (Code Snippets) van Animate CC kunt toepassen in jouw publicatie. De cursus is juist speciaal ontwikkeld voor mensen die geen kennis van JavaScript of andere codetalen hebben.

Aan het creëren van de animaties zelf wordt geen aandacht besteed, dus kennis van de applicatie Adobe Animate CC is wel een vereiste. In deze cursus werk je met voorbereidde bestanden. Al kun je natuurlijk de kennis ook direct gaan toepassen in een eigen productie.

Je leert hoe je met de codefragmenten van het programma zowel gebruikers- als tijdsgebeurtenissen activeert. Dus je creëert interactiviteit op basis van een muisklik of als de bezoeker met de muis ergens overheen beweegt (user-event). Of zodra de animatie een bepaald punt in de tijd heeft bereikt (tijd-event). Je kunt dan interacties maken als:
• Animaties opstarten en stoppen
• Illustraties verplaatsen, roteren en positioneren
• Illustraties in- en uitfaden
• Tekst in beeld tonen
• De cursor van uiterlijk doen veranderen

 

 

We hebben nu zelf alle objecten die we willen animeren.

Of voorzien van interactiviteit.

Duidelijke en herkenbare namen meegegeven aan de symbolen en de instantienamen.

Maar wat zou er gebeuren als je dat niet doet?

Als je een object selecteert dat geen symbool is en dus ook geen instantienaam heeft.

Dan zal Animate het object zelf gaan converteren naar een symbool en een instantienaam geven.

Ik laat het zien.

Dit object, de laag Background' is nog niet omgezet naar een symbool.

Ik kies uit het venster 'Code Snippets' voor het codefragment ‘Click to Go to Frame and Play’.

Dat is een JavaScript-opdracht waarmee ik de achtergrond interactief kan maken.

Ik dubbelklik op het codefragment.

Een waarschuwingsvenster verschijnt.

Hierin geeft Animate aan dat het object eerst omgezet moet worden in een Movie Clip.

Anders kun je er geen codefragment aan verbinden. Ik klik op OK.

Het actions-venster wordt automatisch geactiveerd.

Die klik ik nu weg want dat behandel ik pas in het volgende hoofdstuk.

Ik wil dat je ziet dat er in de bibliotheek een nieuw symbool is toegevoegd.

Deze heet ‘Symbol ’.

Zorg dat je opnieuw de achtergrond selecteert in het werkgebied.

In het eigenschappen-venster ‘Properties’ staat dat het object een Movie Clip is.

En dat de instantienaam van ‘Symbol ’, ‘movieClip_’ is.

Als alle objecten deze automatische naamgevingen zouden krijgen.

Dan wordt een project onleesbaar.

Ook nu kan ik de naamgeving nog wijzigen.

Klik met de rechtermuisknop ingedrukt op het symbool in de bibliotheek.

En kies uit het contextuele menu voor ‘Properties’.

Wijzig de huidige naam in bijvoorbeeld 'Background'.

Kopieer de naam met Commando C en klik op OK.

Ga dan met de cursor in het veld van de instantienaam staan.

Selecteer de huidige naam en plak daarin de nieuwe naam met Commando V.

Dus mocht het een keer gebeuren dat een object toch door Animate is omgezet naar een symbool.

En wil je de naamgeving hiervan wijzigen.

Dan kan dat dus op deze manier.

Je zult zien dat goede en herkenbare naamgevingen aan symbolen en instantienamen.

Het werken met scripts straks veel makkelijker en overzichtelijker maakt.