Editor Azioni

La finestra a comparsa Azioni è stata riprogettata per risultare più intuitiva per i designer. L'editor Azioni avanzato riduce la necessità di scrivere codice, facilitando l'aggiunta di elementi interattivi. Il nuovo editor Azioni è più accessibile per i designer per creare animazioni di precisione, ottimizzare i tempi e l'impegno richiesti. Potete aggiungere oggetti e configurare le azioni JavaScript per creare elementi basati su eventi nelle animazioni.

Il nuovo editor Azioni vi guida visivamente nei vari passaggi da seguire per assegnare le azioni alle destinazioni. L'editor Azioni consente di aggiungere azioni JavaScript basate su eventi e selezionare le destinazioni nella stessa finestra. 

Con il nuovo editor di codice, l'aggiunta di azioni agli elementi può ora essere completata in due semplici passaggi.

  1. Scegliete un'azione - Se conoscete il nome dell'azione, potete cercarla mediante la casella di ricerca. Altrimenti, selezionate una categoria per visualizzare le azioni che contiene e fate clic sull'azione richiesta.
  2. Scegliete una destinazione - Le destinazioni sono raggruppate sotto Stage.
    1. Fate clic su Stage per visualizzare gli elementi di destinazione.
    2. Fate doppio clic sull'elemento di destinazione.

Nota: quando fate clic su Stage, potrebbe essere presente la sottocategoria Simboli se la composizione contiene dei simboli. Per maggiori informazioni sui simboli, consultate Creazione di animazioni annidate con simboli.

Le azioni sono raggruppate nelle seguenti categorie:

  • Livello di pagina
  • Livello di composizione
  • Clic
  • Mouse
  • Tocco
  • Scorrimento
  • Linea temporale 
  • Simbolo

 

 

Per ulteriori informazioni su come aggiungere azioni a un elemento, esaminiamo il seguente esempio.

  1. Considerate un elemento di testo "Hello" visualizzato su un elemento ellisse. 

  2. Per modificare il testo, fate clic su {} accanto all'elemento di testo nella timeline. Selezionate 'click'.

    • Scegliete un'azione: selezionate 'Testo'. 'Cambia testo' è l'azione secondaria corrispondente nella colonna adiacente.
    • Scegliete una destinazione: selezionate 'Stage'. Fate doppio clic e selezionate l'elemento di testo di destinazione nella colonna adiacente.

  3. Il codice corrispondente JavaScript viene visualizzato nell'editor di codice. Modificate il campo "Nuovo testo" in "Hello World" nel codice.

  4. Chiudete la finestra a comparsa del codice. Premete Ctrl + Invio per visualizzare le modifiche. Il testo è visualizzato come "Hello World".

L'editor Azioni offre inoltre i seguenti miglioramenti per aiutarvi a creare animazioni avanzate con maggiore velocità e facilità:

  • Aggiunta di audio: potete aggiungere audio alle animazioni. Per ulteriori informazioni, consultate Aggiungere audio alle animazioni.
  • Aggiunta di video: potete aggiungere video alle animazioni. Per ulteriori informazioni, consultate Aggiungere video alle animazioni.
  • Aggiunta di collegamenti ipertestuali ad articoli DPS: potete aggiungere collegamenti ipertestuali tra gli elementi di una composizione e articoli Adobe DPS. Per ulteriori informazioni, consultate Collegamento ipertestuale di elementi ad articoli Adobe DPS.
  • Aggiunta di snippet di codice: se sono presenti parti di codice che sono utilizzate di frequente, salvate il codice come snippet. Potete inserirli con un singolo clic e modificarli quando e se necessario.

Snippet di codice

Nell'editor Azioni, fate clic sul '+' accanto a Snippet personali, quindi fate clic su una delle seguenti opzioni:

  • Crea nuovo  

Fate clic per inserire un codice personalizzato e salvarlo come snippet. Quando fate clic su questa opzione, viene visualizzata una finestra di codice. Digitate il codice, fate clic su Salva e immettete un nome per lo snippet.

  • Aggiungi nuovo da selezione

Fate clic per salvare come snippet la parte di codice selezionata. Immettete un nome per lo snippet nell'editor Azioni (ad esempio, MySnippet_1). Potete selezionare questo snippet di codice per aggiungere l'azione al relativo elemento.

 

Inserire snippet di codice

  1. Nella finestra del codice dell'editor Azioni, fate clic nel punto in cui desiderate inserire lo snippet di codice.
  2. Fate clic su Snippet personali.
  3. Scegliete lo snippet richiesto dall'elenco (ad esempio, MySnippet_1 come mostrato in figura). Lo snippet salvato viene inserito nel punto di inserimento nella finestra del codice.

Logo Adobe

Accedi al tuo account