Erstellen von Texturen mit Störungsfunktionen

Flash Player 9 und höher, Adobe AIR 1.0 und höher

Wenn Sie das Erscheinungsbild einer Bitmapgrafik ändern möchten, können Sie mithilfe der noise() -Methode oder der perlinNoise() -Methode einen Störungseffekt auf die Bitmap anwenden. Ein Störungseffekt kann mit den statischen Störungen bei einem auf keinen Sender eingestellten Fernseher verglichen werden.

Mithilfe der noise() -Methode können Sie einen Störungseffekt auf eine Bitmap anwenden. Mit dieser Methode wird ein zufällig gewählter Farbwert auf die Pixel in einem angegebenen Bereich eines Bitmapbilds angewendet.

Bei dieser Methode können die folgenden fünf Parameter angegeben werden:

  • randomSeed (int): Der zufällig gewählte Anfangswert, mit dem das Muster festgelegt wird. Trotz des Namens werden mit gleichbleibendem Anfangswert immer die gleichen Ergebnisse generiert. Tatsächliche Zufallswerte können mithilfe der Math.random() -Methode generiert werden, mit der ein Zufallswert an diesen Parameter übergeben wird.

  • low (uint): Dieser Parameter verweist auf den niedrigsten zu generierenden Wert für jedes Pixel (0 bis 255). Der Standardwert ist 0. Mit einem niedrigen Wert wird ein dunkles Störungsmuster generiert und mit einem höheren Wert ein helleres Muster.

  • high (uint): Dieser Parameter verweist auf den höchsten zu generierenden Wert für jedes Pixel (0 bis 255). Der Standardwert ist 255. Mit einem niedrigen Wert wird ein dunkles Störungsmuster generiert und mit einem höheren Wert ein helleres Muster.

  • channelOptions (uint): Mit diesem Parameter wird der Farbkanal des Bitmap-Objekts angegeben, auf den das Störungsmuster angewendet wird. Die Zahl kann eine beliebige Kombination der vier Farbkanäle für die ARGB-Werte sein. Der Standardwert ist 7.

  • grayScale (Boolean): Wenn dieser Parameter auf true gesetzt ist, wird der randomSeed -Wert auf die Pixel des Bitmapbilds angewendet. Dabei wird alle Farbe aus dem Bild entfernt. Dieser Parameter wirkt sich nicht auf den Alphakanal aus. Der Standardwert lautet false .

Im folgenden Beispiel wird ein Bitmapbild erstellt, auf das ein blaues Störungsmuster angewendet wird:

package 
{ 
    import flash.display.Sprite; 
    import flash.display.Bitmap; 
    import flash.display.BitmapData; 
    import flash.display.BitmapDataChannel; 
 
    public class BitmapNoise1 extends Sprite 
    { 
        public function BitmapNoise1() 
        { 
            var myBitmap:BitmapData = new BitmapData(250, 250,false, 0xff000000); 
            myBitmap.noise(500, 0, 255, BitmapDataChannel.BLUE,false); 
            var image:Bitmap = new Bitmap(myBitmap); 
            addChild(image); 
        } 
    } 
}

Wenn Sie eine naturgetreuere Textur erstellen möchten, verwenden Sie die perlinNoise() -Methode. Mit der perlinNoise() -Methode können realistische, naturgetreue Texturen erstellt werden, die sich optimal für Rauch, Wolken, Wasser, Feuer oder auch Explosionen eignen.

Die perlinNoise() -Methode wird mit einem Algorithmus generiert und belegt daher weniger Speicherplatz als bitmapbasierte Texturen. Vor allem auf älteren Computern kann sie sich jedoch auf die Prozessorauslastung auswirken, sodass der Inhalt beeinträchtigt wird und die Objekte auf dem Bildschirm mit einer unter der Bildrate liegenden Rate neu gezeichnet werden. Dies ist hauptsächlich auf die Gleitkommaberechnungen zurückzuführen, die für die Verarbeitung der Perlin-Störungsalgorithmen durchgeführt werden müssen.

Bei dieser Methode können die folgenden neun Parameter angegeben werden (die ersten sechs sind obligatorisch):

  • baseX (Number): Legt den x-Wert (Größe) der erstellten Muster fest.

  • baseY (Number): Legt den y-Wert (Größe) der erstellten Muster fest.

  • numOctaves (uint): Anzahl der Oktaven bzw. der einzelnen Störungsfunktionen, die zur Erstellung der Störung kombiniert werden. Je höher die Anzahl der Oktaven, desto größer die Detailtreue der erstellten Bilder, desto länger jedoch auch die Verarbeitungszeit.

  • randomSeed (int): Der zufällig gewählte Anfangswert entspricht dem in der noise() -Funktion. Tatsächliche Zufallswerte können mithilfe der Math.random() -Methode generiert werden, mit der ein Zufallswert an diesen Parameter übergeben wird.

  • stitch (Boolean): Wenn dieser Parameter auf true gesetzt ist, werden die Übergänge des Bilds geglättet, um einen nahtlosen Texturenübergang für Füllmuster zu erstellen, mit denen Bitmaps gefüllt werden können.

  • fractalNoise (Boolean): Dieser Parameter betrifft die Ränder der mit der Methode generierten Farbverläufe. Wenn der Parameter auf true gesetzt ist, wird eine fraktale Störung generiert, bei der die Ränder geglättet werden. Bei dem Wert false werden Turbulenzen generiert. In einem Bild mit Turbulenzen gibt es sichtbare Bruchstellen in den Farbverläufen, die sich gut für scharf abgegrenzte visuelle Effekte eignen, wie Flammen oder Wellen.

  • channelOptions (uint): Der channelOptions -Parameter entspricht dem in der noise() -Methode. Mit diesem Parameter wird der Farbkanal (der Bitmap) angegeben, auf den das Störungsmuster angewendet wird. Die Zahl kann eine beliebige Kombination der vier Farbkanäle für die ARGB-Werte sein. Der Standardwert ist 7.

  • grayScale (Boolean): Der grayScale -Parameter entspricht dem in der noise() -Methode. Wenn der Parameter auf true gesetzt ist, wird der randomSeed -Wert auf die Pixel des Bitmapbilds angewendet und dabei alle Farbe aus dem Bild entfernt. Der Standardwert lautet false .

  • offsets (Array): Ein Array von Punkten, die dem x- und y-Offset jeder einzelnen Oktave entsprechen. Durch Ändern der Offset-Werte können Sie glatte Ebenenübergänge im Bild erzielen. Jeder Punkt im Offset-Array bezieht sich auf eine bestimmte Oktavenstörungsfunktion. Der Standardwert ist null .

Im folgenden Beispiel wird ein BitmapData-Objekt mit 150 x 150 Pixel erstellt, bei dem durch Aufrufen der perlinNoise() -Methode ein grüner und blauer Wolkeneffekt generiert wird:

package 
{ 
    import flash.display.Sprite; 
    import flash.display.Bitmap; 
    import flash.display.BitmapData; 
    import flash.display.BitmapDataChannel; 
 
    public class BitmapNoise2 extends Sprite 
    { 
        public function BitmapNoise2() 
        { 
            var myBitmapDataObject:BitmapData = 
                new BitmapData(150, 150, false, 0x00FF0000); 
             
            var seed:Number = Math.floor(Math.random() * 100); 
            var channels:uint = BitmapDataChannel.GREEN | BitmapDataChannel.BLUE  
            myBitmapDataObject.perlinNoise(100, 80, 6, seed, false, true, channels, false, null); 
             
            var myBitmap:Bitmap = new Bitmap(myBitmapDataObject); 
            addChild(myBitmap); 
        } 
    } 
}