Aktions-Editor

Das Popupfenster für Aktionen wurde zur Verbesserung der Benutzerfreundlichkeit für Designer neu gestaltet. Mit dem verbesserten Aktions-Editor muss weniger Code geschrieben werden, sodass Interaktivität leichter hinzugefügt werden kann. Der neue Aktions-Editor erleichtert Designern das Erstellen präziser Animationen, indem Zeit- und Arbeitsaufwand optimiert werden. Sie können Objekte hinzufügen und JavaScript-Aktionen konfigurieren, um ereignisbasierte Elemente in der Animation zu erstellen.

Der neue Aktions-Editor führt Sie visuell durch die verschiedenen Schritte zum Zuweisen von Aktionen zu Zielen. Mit dem Aktions-Editor können Sie ereignisbasierte JavaScript-Aktionen hinzufügen und die Ziele im gleichen Fenster auswählen.

Im neuen Code-Editor werden Aktionen jetzt in zwei einfachen Schritten den Elementen hinzugefügt:

  1. Wählen Sie eine Aktion aus: Wenn Sie den Namen der Aktion kennen, können Sie die Aktion mit dem Suchfeld suchen. Andernfalls wählen Sie eine Kategorie, um die entsprechenden Aktionen anzuzeigen, und klicken Sie auf die gewünschte Aktion.
  2. Wählen Sie ein Ziel aus: Ziele sind unter „Bühne“ gruppiert.
    1. Klicken Sie auf „Bühne“, um die Zielelemente anzuzeigen.
    2. Doppelklicken Sie auf das Zielelement.

Hinweis: Wenn Sie auf „Bühne“ klicken und die Komposition Symbole enthält, wird möglicherweise die Unterkategorie „Symbole“ angezeigt. Weitere Informationen zu Symbolen finden Sie unter Erstellen von verschachtelten Animationen mit Symbolen.

Die Aktionen werden unter den folgenden Kategorien zusammengefasst:

  • Seitenebene
  • Kompositionsebene
  • Klicken
  • Maus
  • Berühren
  • Wischen
  • Zeitleiste 
  • Symbol

 

 

Im folgenden Beispiel erfahren Sie mehr zum Hinzufügen von Aktionen zu einem Element.

  1. Angenommen, das Textelement „Hello“ wird auf einem Ellipsenelement angezeigt.

  2. Um den Text zu ändern, klicken Sie auf der Zeitleiste neben dem Textelement auf „{}“. Wählen Sie „click“.

    • Wählen Sie als Aktion „Text“ aus. Als entsprechende Unteraktion wird in der angrenzenden Spalte „Text ändern“ angezeigt.
    • Wählen Sie als Ziel „Bühne“ aus. Doppelklicken Sie in der angrenzenden Spalte auf das Ziel-Textelement und wählen Sie es aus.

  3. Der entsprechende JavaScript-Code wird im Codeeditor angezeigt. Ändern Sie den Text „NewText“ im Code in „Hello World“.

  4. Schließen Sie das Code-Popupfenster. Drücken Sie Strg+Eingabe, um die Änderungen anzuzeigen. Als Text wird „Hello World“ angezeigt.

Der Aktions-Editor bietet außerdem die folgenden Verbesserungen, um die Erstellung komplexer Animationen zu erleichtern und zu beschleunigen:

  • Audio hinzufügen: Sie können Ihrer Animation Audio hinzufügen. Weitere Informationen finden Sie unter Audio zu Animationen hinzufügen.
  • Video hinzufügen: Sie können Ihrer Animation Video hinzufügen. Weitere Informationen finden Sie unter Einbinden von Videos in Animationen.
  • Hyperlinks zu DPS-Artikeln hinzufügen: Sie können Hyperlinks zu den Elementen einer Komposition hinzufügen, die auf Adobe DPS-Artikel verweisen. Weitere Informationen finden Sie unter Hyperlink-Elemente für Adobe DPS-Artikel.
  • Codefragmente hinzufügen: Wenn Sie Codeteile häufig verwenden, speichern Sie den Code als Fragmente. Diese können Sie mit einem einzigen Mausklick einfügen und nach Bedarf ändern.

Codefragmente

Klicken Sie im Aktions-Editor neben „Meine Codefragmente“ auf „+“ und dann auf eine der folgenden Optionen:

  • Neu erstellen

Klicken Sie auf diese Option, um Ihren eigenen Code einzugeben und als Codefragment zu speichern. Wenn Sie auf diese Option klicken, wird ein Codefenster angezeigt. Geben Sie Ihren Code ein, klicken Sie auf „Speichern“ und geben Sie einen Namen für das Codefragment ein.

  • Aus Auswahl hinzufügen

Klicken Sie auf diese Option, um den ausgewählten Teil des Codes als Codefragment zu speichern. Geben Sie im Aktions-Editor einen Namen für das Codefragment ein (zum Beispiel „MySnippet_1“). Sie können dieses Codefragment auswählen, um dem entsprechenden Element eine Aktion hinzuzufügen.

 

Codefragmente einfügen

  1. Klicken Sie im Codefenster des Aktions-Editors auf die Stelle, an der Sie das Codefragment einfügen möchten.
  2. Klicken Sie auf „Meine Codefragmente“.
  3. Wählen Sie das gewünschte Fragment aus der Liste aus („MySnippet_1“ in der Abbildung). Das gespeicherte Codefragment wird an der Einfügemarke in den Code eingefügt.

Adobe-Logo

Bei Ihrem Konto anmelden