What's the proper way to create a custom colourScheme?

General JUCE discussion
1

Hi,
I’m currently working with the standard LookAndFeel_V4 colourSchemes and was wondering how to create a custom one? I did not find some info on the forum appart from other LookAndFeel discussions.

Let’s say I want to have a custom dark scheme called customDarkScheme, this is what I would do but cannot get it right :

auto customDarkScheme = new LookAndFeel_V4::colourScheme();
LookAndFeel_V4::setColourScheme(customDarkScheme);

customDarkScheme->setUIColour(ColourScheme::UIColour::windowBackground, juce::Colours::yellow);
/** and all the 8 other UIColour */
lookAndFeelChanged();

Is it the way to create a scheme, set as default and assign its UIColours?

I noticed that :
LookAndFeel_V4::getCurrentColourScheme().getUIColour (ColourScheme::UIColour::windowBackground)
This does not return this current scheme particular colour. I think I am missing something about the scheme concept :slight_smile:

Thanks for your help
Damien

2

Hi,
I really struggle to get the setUIColour to update the current custom lookandfeel:

Here’s the way I update the UIColours inside the property fields of my GUI settings: (this is working)


            /** Stores the current LnF ColourScheme **/
            auto* currentLookAndFeel = dynamic_cast<LookAndFeel_V4*>(&getLookAndFeel());
            auto currentLookAndFeelScheme = currentLookAndFeel->getCurrentColourScheme();
            
            /** Updates UIColours  property fields from the current ColourScheme **/
            setProperty(Ids::uiPanelUIColourWindowBackground, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::windowBackground).toString());
            setProperty(Ids::uiPanelUIColourWidgetBackground, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::widgetBackground).toString());
            setProperty(Ids::uiPanelUIColourMenuBackground, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::menuBackground).toString());
            setProperty(Ids::uiPanelUIColourOutline, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::outline).toString());
            setProperty(Ids::uiPanelUIColourDefaultText, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::defaultText).toString());
            setProperty(Ids::uiPanelUIColourDefaultFill, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::defaultFill).toString());
            setProperty(Ids::uiPanelUIColourHighlightedText, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::highlightedText).toString());
            setProperty(Ids::uiPanelUIColourHighlightedFill, (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::highlightedFill).toString());
            setProperty(Ids::uiPanelUIColourMenuText, (String) (String) currentLookAndFeelScheme.getUIColour (ColourScheme::UIColour::menuText).toString());

Capture d’écran, le 2024-02-26 à 00.37.10

And this is how I did my script to update all the uiColours of a given LookAndFeel_V4 and update the look of my project with the new colourScheme :


            auto* customLookAndFeel = dynamic_cast<LookAndFeel_V4*>(&getLookAndFeel());
            auto customLookAndFeelScheme = customLookAndFeel->getCurrentColourScheme();
            
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::windowBackground, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourWindowBackground)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::widgetBackground, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourWidgetBackground)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::menuBackground, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourMenuBackground)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::outline, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourOutline)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::defaultText, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourDefaultText)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::defaultFill, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourDefaultFill)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::highlightedText, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourHighlightedText)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::highlightedFill, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourHighlightedFill)));
            customLookAndFeelScheme.setUIColour(juce::LookAndFeel_V4::ColourScheme::menuText, VAR2COLOUR (owner.getProperty(Ids::uiPanelUIColourMenuText)));

            setLookAndFeel(customLookAndFeel);
            lookAndFeelChanged();

getUIColour() updates properly my fields in my property pane from the current lookandfeel, but when I update them with the colour picker, it’s supposed to trigger the script above when the value change, and the script should set the lookandfeel with the updated UI colours. I pick the colour, the colour updates un the field, but nothing happens with the GUI lookandfeel, window colours, widgets etc stay the same.

getUIColour is ok, but setUIColour doesn’t affect the UI colour, I’m probably missing something important with the whole process.

If someone who’s used to working with the colourScheme subclass could help that would be awesome.
Thanks in advance.
Damien