Handboek Annuleren

Interactiviteit toevoegen met codefragmenten in Animate

 

Met het deelvenster Codefragmenten kunnen degenen die niet bekend zijn met programmeren, toch snel aan de slag met JavaScript en ActionScript 3.0. In dit deelvenster kunt u -code toevoegen aan uw FlA-bestand en zo veelgebruikte functionaliteit toevoegen. Om het deelvenster Codefragmenten te gebruiken hebt u geen kennis van JavaScript of ActionScript 3.0 nodig.

Met het deelvenster Codefragmenten kunt u de volgende taken uitvoeren:

  • Code toevoegen die invloed heeft op het gedrag van een object in het werkgebied.

  • Code toevoegen die de beweging bepaalt van de afspeelknop op de tijdlijn.

  • (alleen CS5.5) - Code toevoegen die gebruikersinteractie via een aanraakscherm mogelijk maakt.

  • Nieuwe door u gemaakte codefragmenten toevoegen aan het deelvenster.

Met de codefragmenten die zijn meegeleverd met Animate, kunt u ook op een eenvoudige manier meer te weten te komen over JavaScript of ActionScript 3.0. Door de code in de fragmenten te bekijken en de instructies over de fragmenten te volgen, raakt u vertrouwd met de codestructuur en de begrippen die worden gebruikt.

Optie Codefragmenten in Animate
Optie Codefragmenten in Animate

Voordat u begint

Het is belangrijk dat u de volgende grondbeginselen van Animate begrijpt als u met het deelvenster Codefragmenten werkt:

  • Bij veel van de codefragmenten moet u een aantal elementen van de code aanpassen. In Animate doet u dit in het deelvenster Handelingen. Elk fragment bevat specifieke instructies hiervoor.

  • Alle voorbeelden bevatten ofwel JavaScript- of ActionScript 3.0-code.

  • Sommige fragmenten hebben invloed op het gedrag van een object, zodat op het object kan worden geklikt of waardoor het wordt verplaatst of verdwijnt. U kunt deze fragmenten toepassen op het object in het werkgebied.

  • Sommige fragmenten zorgen ervoor dat een actie onmiddellijk wordt uitgevoerd zodra de afspeelknop zich bevindt in een frame waar het fragment deel van uitmaakt. Deze fragmenten past u toe op een tijdlijnframe.

  • Wanneer u een codefragment toepast, wordt de code aan het huidige frame van de laag Handelingen in de tijdlijn toegevoegd. Als u zelf geen laag Handelingen hebt gemaakt, voegt Animate boven alle andere lagen op de tijdlijn een laag toe.

  • Aan een object moet in Eigenschapcontrole een instantienaam worden toegewezen, zodat ActionScript het object in het werkgebied kan beheren.

  • U kunt klikken op de knoppen Beschrijving tonen en Code tonen. Deze knoppen verschijnen als u een fragment selecteert in het deelvenster.

Een codefragment toevoegen aan een object of tijdlijnframe

Een actie toevoegen die invloed heeft op een object of de afspeelknop:

  1. Selecteer een object in het werkgebied of een frame op de tijdlijn.

    Als u een object selecteert dat geen symboolinstantie is, wordt het object door Animate geconverteerd naar een filmclipsymbool als u het fragment toepast.

    Als u een object selecteert dat niet al een instantienaam heeft, wordt er door Animate een instantienaam toegevoegd als u het fragment toepast.

  2. Dubbelklik in het deelvenster Codefragmenten (Venster > Codefragmenten) op het fragment dat u wilt toepassen.

    Als u een object in het werkgebied hebt geselecteerd, wordt het fragment door Animate aan het deelvenster Handelingen toegevoegd voor de frames die het geselecteerde object bevatten.

    Als u een tijdlijnframe hebt geselecteerd, wordt het fragment door Animate alleen aan dat frame toegevoegd.

  3. Bekijk de zojuist toegevoegde code in het deelvenster Handelingen en volg de instructies boven aan het fragment om zo nodig elementen te vervangen.

Codefragmenten in deelvenster Handelingen

Nieuwe fragmenten toevoegen in het deelvenster Codefragmenten

U kunt op twee manieren nieuwe codefragmenten toevoegen aan het deelvenster Codefragmenten:

  • Door een fragment in te voeren in het dialoogvenster Nieuw codefragment maken.

  • Door een XML-bestand met het codefragment te importeren.

Het dialoogvenster Nieuw codefragment maken gebruiken:

  1. Kies in het menu van het deelvenster Codefragmenten de optie Nieuw codefragment maken.

  2. Geef in het dialoogvenster de titel, de knopinfotekst en de JavaScript- of ActionScript 3.0-code voor uw fragment op.

    Klik op de knop Automatisch vullen om de code toe te voegen die op dat moment is geselecteerd in het deelvenster Handelingen.

  3. Schakel het selectievakje Automatisch instance_name_here·vervangen·in·als·uw·code·de·tekenreeks·"instance_name_here" bevat en als u wilt dat deze tekenreeks door Animate automatisch wordt vervangen door de juiste instantienaam wanneer het fragment wordt toegepast.

    Het nieuwe fragment wordt door Animate toegevoegd aan de map Aangepast in het deelvenster Codefragmenten.

Een codefragment in XML-indeling importeren:

  1. Kies in het menu van het deelvenster Codefragmenten de optie XML van codefragmenten importeren.

  2. Selecteer het XML-bestand dat u wilt importeren en klik op Openen.

Kies in het deelvenstermenu de optie XML van codefragmenten bewerken om de juiste XML-indeling voor codefragmenten weer te geven.

Als u een codefragment wilt verwijderen, klikt u met de rechtermuisknop op het fragment in het deelvenster en selecteert u Delete Code Snippet (Codefragment verwijderen) in het contextmenu.

Interactieve animaties met HTML5

Bepaalde animaties vereisen codefragmenten voor ondersteuning op verschillende publicatieplatforms. Wilt u weten hoe u codefragmenten kunt gebruiken om de animatie interactief te maken? Bekijk de zelfstudie aan het einde van dit voorbeeld en voer de volgende stappen uit.

  1. Klik in Bibliotheek op Publicatie-instellingen.

  2. Selecteer JavScript/HTML.

  3. Klik op het tabblad HTML/JS op Exporteren en kies de volgende opties:

    • Bestandsnaam: Typ de naam van het bestand.
    • Opslaan als type: Selecteer HTML.
  4. Klik op OK.

Interactieve HTML5-animaties verbeteren

Bekijk de video om te zien hoe u de codes bewerkt.

Krijg sneller en gemakkelijker hulp

Nieuwe gebruiker?