How to #3 add your own Components or LookAndFeel

PluginGuiMagic
1

PluginGuiMagic allows you to add your own Components or LookAndFeel methods. This is how it’s done:

First you have to create a little wrapper around your component. This is simply inheriting foleys::GuiItem:

The minimum for the wrapper is to have a member of your component type, call addAndMakeVisible in the constructor and add the macro FOLEYS_DECLARE_GUI_FACTORY that allows the builder to create an instance of your component.

The colour translation and the settableProperties are optional. For more examples have a look into the file General/foleys_MagicJUCEFactories.cpp. This is how all the existing juce components are integrated.

Now you have to change the createEditor class to use the enhanced MagicBuilder:

juce::AudioProcessorEditor* ExtendingExampleAudioProcessor::createEditor()
{
    // MAGIC GUI: we create our custom builder instance here, that will be available for all factories we add
    auto builder = std::make_unique<foleys::MagicGUIBuilder>(magicState);
    builder->registerJUCEFactories();

    builder->registerFactory ("Lissajour", &LissajourItem::factory);

    return new foleys::MagicPluginEditor (magicState, BinaryData::magic_xml, BinaryData::magic_xmlSize, std::move (builder));
}

The next time you start the plugin you will find the company in the list of components that you can drag into the tree or the plugin itself, if “edit” is enabled.

To add your own lookAndFeel class you use the same builder instance in the createEditor():

builder->registerLookAndFeel ("LookAndFeelName", std::make_unique<MyLookAndFeel>());

Now you will find the MyLookAndFeelName in the drop down and you can select it.

I hope that helps, let me know if there are questions.

2

Nicely done. Makes it very easy to add custom components! I’m having one issue though that hopefully you can help me with… I added a custom component and it’s working. However it seems to mess up some things with the FoleysFinest look and feel, which I’m using as a starting point for developing my plugin. In particular my rotary sliders suddenly have a totally different style. Concerned that either I’m not doing something right, or there’s a bug lurking in there somewhere.

I’ve found that I can actually make this happen simply by overriding initializeBuilder and calling uilder.registerJUCEFactories(). i.e. without adding any of my own custom code. I’m attaching screenshots that show how the rotary slider look changes. One other clue is that I can no longer seem to select look and feel anymore when I’m in this state. Hopefully I’m just missing something simple?

ex1
ex11036×1056 101 KB

ex2
ex2994×1066 60.6 KB

3

I am not sure exactly what is happening and what you are trying to do.

But if you are no longer able to select LookAndFeels, maybe when overriding you didn’t add any LookAndFeel?
This is what would happen without overriding:
https://github.com/ffAudio/foleys_gui_magic/blob/main/General/foleys_MagicProcessor.cpp#L66

The example in the above post was when you still needed to create and provide the MagicBuilder in the constructor. Now this happens automatically but with the callback you have the chance to add only those components and LookAndFeels you are going to use.

I hope that helps, let me know if you still have problems or need further explanations.

4

Yep, that solved the problem. Thanks! The ‘ExtendingExample’ project does not have the call to registerJUCELookAndFeels, so I missed that.

5

Good catch, I’ll add that in the next release.
Thanks!