Comment créer un fond d'écran de tuiles en flex?

Question

J'essaie de faire du papier peint de tuiles en flex. J'ai étiré ou normal d'utiliser backgroundSize comme 100% et "auto". Mais je n'ai aucune idée sur la façon de créer des tuiles.

Quelqu'un peut-il m'aider avec la source, l'instruction ou le meilleur serait un code source.

Cordialement Zeeshan

Answer 1

Création d'un carrelage dans backgound Flex 3 ne sont pas disponibles par l'utilisation de styles CSS ou styles de propriété.

Cependant, il est possible simplement en affectant à votre composant un habillage programmatique personnalisé, qui gère le dessin de l'image en mosaïque en utilisant les données bitmap brutes.

Permettez-moi d'illustrer davantage mon point avec un code

<mx:Canvas borderSkin="{TiledBackgroundSkin}" 
    width="100%" height="100%"> 
</mx:Canvas> 

C'est votre composant avec une peau de frontière programmatique appliquée.

Maintenant vous venez de créer cette enveloppe en étendant la classe RectangularBorder. Tels que:

public class TiledBackgroundSkin extends RectangularBorder 
{ 
    [Bindable]  
    [Embed(source='tile.jpg')] 
    private var tileImageClass :Class; 
    private var tileBitmapData :BitmapData; 

    public function TiledBackgroundSkin() 
    { 
     super(); 
     createBitmap() 
    } 

    /** A private method that handles the drawing of the bitmap **/ 
    private function createBitmap():void 
    { 
     var backgroundImage:Bitmap = new tileImageClass(); 
     tileBitmapData = new BitmapData(backgroundImage.width,backgroundImage.height); 
     tileBitmapData.draw(backgroundImage); 
    } 

    /** Override updateDisplayList to draw the Tiled Background **/ 
    override protected function updateDisplayList( unscaledWidth:Number,unscaledHeight:Number):void 
    { 
     super.updateDisplayList(unscaledWidth,unscaledHeight); 
     graphics.clear(); 
     graphics.beginBitmapFill(tileBitmapData); 
     graphics.drawRect(0,0,unscaledWidth,unscaledHeight); 
     graphics.endFill(); 
    }  
} 

Le constructeur crée l'image bitmap pour le carrelage.

Ensuite, la méthode updateDisplayList (appelée après la création initiale et pour les redimensionnements suivants du composant) remplit tout le composant avec l'arrière-plan mosaïque.

Si vous souhaitez ajuster le positionnement de décalage de l'image en mosaïque, vous le feriez dans la méthode updateDisplayList