如何在flex中創建瓷磚牆紙？

Question

我想在flex中製作瓷磚牆紙。我確實拉伸或正常使用backgroundSize爲100％和「自動」。但我不知道如何創建瓷磚。

人可以幫我帶源，指令或最好將是一個源代碼。

問候 Zeeshan

Answer 1

創建Flex 3中的瓷磚backgound無法通過使用CSS樣式或財產的風格。

但是，可以簡單地通過分配您的組件自定義程序的皮膚，它通過使用原始位圖數據處理平鋪圖像的繪製。

讓我進一步說明了一些代碼

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

這是適用於它的綱領性邊框外觀的組件我的觀點。

現在您只需通過擴展RectangularBorder類來創建該邊框蒙皮。 如：

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(); 
    }  
} 

構造爲平鋪創建位圖圖像。

然後，方法的updateDisplayList （初始創建後和用於所述部件的隨後的調整大小調用）填充與平鋪背景的整個組件。

如果您希望調整平鋪圖像的偏移位置，您可以在updateDisplayList方法