Eingabehilfen

Inhalt

Flash-Grafikeffekte – Lernhandbuch

Filter mit ActionScript anwenden

In Flash Professional 8 können Sie Filter über die Flash-Benutzeroberfläche oder mit ActionScript, in Flash Basic 8 dagegen nur mit ActionScript anwenden. Sie können jeden Filtereffekt mit ActionScript auf Movieclips, Schaltflächen oder Textfelder anwenden.

Wenn Sie die Filter mit ActionScript auf eine Instanz anwenden, können Sie außerdem einen Verschiebungsmatrixfilter oder einen Convolution-Filter verwenden, die in der Flash-Benutzeroberfläche nicht verfügbar sind. Filter werden auf die Vektordefinitionen angewendet, sodass beim Speichern eines Bitmapbilds in der SWF-Datei keine übermäßig große Datei entsteht. Sie können auch ActionScript schreiben, mit dem Sie einen vorhandenen, bereits auf ein Textfeld, einen Movieclip oder eine Schaltfläche angewandten Filter ändern können.

Vielleicht möchten Sie jetzt einmal selbst versuchen, einen Basisfiltereffekt mithilfe von ActionScript-Code anzuwenden. In der Flash-Dokumentation finden Sie viele Beispiele (siehe die folgende Liste); als Einstieg eignet sich aber das Anwenden eines Geschliffen-Filters. Nachstehend finden Sie ein Beispiel.

So wenden Sie einen Geschliffen-Filter an:
  1. Erstellen Sie ein neues Flash-Dokument mit dem Namen bevel.fla.
  2. Erstellen Sie einen Movieclip, der eine Grafik oder ein Bild enthält, und benennen Sie die Instanz my_mc.
  3. Wählen Sie Bild 1 der Zeitleiste aus, und fügen Sie den folgenden ActionScript-Code hinzu:

    import flash.filters.BevelFilter;
    // einen Bevel-Filter definieren
    var bevel:BevelFilter = new BevelFilter(4, 45, 0x99CCFF, 1, 0x003399, 1, 10, 10, 2, 3);
    // Stärke festlegen
    bevel.strength = 5;
    // den Filter auf my_mc anwenden
    my_mc.filters = [bevel];
    

    Hinweis: Informationen zum Arbeiten mit Paketen, zum Beispiel flash.filters.BevelFilter, finden Sie im folgenden Abschnitt der Flash LiveDocs*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filtereffekte animieren > Filterpakete verwenden.

  4. Wählen Sie Steuerung > Film testen, um das Dokument zu testen.

    Informationen zu den Parametern, die Sie an den Geschliffen-Filter übergeben, finden Sie im folgenden Abschnitt in den Flash LiveDocs*: ActionScript 2.0-Referenzhandbuch > ActionScript-Klassen > BevelFilter (flash.filters.BevelFilter).

Das Anwenden anderer Filter mithilfe von Code erfolgt praktisch auf die gleiche Weise. Einige Filter benötigen jedoch unterschiedliche Informationen, wenn Sie den Filter anwenden. Für den Farbmatrixfilter ist beispielsweise ein Array erforderlich. Mit dem Farbmatrixfilter können Sie die Helligkeit einer Instanz ändern wie im folgenden Beispiel zu sehen.

So wenden Sie einen Farbmatrixfilter an:
  1. Erstellen Sie ein neues Flash-Dokument, und speichern Sie es unter dem Namen brightness.fla.
  2. Fügen Sie Bild 1 der Zeitleiste den folgenden ActionScript-Code hinzu:

    import flash.filters.ColorMatrixFilter;
    System.security.allowDomain("http://www.helpexamples.com/");
    var mcl_obj:Object = new Object();
    mcl_obj.onLoadInit = function(target_mc:MovieClip):Void {
      var myElements_array:Array = [1, 0, 0, 0, 100,
          0, 1, 0, 0, 100,
          0, 0, 1, 0, 100,
          0, 0, 0, 1, 0];
      var myColorMatrix_filter:ColorMatrixFilter = new ColorMatrixFilter(myElements_array);
      target_mc.filters = [myColorMatrix_filter];
    }
    this.createEmptyMovieClip("img_mc", this.getNextHighestDepth());
    var img_mcl:MovieClipLoader = new MovieClipLoader();
    img_mcl.addListener(mcl_obj);
    img_mcl.loadClip("http://www.helpexamples.com/flash/images/image2.jpg", img_mc);
    

    Mit diesem Code wird ein JPEG-Bild mithilfe einer MovieClipLoader-Instanz dynamisch geladen. Nachdem das Bild vollständig geladen und auf der Bühne positioniert wurde, wird die Helligkeit der Instanz mit einem Farbmatrixfilter auf 100 % eingestellt.

    Weitere Informationen zum Farbmatrixfilter finden Sie im folgenden Abschnitt in den Flash LiveDocs*: ActionScript 2.0-Referenzhandbuch > ActionScript-Klassen > ColorMatrixFilter (flash.filters.ColorMatrixFilter).

  3. Wählen Sie Steuerung > Film testen, um das Dokument zu testen.

    Nachdem Sie einen Filter angewendet haben, können Sie ihn mithilfe von ActionScript bearbeiten, zum Beispiel die Eigenschaften anpassen oder den Filter animieren. Weitere Informationen finden Sie in den folgenden Abschnitten: Filtereigenschaften mit ActionScript anpassen und Filter mit ActionScript animieren.

    Hinweis: Es gibt zwei zusätzliche Filter, die Sie mithilfe von ActionScript-Code anwenden können, die aber nicht in der Flash-Benutzeroberfläche verfügbar sind: dies sind der Convolution-Filter und der Verschiebungsmatrixfilter. Informationen zu diesen Filtern finden Sie im folgenden Abschnitt in den Flash LiveDocs*:

    • Der Convolution-Filter (ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Convolution-Filter)

    • Der Verschiebungsmatrixfilter (ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2 erstellen > Filter mit ActionScript verwenden > Der Verschiebungsmatrixfilter)

Beispiele für die Anwendung dieser Filter mit ActionScript-Code finden Sie in den folgenden Abschnitten in den Flash LiveDocs*:

  • Der Weichzeichnen-Filter*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Weichzeichnen-Filter
  • Der Schlagschatten-Filter*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Schlagschatten-Filter
  • Der Glühen-Filter*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Glühen-Filter
  • Glühen-Effekt mit Farbverlauf erstellen*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Glühen-Effekt mit Farbverlauf erstellen
  • Der Geschliffen-Filter*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Geschliffen-Filter
  • Geschliffen-Effekt mit Farbverlauf anwenden*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Geschliffen-Effekt mit Farbverlauf anwenden
  • Der Farbmatrixfilter*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Farbmatrixfilter
  • Der Convolution-Filter*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Convolution-Filter
  • Der Verschiebungsmatrixfilter*: ActionScript 2.0 in Flash – Arbeitshandbuch > Animationen, Filter und Zeichnungen in ActionScript 2.0 erstellen > Filter mit ActionScript verwenden > Der Verschiebungsmatrixfilter

Mehrere Filter mit ActionScript anwenden

Sie können über Standard-ActionScript-Aufrufe mit der Eigenschaft MovieClip.filters auf das Array mit den auf ein Objekt angewendeten Filtern zugreifen. Damit wird ein Array zurückgegeben, das jedes derzeit mit dem Movieclip verknüpfte Filterobjekt enthält. Indem Sie mehr als einen Filter zum Filter-Array eines Objekts hinzufügen, können Sie mehrere Effekte anwenden. Die Effekte werden in der Reihenfolge, in der sie im Array aufgelistet sind, angewendet.

Zu beachten ist dabei, dass die Filter beim Festlegen der Eigenschaft filters dupliziert und nicht als Verweis gespeichert werden (siehe folgendes Beispiel). Beim Beziehen der Eigenschaft filters wird eine neue Kopie des Arrays zurückgegeben. Ein Nachteil dieses Ansatzes ist, dass der folgende Code nicht funktioniert:

// dies funktioniert nicht
my_mc.filters[0].push(myFilter);

Da das vorherige Codefragment eine Kopie des Filterarrays zurückgibt, wird das Duplikat modifiziert. Im folgenden Beispiel wird ein Weichzeichnen-Filter am Ende der vorhandenen Filterliste eines Objekts hinzugefügt:

// dies funktioniert:
import flash.filters.BlurFilter;
var filterList:Array = myClip.filters;
filterList.push(new BlurFilter(3,3,2));
myClip.filters = filterList;

Der Vorteil dabei ist, dass Sie die Filter von einem Objekt kopieren, bearbeiten und auf ein anderes Objekt anwenden können, ohne dass die Filter des Originalobjekts verändert werden.

Filtereigenschaften mit ActionScript anpassen

Sie können über Standard-ActionScript-Aufrufe mit der MovieClip.filters-Eigenschaft auf das Array mit den auf ein Objekt angewendeten Filtern zugreifen. Indem Sie mehr als einen Filter zum Filter-Array eines Objekts hinzufügen, können Sie mehrere Effekte anwenden. Die Filter werden in der Reihenfolge, in der sie im Array aufgelistet sind, angewendet. Damit wird ein Array zurückgegeben, das jedes derzeit mit dem Movieclip verknüpfte Filterobjekt enthält. Für jeden Filter gibt es eine Gruppe einmaliger Eigenschaften. Sie können auf jeden Filter wie auf ein normales Array-Objekt zugreifen und diesen ändern. Allerdings wird beim Beziehen und Festlegen von Filtern mit der Eigenschaft filters kein Verweis auf die Filter, sondern ein Duplikat dieser zurückgegeben.

Beim Festlegen der Eigenschaft filters werden die Filter dupliziert und nicht als Verweis gespeichert (siehe folgendes Beispiel). Beim Beziehen der Eigenschaft filters wird eine neue Kopie des Arrays zurückgegeben. Auf diese Weise können Sie die Filter von einem Objekt kopieren, bearbeiten und auf ein anderes Objekt anwenden, ohne dass die Filter des Originalobjekts verändert werden. Ein Nachteil dieses Ansatzes ist, dass der folgende Code nicht funktioniert:

// funktioniert nicht
my_mc.filters[0].blurX = 20;

Da das vorherige Codefragment eine Kopie des Filterarrays zurückgibt, wird das Duplikat modifiziert. Um die Eigenschaft blurX zu ändern, müssen Sie stattdessen den folgenden ActionScript-Code verwenden:

// funktioniert
var filterList:Array = my_mc.filters;
filterList[0].blurX = 20;
my_mc.filters = filterList;

Im folgenden Beispiel wird eine Bilddatei anhand der aktuellen Position des Mauszeigers auf der Bühne weichgezeichnet. Wenn der Mauszeiger horizontal oder vertikal bewegt wird, werden die Eigenschaften blurX und blurY des Weichzeichnen-Filters entsprechend geändert.

So passen Sie die Filtereigenschaften eines Movieclips an:
  1. Erstellen Sie ein neues Flash-Dokument, und speichern Sie es unter adjustfilter.fla.
  2. Fügen Sie Bild 1 der Zeitleiste den folgenden ActionScript-Code hinzu:

    import flash.filters.BlurFilter;
    // einen neuen Movieclip namens holder_mc erstellen
    var holder_mc:MovieClip = createEmptyMovieClip("holder_mc", 10);
    // einen verschachtelten Movieclip namens img_mc erstellen
    holder_mc.createEmptyMovieClip("img_mc", 20);
    // ein Bild in img_mc laden
    holder_mc.img_mc.loadMovie("http://www.helpexamples.com/flash/images/image2.jpg");
    // Weichzeichnen-Filter anwenden
    holder_mc.filters = [new BlurFilter(10, 10, 2)];
    // Movieclip auf der Bühne positionieren
    holder_mc._x = 75;
    holder_mc._y = 75;
    // Weichzeichnen-Filter beim Bewegen der Maus anpassen
    holder_mc.onMouseMove = function() {
      var tempFilter:BlurFilter = holder_mc.filters[0];
      tempFilter.blurX = Math.floor((_xmouse / Stage.width) * 255);
      tempFilter.blurY = Math.floor((_ymouse / Stage.height) * 255);
      holder_mc.filters = [tempFilter];
    };
    
    Der vorstehende Code ist in drei Abschnitte unterteilt. Der erste Abschnitt importiert die flash.filters.BlurFilter-Klasse, damit Sie beim Verweisen auf die BlurFilter-Klasse nicht den vollqualifizierten Namen verwenden müssen. Der zweite Codeabschnitt erstellt zwei Movieclips und lädt eine Bilddatei in einen der verschachtelten Clips. Der dritte Codeabschnitt reagiert auf die Mausbewegung auf der Bühne und passt den Weichzeichnungseffekt entsprechend an.
  3. Wählen Sie Steuerung > Film testen, um das Flash-Dokument zu testen. Wenn Sie den Mauszeiger entlang der X-Achse bewegen, wird die Eigenschaft blurX des Weichzeichnen-Filters geändert. Durch Verschieben des Mauszeigers entlang der Y-Achse wird die Eigenschaft blurY des Weichzeichnen-Filters geändert. Je näher sich der Mauszeiger an der oberen linken Ecke der Bühne befindet, desto geringer ist der auf den Movieclip angewendete Weichzeichnungseffekt.