4 Replies Latest reply on Oct 16, 2009 1:27 PM by jdesko

    Tooltip for disabled button?

    Handycam Level 1

      I have a typical spark button:

      <s:Button id="shareBtn" label="Share" skinClass="skins.StandardButtonSkin" 
      click="shareme(event)" enabled="{menuList.length()>0}" toolTip="Share This with a Friend" />

      It correctly changes its state to enabled/disabled.


      I would like to display a different tooltip, such as

       toolTip.disabled="You need to add some items first"

      But, of course the main app does not have a disabled state, so this fails.


      I realize I could add a tooltip.disabled at the skin level, but I need to customize the message since the button is used in many places.  Ideas?

        • 1. Re: Tooltip for disabled button?
          jdesko Level 2

          Just a thought, can you put the button in a group and put a tooltip on the group?

          • 2. Re: Tooltip for disabled button?
            Handycam Level 1

            Maybe, but then I'd need to disable/enable the group too.

            • 3. Re: Tooltip for disabled button?
              David_F57 Level 5

              having a flexible tooltip isn't the problem disabled components recieve no input from the mouse so there is no way to display a tip. the only way is to have a button skin that looks disabled but isn't.


              So you need a custom button that instantiates another variable i.e. secondTooltip:String


              So the skin needs a new state "fakedisable" to then show the second tooltip, Of course you need to ignore the click event if currentstate is fakedisable.



              • 4. Re: Tooltip for disabled button?
                jdesko Level 2

                One way that I do it is below.  This is a custom component that from my app I can call  setButtonToolTip() which sets the group (holding the button) tooltip (below I am using an FXG icon for the psuedo button).  The group doesn't have to be enabled or disabled because of the button being enabled or not. 




                <s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo"









                private var buttonToolTip:String;


                public function setButtonToolTip(thisToolTip:String):void


                buttonToolTip = thisToolTip;





                <s:VGroup id="cancelButton_Group"

                  width="25" height="25"



                  mouseOver="cancelButton_icon.scaleX=0.8, cancelButton_icon.scaleY=0.8"

                  mouseOut="cancelButton_icon.scaleX=1.0, cancelButton_icon.scaleY=1.0"


                <icons:XCancel id="cancelButton_icon"/>