5 Replies Latest reply on Aug 31, 2009 1:51 AM by Shivik

    Changing font style for the top menu in MenuBar?

    Shivik Level 1

      Hello all

       

      I have created a MenuBar in flex 3.4 with the following structure....

       

      screenshot1.jpg

       

      Now what I want to do is to change the font-style of just the top menu, not the sub-menu. Like for example, displaying "Home", "Menu1", "Menu2" in a bigger font-size than the submenu items.

       

      Can that be done?

       

      Thanks and Regards

      Vikram

        • 1. Re: Changing font style for the top menu in MenuBar?
          _Natasha_ Level 4

          Hi,

           

          I'm not sure, but as a variant.

          There is a style property fontFamily. You need to change it to change a font in menubar.

           

          Also there is a style property menuStyleName. Create a style for Menu controls and set it. By default they use the same font.

          • 2. Re: Changing font style for the top menu in MenuBar?
            Shivik Level 1

            @ Natasha

             

            Changing the property fontStyle or using the menuStyleName would change the style for all of the Menu items.

             

            What I want to do is to change the font-style of the top menu only not the submenu items.

             

            Thanks and Regards

            Vikram

            • 3. Re: Changing font style for the top menu in MenuBar?
              Barna Biro Level 3

              Not sure about this but did you try paying around with the menuStyleName property? You can specify a custom CSS style for just the menu ( in theory ). I'm saying "in theory" because I didn't test this myself. If that does not work then check out the language reference: http://www.cs.vu.nl/~eliens/imm/assets/flex3/langref/mx/controls/MenuBar.html and make sure that you took all the possibilities into consideration.

               

              If no default property helps, then you might need to extend the MenuBar and implement the desired functionality yourself ( but I do think that there is a default property for this just that you need to read the language reference carefully ).

              1 person found this helpful
              • 4. Re: Changing font style for the top menu in MenuBar?
                _Natasha_ Level 4

                I've tested. It's work.

                /* CSS file */

                Menu.test

                {

                fontFamily: Candara;

                fontWeight: bold;

                }

                 

                <mx:MenuBar menuStyleName="test" labelField="@label" fontFamily="Arial">

                <mx:dataProvider>

                <mx:XMLList>

                <item label="Test1">

                <item label="Test2"/>

                </item>

                </mx:XMLList>

                </mx:dataProvider>

                </mx:MenuBar>

                 

                If you change a font in MenuBar, it will change also in Menu. You need to set different font in style for menu to override it.

                • 5. Re: Changing font style for the top menu in MenuBar?
                  Shivik Level 1

                  @ Barna Biro

                  Thanks for your help. I tried using the menuStyleName and while playing around with I did run along the exact thing that I wanted to do.

                   

                  @ Natasha

                  Your code explains why my code displayed what it did when I was playing around with menuStyleName.

                   

                  menuStyleName defines the style for the menu items (the contents of dataProvider) which will be displayed in the MenuBar.

                  After defining the menuStyleName, if we also specify a style for MenuBar, then that changes only the top menu.

                   

                  It is more of a workaround .... but it certainly works in this case.

                   

                  Thanks and Regards

                  Vikram