1 Reply Latest reply on Jan 19, 2011 6:52 AM by _spoboyle

    Menu seperator color in flex4

    siva murugan Level 1

      Hai Every one,

       

                          I need one help...How to set menu seperator color..My codings are below,

       

      <mx:XML format="e4x" id="myMenuData">
      
      <root>
      
      <menuitem label="Create Model Manually" icon="myTopIcon" />
      
      <menuitem type="separator"/> 
      
      <menuitem label="Copy Model" icon="myTopIcon" />
      
      <menuitem type="separator"/>
      
      
      </root>
      
      </mx:XML>
      
      then i create one function..
      
      
      
      private function createAndShow():void
      
      {
      
      
      myMenu.setStyle( "selectionColor" , "#f69401" );
      
      myMenu.setStyle( "menuseparator" , "#f69401" );
      }
      
      In above coding MenuSeparator color are not working...how its write an menuseparator color ...
      
      Thanks in advance,
      Sivamurugan.A

        • 1. Re: Menu seperator color in flex4
          _spoboyle Level 4

          taking the adobe Menu example

           

          Main.mxml

           

          <?xml version="1.0" encoding="utf-8"?>
          <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
                         xmlns:s="library://ns.adobe.com/flex/spark"
                         xmlns:mx="library://ns.adobe.com/flex/mx">
             
              <fx:Script>
                  <![CDATA[
                      import mx.controls.Alert;
                      import mx.controls.Menu;
                      import mx.events.MenuEvent;
                     
                      private var point1:Point = new Point();
                      private var myMenu:Menu;
                     
                      // Create and display the Menu control.
                      private function showMenu():void {
                          myMenu = Menu.createMenu(panel, myMenuData, false);
                          myMenu.setStyle("separatorSkin", MyMenuSeparator);
                          myMenu.labelField = "@label";
                          myMenu.addEventListener(MenuEvent.ITEM_CLICK, menuHandler);
                         
                          // Calculate position of Menu in Application's coordinates.
                          point1.x = myButton.x;
                          point1.y = myButton.y;
                          point1 = myButton.localToGlobal(point1);
                         
                          myMenu.show(point1.x + 25, point1.y + 25);
                      }
                     
                      // Event handler for the Menu control's change event.
                      private function menuHandler(evt:MenuEvent):void  {
                          Alert.show("Label: " + evt.item.@label, "Clicked menu item");
                      }
                  ]]>
              </fx:Script>
             
              <fx:Declarations>
                  <fx:XML id="myMenuData">
                      <root>
                          <menuitem label="MenuItem 1" eventName="copy"/>
                          <menuitem type="separator"/>
                          <menuitem label="MenuItem 2" eventName="paste"/>
                          <menuitem type="separator"/>
                      </root>
                  </fx:XML>
              </fx:Declarations>
             
              <s:Panel id="panel"
                       title="Halo Menu Control Example"
                       width="75%" height="75%"
                       horizontalCenter="0" verticalCenter="0">
                  <s:VGroup left="10" right="10" top="10" bottom="10">
                      <s:Label width="100%" color="blue"
                               text="Click the button to open the Halo Menu control."/>
                     
                      <s:Button id="myButton" label="Open Menu" click="showMenu();"/>
                  </s:VGroup>
              </s:Panel>
             
          </s:Application>

           

          MyMenuSeparator.mxml

          <s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" >
              <!-- layer 1: line -->
              <s:Rect left="0" right="0" top="1" height="1" >
                  <s:fill>
                      <s:SolidColor color="0xff0000" alpha="1.0" />
                  </s:fill>
              </s:Rect>
             
          </s:Skin>