Flex已禁用复选框工具提示

时间:2013-02-25 15:58:26

标签: flex checkbox tooltip parent-child disabled-control

我需要能够在禁用复选框上显示工具提示。我在stackoverflow和其他地方看到的解决方案是将复选框包装在一个Group中,并为Group提供toollTip。这有效,但我一直试图这样做。

我希望能够在自定义Checkbox组件上设置属性,并在此时将Chexbox包装在具有toolTip设置的组中。

我的问题是,我无法弄清楚如何在Checkbox ActionScript代码中在运行时将Checkbox添加到Group组件。我已经尝试将一个showDisabledToolTip属性添加到Checkbox类中,并在设置时执行以下操作:

var parent = this.parent;
    var gp:Group = new Group();
    gp.toolTip = this.toolTip;
    gp.addElement(this);
    if(parent is Group) {
        parent.addElement(gp);
    } else {
        parent.addChild(gp);
    }

我的主要问题是this.parent为null。除此之外,我甚至不知道这是否真的有用。

帮助表示赞赏。谢谢!

1 个答案:

答案 0 :(得分:0)

我提出扩展CheckBox类的解决方案并创建一个新的CheckBoxSkin,里面有2个新的SkinStates(disabledWithTooltip和disabledWithTooltipSelected)

扩展的Checkbox类添加了一个新的disabledWithTooltip属性,并覆盖了来自ButtonBase的getCurrentSkinState方法和mouseEventHandler

自定义CheckBox类


package components
{

    import flash.events.Event;
    import flash.events.MouseEvent;

    import mx.events.FlexEvent;

    import spark.components.CheckBox;

    [SkinState (disabledWithToolTip)]
    [SkinState (disabledWithToolTipSelected)]

    public class CustomCheckBox extends CheckBox
    {
        private var _disabledKeepToolTip:Boolean = false;

        public function CustomCheckBox()
        {
            super();
            this.addEventListener(FlexEvent.CREATION_COMPLETE, onCreationComplete, false, 0, true);
        }

        protected function onCreationComplete(ev:FlexEvent):void {
            //_storedState = this.currentState;
        }


        protected override function getCurrentSkinState():String {
            if(!_disabledKeepToolTip)
                return super.getCurrentSkinState();
            else {
                if(!selected)
                    return "disabledWithToolTip";
                else 
                    return "disabledWithToolTipSelected";
            }
        }

        protected override function mouseEventHandler(event:Event):void {
            var skinState:String = getCurrentSkinState();

            if(skinState != "disabledWithToolTip" && skinState != "disabledWithToolTipSelected") {
                super.mouseEventHandler(event);
            }
        }
        [Bindable]
        [Inspectable(category="General", enumeration="true,false", defaultValue="true")]
        public function get disabledKeepToolTip():Boolean {
            return _disabledKeepToolTip;
        }

        public function set disabledKeepToolTip(value:Boolean):void {

            _disabledKeepToolTip = value;

            this.invalidateSkinState();
        }

    }
}

基于(spark)CheckBoxSkin创建一个新的Skin并更改元数据中的hostcomponent

  

[HostComponent( “components.CustomCheckBox”)]

并添加两个新的skinStates

<s:State name="disabledWithToolTip" stateGroups="disabledStates" />
<s:State name="disabledWithToolTipSelected" stateGroups="disabledStates, selectedStates" />

用法,例如

<s:HGroup>
    <components:CustomCheckBox id="custom_chk" label="KeepTooltipCheckbox" skinClass="skins.CustomCheckBoxSkin" toolTip="See this tooltip"/>
    <s:CheckBox id="enable_chk" label="enable/disable" change="{custom_chk.disabledKeepToolTip = enable_chk.selected}"/>
</s:HGroup>

如果不同,你必须调整自己的包结构......