Custom MenuBar strange behaviour


#1

Hi!

I'm trying to implement my custom menu bar. I created MenuBarComponent object and have set my custom MenuBarModel for it.

For now I want to add some custom look to the menu bar, it's just simple, to change background of item by mouseOver.

I implemented something like that:

void MenuLookAndFeel::drawMenuBarItem (Graphics& g,
                                       int  width,
                                       int  height,
                                       int  itemIndex,
                                       const String& itemText,
                                       bool   isMouseOverItem,
                                       bool   isMenuOpen,
                                       bool   isMouseOverBar,
                                       MenuBarComponent& menuBarComponent)

{
    if (isMouseOverItem)
    {
        g.setColour (Colours::green);
    }
    else
    {
        g.setColour (Colours::red);
    }
    g.fillRect (0, 0, width, height);
    g.setColour (Colours::white);
    g.drawText (itemText, 0, 0, width, height, Justification::centred, false);
}

But all my items (i.e "File", "Edit", "Options" etc.) get filled with this colour, and I want the only one (i.e "File") item will change it's background by mouseOver action.
Would you be so kind to help me to solve that problem? Seem like I'm doing something wrong.

 

Thanks in advance :)


#2

use itemText to know which item you are drawing.


#3

think it will work, thanks! but it looks a bit hardcode...is any elegant solution exists?


#4
By the way, I've tried to implement like this:

void MenuLookAndFeel::drawMenuBarItem (Graphics& g,
                                      int  width,
                                      int  height,
                                      int  itemIndex,
                                      const String& itemText,
                                      bool   isMouseOverItem,
                                      bool   isMenuOpen,
                                      bool   isMouseOverBar,
                                      MenuBarComponent& menuBarComponent)
{
    if (isMouseOverItem)
    {
        g.setColour (Colours::green);
        int itemWidth = 200; // width /menuBarComponent.getModel()->getMenuBarNames().size();
        //int itemX = jmax (0, itemIndex * itemWidth);
        int itemX = 0;
        if (itemText == "Edit")
        {
            itemX = 200;
        }
        else if (itemText == "Options")
        {
            itemX = 400;
        }
        g.fillRect (itemX, 0, itemWidth, height);
    }
    g.setColour (Colours::white);
    g.drawText (itemText, 0, 0, width, height, Justification::centred, false);
}

but still have the same problem! It changes background by mouseOver only for the first item!


#5

You can probably do that without a L&F using:

menuBar.setColour (PopupMenu::highlightedBackgroundColourId, Colours::green);

Rail


#6

Your solution is good, thanks a lot!

I'm just a bit dissapointed with cohesion between MenuBar and PopupMenu.... But I wrote example with solid colours just to test. I need to implement custom menu bar filling with gradients, borders, etc. for real.

Can you help me with it too, please?