Simple ComboBox Tick Replacement

General JUCE discussion
1

Hey jucers,

 

I'd like to replace the 'tick' on the ComboBox class with a custom image.

I have attempted to add a StringArray list to a Popup menu, and ->addItems to that popupmenu including the image I wanted to use, and then passed that popupmenu to the comboBox using the .addItemsToMenu function. However considering this is a virtual function, it doesn't seem to be the right approach.

Thoughts on the most straightforward way of doing this?

 

Thanks so much,
B

2

Have a look at the "Look and Feel" classes:

https://www.juce.com/doc/structComboBox_1_1LookAndFeelMethods

You inherit this, override the methods you want to change (i.e. https://www.juce.com/doc/structComboBox_1_1LookAndFeelMethods#ae43e629153160f3ff1ddacbad9430fb7 ). Then you set an instance of your look and feel class either to that component or to the parent component as defaultLookAndFeel.

You can use the original drawing code as a starting point: https://github.com/julianstorer/JUCE/blob/master/modules/juce_gui_basics/lookandfeel/juce_LookAndFeel_V2.cpp#L1114

HTH, daniel

3

Thanks for the response Daniel,

 

The tick is part of the popup menu class, which is inherited by the comboBox class. Would I set a popup menu lookAndFeel and set that to the ComboBox as well? I spent a bit of time on it yesterday and it seems to go beyond a typical LookAndFeel use case.

 

If anyone else reading this has replaced the 'tick' graphic in the ComboBox class, please let me know your method of doing so.

 

Thanks,
B

4

Ok, I see. The Combobox doensn't inherit the popup menu, but it is created in the showPopup method: https://www.juce.com/doc/classComboBox#a46d401e92f606ef7ffa081d5e0bdb609

This is virtual so that you can override it with your own custom popup mechanism if you need some really unusual behaviour.

But the popup menu takes the default look and feel, so either alter that one, or override this: https://github.com/julianstorer/JUCE/blob/536ca6cedf7b3e373778f653da9e0c1a8e3438b2/modules/juce_gui_basics/widgets/juce_ComboBox.cpp#L531

void ComboBox::showPopup() 
{ 
    PopupMenu menu; 
    menu.setLookAndFeel (&getLookAndFeel()); 
    addItemsToMenu (menu); 
    menu.showMenuAsync (PopupMenu::Options().withTargetComponent (this) 
                                            .withItemThatMustBeVisible (getSelectedId()) 
                                            .withMinimumWidth (getWidth()) 
                                            .withMaximumNumColumns (1) 
                                            .withStandardItemHeight (label->getHeight()), 
                        ModalCallbackFunction::forComponent (comboBoxPopupMenuFinishedCallback, this)); 
}

I just followed getLookAndFeel(), I think you can simply alter the void LookAndFeel_V2::drawPopupMenuItem as well, the drawing is done here:

https://github.com/julianstorer/JUCE/blob/536ca6cedf7b3e373778f653da9e0c1a8e3438b2/modules/juce_gui_basics/lookandfeel/juce_LookAndFeel_V2.cpp#L977

So it's the same look and feel you set for the ComboBox...

Good Luck,

daniel

 

5

Thanks for taking the time to look into this Daniel. I will let you know my results. :)

6

I'm looking forward to it. I'm just starting to style my plugin, so reading how the details of look and feel work was not that altruistic at all ;-)

7

For posterity: inherit from LookAndFeel and override getTickShape

class MyLookAndFeel : public juce::LookAndFeel_V4
{
    juce::Path getTickShape(float height) override;
};
3 Likes
8

but I believe the OP needed to replace it with an image

1 Like