如何在ActionScript 3中检测可以填充位图的区域?

时间:2011-01-07 03:07:30

标签: flash actionscript-3 actionscript flex4

我需要能够检测类似于着色书图片的填充区域。用户将在需要填充的区域内单击。图像是用户创建的位图内容,因此必须在运行时检测填充区域。

<fx:Script>
    <![CDATA[
        protected function myImage_clickHandler(event:MouseEvent):void
        {
            myImage.imageDisplay.bitmapData.floodFill(event.localX,event.localY,0xFFFFFF);
        }
    ]]>
</fx:Script>

<s:Image id="myImage" click="myImage_clickHandler(event)" source="/images/square.gif"/>

2 个答案:

答案 0 :(得分:2)

听起来你正在寻找Flood Fill算法。

答案 1 :(得分:2)

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/BitmapData.html?filter_coldfusion=9&filter_flex=3&filter_flashplayer=10&filter_air=1.5#floodFill%28%29

mouseX和mouseY始终是鼠标位置向任何对象添加一个单击侦听器,只需使用mouseX / mouseY,或者使用MouseEvent的event.localX和event.localY作为侦听器附加到的对象

<mx:Image id="myImage" click="(myImage.content as Bitmap).bitmapData.floodFill(event.localX,event.localY,0xFFFFFF)" source="http://www.carolynsbloomingcreations.com/images/square.gif"/>

如果您使用Flex 4.5 Hero框架,这是一个解决方案,否则我无法通过BitmapImage获取bitmapData的句柄,上述解决方案仍适用于Flex 3或4:

<?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" minWidth="955" minHeight="600" xmlns:local="*">
    <s:layout>
        <s:VerticalLayout/>
    </s:layout>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

    <!--
    <mx:Image
        id="myImage"
        click="(myImage.content as Bitmap).bitmapData.floodFill(event.localX,event.localY,0xFFFFFF)"
        source="http://www.carolynsbloomingcreations.com/images/square.gif"/>
    -->
    <fx:Script>
        <![CDATA[
            private function handleClick(event:MouseEvent):void
            {
                trace('test');
                var tempData:BitmapData = new BitmapData(myBitmapImage.width,myBitmapImage.height);
                tempData = myBitmapImage.bitmapData;

                var localPoint:Point = container.globalToLocal(new Point(mouseX,mouseY));
                tempData.floodFill(localPoint.x,localPoint.y,0xFFFFFFFF);
                myBitmapImage.source = tempData;
                trace(localPoint.x + ":" + localPoint.y);
            }
        ]]>
    </fx:Script>
    <s:Group
        id="container"
        click="handleClick(event)">
        <s:BitmapImage
            id="myBitmapImage"
            source="@Embed('square.gif')" />
    </s:Group>


</s:Application>

即使他们在4.5框架中暴露了bitmapData,它也是只读的,所以我不得不复制它并将其重新分配给似乎有效的源