BitmapImage的不可见部分

时间:2012-08-06 22:03:44

标签: flex adobe bitmapimage rect

我有一个SkinnableContainer,它包含s:BitmapImage。我需要图像的一部分(Rect)完全透明。只需做一个透明的切口,这很容易定位。 背景中的图像是width =“300”height =“200”,透明区域应该是width =“200”height =“20”并且right =“0”bottom =“50”。我设法用BlendMode.OVERLAY实现了类似的效果,但我相信必须有更好的方法。

有任何想法,建议吗?

2 个答案:

答案 0 :(得分:0)

您可以将另一个对象(如UIMovieClip)作为蒙版应用于图像。您还可以操纵位图的像素并将其设置为BitmapImage的源。根据您的具体要求,这可能有意义也可能没有意义。

答案 1 :(得分:0)

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" 
               creationComplete="onComplete(event)"
               backgroundColor="0xEEEEEE">
    <fx:Script>
        <![CDATA[
            import mx.events.FlexEvent;
            import mx.graphics.ImageSnapshot;
            import mx.skins.RectangularBorder;      

            protected function onComplete(event:Event):void
            {
                var bW:int = 300;
                var bH:int = 200;

                var X:int = 0;
                var Y:int = 150;
                var W:int = 200;
                var H:int = 20;

                var topRect:Rectangle = new Rectangle(0,0,bW,Y);

                var righRect:Rectangle = new Rectangle(W,0,bW-W,bH);

                var bottomRect:Rectangle = new Rectangle(0,Y+H,bW,bH-(Y+H));

                var targetBitmapData:BitmapData = ImageSnapshot.captureBitmapData(original);

                var newBitmapData:BitmapData = new BitmapData(bW,bH,true,0x00000000);

                newBitmapData.copyPixels(targetBitmapData, topRect, new Point(0, 0),null, null, true);

                newBitmapData.copyPixels(targetBitmapData, righRect, new Point(W, 0),null, null, true);

                newBitmapData.copyPixels(targetBitmapData, bottomRect, new Point(0,Y+H),null, null, true);

                modified.source = new Bitmap(newBitmapData);
            }                   
        ]]>
    </fx:Script>
    <s:VGroup gap="10" left="10" top="10">
        <s:Group id="original">
            <s:Rect width="300" height="200">
                <s:fill>
                    <s:SolidColor/>
                </s:fill>
                <s:stroke>
                    <s:SolidColorStroke color="0xFF0000"/>
                </s:stroke>
            </s:Rect>
        </s:Group>
        <s:Group>
            <mx:Image width="300" height="200" id="modified" />
            <s:Rect top="0" left="0" right="0" bottom="0">
                <s:stroke>
                    <s:SolidColorStroke color="0xFF0000"/>
                </s:stroke>
            </s:Rect>
        </s:Group>          
    </s:VGroup>
</s:Application>

您特定情况的一个示例,也许您会扩展它。