Question

我已经能够使用自定义图像（loading Skin images dynamically）为ToggleButton设置外观并且效果很好。

我想要添加的最后一项功能是将交互性（mouseEvents）限制为不透明像素。我一直在寻找并遇到InteractivePNG和Creating a hitarea for PNG Image with transparent (alpha) regions in Flex。我在初始测试中使用InteractivePNG得到了不稳定的结果，所以我想我会尝试使用第二个链接中的代码定义ToggleButton hitArea属性。

我无法让它发挥作用。我生成Sprite以定义命中区域的代码如下。（我也尝试了一个简单的Sprite，其中有一个矩形。）当我设置togglebutton.hitArea时，我没有得到任何错误，但它不再是交互式的。

是否需要将定义hitArea的Sprite添加到正在应用的对象的DisplayList中？如果是这样，我如何使用ToggleButton的子类？

        hitSprite = createHitArea(upImageData, 1);
        hitSprite.mouseEnabled = false;
        this.hitArea = hitSprite;

当然在ToggleButton上调用`addChild（）会引发错误。

        this.addChild(hitSprite);

我试过了：

将自定义ToggleButton包装在Spark Group中，然后将MX UIComponent包装起来，以便我可以使用SpriteDisplayElement来添加内容 - 但这不起作用。
在我的自定义ToggleButton定义中添加一个Sprite - 并且在执行此操作时出错。

我是否因为这种功能而使用ToggleButton类运气不好？我不明白为什么ToggleButton有一个hitArea属性，如果没有办法设置它 - 但事实并非如此，所以我一定做错了。

更新

我只是尝试了这种方法（Flex 4 Custom Component - How to notify skin of property changes?）绑定到在ToggleButton中创建的SpriteVisualElement - 但仍未成功设置hitArea - ToggleButton或Skin中的任何一个它正在使用。

    public function createHitArea(bitmapData:BitmapData, grainSize:uint=1):SpriteVisualElement
        {   
            var _hitarea:SpriteVisualElement = new SpriteVisualElement();
            _hitarea.graphics.beginFill(0x000000, 1.0);         
            for(var x:uint=0;x<bitmapData.width;x+=grainSize) {
                for(var y:uint=grainSize;y<bitmapData.height;y+=grainSize) {                    
                    if(x<=bitmapData.width && y<=bitmapData.height && bitmapData.getPixel(x,y)!=0) {
                        _hitarea.graphics.drawRect(x,y,grainSize,grainSize);                        
                    }                   
                }
            }           
            _hitarea.graphics.endFill();
            _hitarea.cacheAsBitmap = true;
            return _hitarea;
        }
    ]]>

Answer 1

我对hitArea属性了解不多，但我处理过具有透明度的按钮。我通过在我的按钮皮肤上添加这样的东西来解决这个问题：

    <s:Group id="clickTarget" top="0" left="0" bottom="0" right="0">
        <s:Rect top="0" left="0" bottom="0" right="0">
            <s:fill>
                <s:SolidColor color="0xFFFFFF" alpha="0.01" />
            </s:fill>
        </s:Rect>
    </s:Group>

在Spark ToggleButton上定义hitArea

1 个答案: