2009-12-22 60 views
2

我想在flex中制作瓷砖墙纸。我确实拉伸或正常使用backgroundSize为100%和“自动”。但我不知道如何创建瓷砖。如何在flex中创建瓷砖墙纸?

人可以帮我带源,指令或最好将是一个源代码。

问候 Zeeshan

回答

4

创建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方法