Getting ToolTips For a ButtonBar and ViewStack

When you have a ViewStack as the dataProvider for your NavBar (ButtonBar, ToggleButtonBar, TabBar etc.), the toolTips of the ViewStack’s children should automatically be the toolTips for the Buttons in your navigation bar. For example, if you have a ToggleButtonBar like this:

<mx:ToggleButtonBar id=”tbb3″ dataProvider=”{vs2}” />
<mx:ViewStack id=”vs2″ height=”200″ width=”220″>
<mx:Canvas id=”c51″ label=”Flash” backgroundColor=”0xFF0000″ toolTip=”red” />
<mx:Canvas id=”c52″ label=”DreamW” backgroundColor=”0x00FF00″ toolTip=”green” />
<mx:Canvas id=”c53″ label=”ColdFusion” backgroundColor=”0x000FF0″ toolTip=”blue” />
</mx:ViewStack>

You should see the toolTip “red” when you mouse over the “Flash” button, “green” when you mouse over the “DreamW” button etc.

However, as someone reported on flexcoders last week, this is does not work if you set the toolTips in the ViewStack children dynamically at runtime. This is discussed in Flex Bug SDK-12183. To work around this bug, you need to reset the toolTips of your navigation bar’s children after you set the toolTips for the ViewStack children. I’ve provided an example below.

Demo : tbbExample.swf

Example Code: tbbExample.mxml

10 responses

  1. Hi, I am having a similar run time problem with icons and a buttonBar. Is it possible that the Flex Bug you describe also applies to the icon property? I attempted to use your solution with changes for icons, but that didn’t solve my problem either….
    I’m using CentOS 4.3 with apache Tomcat 5.5.23 and Flex 2.0. I create a ButtonBar in my main.mxml file with a dataProvider that is an array of java Objects. Each Object has an icon, a label, and a toolTip among other things. The Adobe LiveDocs for ButtonBar says, “You can also populate the dataProvider property with an Array of Objects; where each object can have up to three fields: label, icon, and tooltip.” (See
    http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Book_Parts&file=controls_059_08.html)
    I have those fields. The label and toolTip work great, but no icon is displayed. For the icon I’ve tried…
    (1) in the java Object:
    @Embed(source=’someSwfFile.swf’, symbol=’SomeButton’)

    or

    (2) in the main.mxml file:
    [Bindable]
    [Embed(source=’someSwfFile.swf’, symbol=’SomeButton’)]
    public var SomeButtonCls:Class;
    and then
    setting the icon in the java object to SomeButtonCls

    Nothing works. Any help would be greatly appreciated!
    Thanks,
    Josephine

  2. I am able to get a ButtonBar to work with icons that are set through a dataProvider at runtime. For your first solution, this wouldn’t work because the icons are not really getting embedded at compile time using this code. For icons to work, the assets must be embedded at compile time. I am not sure why your second case doesn’t work. It should. Here is some code that I tried and it works. I am not using a java object, but a simple AS array that gets set as the dataProvider at runtime:

    http://butterfliesandbugs.bravehost.com/bbExample.mxml

  3. Thanks for your reply! I have posted to SO many forums and you are the first person to respond. I really appreciate it! It does seem like I’m doing everything right. It is VERY frustrating!! The 1 thing I noticed that is different between your example and mine (besides yours not being in java objects) is that your example doesn’t use symbols….Could that be a factor?

  4. The symbol should not matter. Since your icons should be embedded in your Application and your data is coming from an outside source, I think you need to somehow link your incoming data to point to the classes of icons you’ve embedded. I’m not sure I explained this well, so I’ve modified the above example to pull in data using an HTTPService. Here is the link to the sample:

    http://butterfliesandbugs.bravehost.com/bbExample2.swf
    http://butterfliesandbugs.bravehost.com/bbExample2.mxml
    http://butterfliesandbugs.bravehost.com/data.xml

  5. If I do
    Button(someButtonBar.getChildAt(childNum)).setStyle(“icon”, SomeButtonCls);
    it works great! But, when I encapsulate them all in the switch statement, none of them get set….Are you sure
    switch (someButtonBar.getItemAt(childNum).icon)
    is correct? Can you put an icon as the expression in a switch statement? If it worked for you, why won’t it work for me??? Arg. I’m so frustrated. BUT, I really appreciate your help! I’ve been banging my head against the wall for TOO long with this one. But, I guess I’ll keep banging until I figure this stupid switch statement out.

  6. switch(dpCollection.getItemAt(childNum).icon) in the switch statement should work to get the value of the “icon” property in your data. Notice that this statement is getting the item in your dataProvider, its not a getItemAt for your ButtonBar (which is what it looks like you are doing.

  7. Oh my goodness! You are right! That worked!!! Thank you SO much for all your help!!!!!

  8. Great! I’m glad to see this is all sorted out.

  9. By the way, this bug will be fixed in our next release of Flex. I confirmed it last week 🙂

  10. TO: jlafferty

    Thank you! This has really helped me out. I was having a problem creating button bars at runtime with icons. Using your suggestion I created a class with static constants that hold all my embedded icons (so they can be compiled) and then I assign the icons at runtime to the ButtonBar’s dataProvider icon property. Works like a charm.

    IE: icon=IconCache.ADD_ICON or icon=IconCache.CLOSE_ICON .. you get the idea.

    Thanks! – Kevin

Leave a reply to jlafferty Cancel reply