在ActionScript 3.5 / Flex中,如何将边框应用于用户单击的任何UI组件或容器?

时间:2012-01-10 22:22:59

标签: css flex events actionscript

我正在开发一个项目,我想在根DisplayObjectContainer中添加一个点击监听器,如果用户点击UIComponent,它将为用户点击的任何内容添加一个红色边框。目前,我这样做的代码看起来像这样:

    private static var _root:DisplayObjectContainer;
    private static var labelStyle:CSSStyleDeclaration;

    public static function initialize(root:DisplayObjectContainer):void
    {
        _root = root;

        labelStyle = new CSSStyleDeclaration();
        labelStyle.setStyle("borderColor", "red");
        labelStyle.setStyle("borderThickness", 4);
        labelStyle.setStyle("color", "red");
        labelStyle.setStyle("borderStyle", "solid");

        StyleManager.setStyleDeclaration(".mystyle", labelStyle, true);
        _root.addEventListener(MouseEvent.CLICK, highlightBorder, true, Infinity, true);
    }

    private static function highlightBorder(event:MouseEvent):void
    {           
        event.stopPropagation();

        if(event.target is UIComponent)
        {
            var tmp:UIComponent = event.target as UIComponent;
            tmp.styleDeclaration = labelStyle;
            tmp.invalidateProperties();
            tmp.invalidateDisplayList();
            tmp.validateNow();
        }
    }

此代码位于.as文件中,而不是.mxml。

不幸的是,实际上什么都没发生。用户点击的UI组件仍然明显无边界。我已经测试了event.target并且相当确定它确实指向了用户点击的UI组件;我还使用了Alerts来确保if语句实际上是完全执行的。

有没有人知道为什么边界不会改变?

1 个答案:

答案 0 :(得分:1)

在UIComponent上使用setStyle方法。因此,不是tmp.styleDeclaration = labelStyle,而是执行类似tmp.setStyle("styleName", "mystyle")的操作,或者跳过CSSStyleDeclaration部分并直接在UIComponent上执行tmp.setStyle("borderColor", "red")等。

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/core/UIComponent.html#setStyle