Showing posts with label selectedindex. Show all posts
Showing posts with label selectedindex. Show all posts

HOW TO: Set Flex MenuBar Currently Selected Item Text Color

Posted by Quinn Madson | Posted in , , | Posted on 7:34 AM

2

Seems like it should be fairly easy to let a user visually know which top level option they are currently under. ...like should be an option or options in Flex CSS.

Here's the best way I found to do it:

 <mx:Script>
<![CDATA[
private function menuHandler(event:MenuEvent):void {

var mb:MenuBar=event.target as MenuBar;
var selectedIndex:int=mb.selectedIndex;

for (var i:int=0;i<mb.menuBarItems.length;i++){
if(i==selectedIndex){
(mb.menuBarItems[i] as MenuBarItem).setStyle("color", "0xff7009");
}
else{
(mb.menuBarItems[i] as MenuBarItem).setStyle("color", "0xffffff");
}
}

if (event.item.@data != "top") {
logicHandler(event.item.@label, event.item.@data);
}
}
]]>
</mx:Script>
<mx:MenuBar id="appMenu"
x="0" y="114" width="100%" height="31"
labelField="@label"
dataProvider="{menuBarCollection}"
itemClick="menuHandler(event);" />

On the currently selected item, the text is set to orange. Everything else is reset to white. Example application.