MenuBar의 메뉴에서 배경색 변경 (Flex 4.6)

Question

Flex에서는 스파크 스킨이 훌륭합니다. 구성 요소를 사용자 정의하는 데 몇 분이 걸립니다. Mx 구성 요소는 처리하기가 매우 어렵습니다. Menubar 구성 요소의 메뉴 배경을 변경하는 방법을 이해하는 데 2 ​​일이 걸렸습니다. 그리고 그것을 달성하는 올바른 방법을 찾았을 때 (http://goo.gl/Tu5Wc) 단순히 작동하지 않습니다. 메뉴 배경은 여전히 ​​흰색 이유

<?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" 
       creationComplete="application1_creationCompleteHandler(event)"> 

    <fx:Script> 
     <![CDATA[ 
      import mx.collections.XMLListCollection; 
      import mx.events.FlexEvent; 
      private var menubarXML:XMLList = 
       <> 
        <menuitem label="Client"> 
         <menuitem label="Profile"/> 
         <menuitem label="Documents"/> 
        </menuitem> 
        <menuitem label="Others"> 
         <menuitem label="Profile"/> 
         <menuitem label="Documents"/> 
        </menuitem> 
       </>; 
      [Bindable] 
      public var menuBarCollection:XMLListCollection; 
      protected function application1_creationCompleteHandler(event:FlexEvent):void 
      { 
       menuBarCollection = new XMLListCollection(menubarXML); 

      } 

     ]]> 
    </fx:Script> 

    <fx:Style> 
     @namespace mx "library://ns.adobe.com/flex/mx"; 
     mx|MenuBar.myStyle { 
      backgroundColor: #ff0000; 
     } 
    </fx:Style> 
    <mx:MenuBar height="30" labelField="@label" dataProvider="{menuBarCollection}" menuStyleName="myStyle"/> 
</s:Application> 

누군가가 설명 할 수 : 나는 내 문제를 설명하기 매우 쉽게 응용 프로그램을 만들었?

Answer 1

메뉴 모음 itens 렌더링 목록 ... CSS에서 목록과 함께 작동하는 스타일을 설정합니다 (Ctrl + Bar로 표시되지 않음).

mx|MenuBar{ 
    color:#BBBBBB; 
    backgroundColor: #333333; 
    contentBackgroundColor: #333333; 
} 

그냥! 쉽습니다. D

Answer 2

당신은 ...는 CSS를 작성하고 현재 프로젝트에서 그 사용에 대한 링크는 다음

... 그것을 위해

http://examples.adobe.com/flex2/consulting/styleexplorer/Flex2StyleExplorer.html

선택 메뉴 모음을 CSS를 변경하고 만들기를 시작 할 수 있습니다 자기 스타일. 내가 함께 제공된 솔루션 : 여기

Answer 3

- .. 또한 또 다른 구성 요소의 스타일을 유용 것이다

는 좋은 하루 되세요.

난 맞춤 MenuItemRenderer을 생성하고, 함수의 updateDisplayList I는 다음 행 덧붙여

 this.graphics.clear(); 
     this.graphics.beginFill(BACKGROUND_COLOR); 
     this.graphics.drawRect(-1, -1, unscaledWidth +1, unscaledHeight+2); 
     this.graphics.endFill(); 

     if (Menu(listData.owner).isItemHighlighted(listData.uid)) { 
      this.graphics.clear(); 
      this.graphics.beginFill(0xb4c5d6); 
      this.graphics.drawRect(0,0, unscaledWidth -2, unscaledHeight-1); 
      this.graphics.endFill();   
     } 

첫 번째 부분 위에 효과 롤 배경 및 초이다.

그때 나는 단순히 표준 MenuBar 구성 요소를 확장하고 다음과 같이 getMenuAt 기능을 오버라이드 (override) :

override public function getMenuAt(index:int):Menu 
    { 
     var menu:Menu = super.getMenuAt(index); 
     menu.itemRenderer = new ClassFactory(CustomMenuItemRenderer); 
     return menu; 

    } 

는 아마 가능 최선의 해결책은 아니지만, 내가 가지고 올 수있는 유일한 사람입니다. 더 좋게 만들 수있는 사람의 의견을 듣고 싶습니다.

감사합니다.

Answer 4

나는 더 나은 옵션을 찾았습니다.

내 앱에 mx 목록을 사용하고 있지 않습니다. 당신은 메뉴에 대한이 CSS를 사용하여 상속을 사용할 수 있다고 생각 어쨌든

mx|List 
{ 
    backgroundColor:#666666; 
} 

: 그래서 그냥이를 사용했다.