Turning a GUI component's class on and off

[josh]

Hi,
I want to do something similar to what was suggested at https://forum.foleysfinest.com/t/making-components-leave-the-layout-when-invisible/132

That is, I have some classes defined in magic.xml. I want to be able to turn a component’s class on and off at run-time, in response to someone clicking a button on the interface.

What would be the line(s) of code in the PluginProcessor.cpp to add or remove a named GUI class from a GUI element?

Thanks!

[daniel]

I tried this quickly.
The flex grow set to 0 does not always work, because of the order the class is applied. If the node already sets a grow, the class has no chance to change that.
However, I used max-height sucessfully.

• First I added a ToggleButton and added a new value, here “UI:hideKeyboard”
• Then I created a class called “hidden”. Connect the class: active property to the “UI:hideKeyboard”.
• For good measure I set max-width, max-height and flex-grow to 0.
• applied the class to the component I wanted to hide

Unfortunately the change to the class didn’t work immediately, so I had to force a rebuild of the GUI in the menu: File → Refresh.

Now the checkbox can switch the keyboard on and off

Let me know if that works for you

[josh]

That worked! I hadn’t noticed the active property of a class before.
I’ve now extended this so that there are two Views, with the second View hidden (and not taking up blank space on the interface). If the user clicks a button, the first View gets hidden and the second View is revealed.
This is a precursor to getting the JUCE tutorial JUCE: Tutorial: Unlock your plugins through online registration working with PGM. Hopefully, the next step, getting JUCE’s OnlineUnlockForm as a custom GUI component, won’t be too difficult. If you’ve got any ideas there, though, that would be great.
Thanks again.

[pRicky187]

Hi, I’m not seeing ‘value’ in the ToggleButton. Would that be the same as 'Property? I have tried adding to the ‘property’ ‘UI::hideKeyboard’ but that doesn’t work either.

Thanks

[jos]

This is not working for me either. Does it depend on a recent change?
I’m using the latest develop branch as of July 7, after main was merged into it that day.
Below is my failing test layout. The toggle button has no effect. What am I missing?

<?xml version="1.0" encoding="UTF-8"?>

<magic>
  <Styles>
    <Style name="default">
      <Nodes/>
      <Classes>
        <hidden flex-grow="0" active="HideEditor">
          <media max-height="0" max-width="0"/>
        </hidden>
      </Classes>
      <Palettes>
        <default/>
      </Palettes>
    </Style>
  </Styles>
  <View>
    <View flex-direction="column" caption="Hide Test">
      <View>
        <View/>
        <ToggleButton text="Hide Editor View" property="Effects"/>
        <View/>
      </View>
      <View>
        <View caption="Editor View" class="hidden"/>
        <View caption="Performance View"/>
      </View>
    </View>
  </View>
</magic>

[daniel]

There are two errors in that XML, which might be a typo:

1. first the property in the ToggleButton and the active property in the class “hidden” should have the same name
2. the media tag in the class “hidden” constrains this class to certain view sizes.
   By setting max-width and max-height to 0 this class will never have an effect.
   It might be the editors fault to set it to zero instead of leaving it empty.

I am creating an UnitTest to validate

[jos]

Thanks! I definitely misunderstood. Now my simple test works.

[ashay]

Is there an issue with setting the visibility to false by default? I have the logic of toggling between views based on a combo box and the chosen value during run time, but the default does not seem to listen. I have it in prepareToPlay() as well as in the constructor, and the method for when the parameter is changed.

Following is what I have to change between views:

magicState.getPropertyAsValue("Views:Whelen").setValue(true);
magicState.getPropertyAsValue("Views:Two-Tone").setValue(false);

But using these lines in prepareToPlay or the constructor does not seem to set the default view in PGM. The two views (Whelen and Two-Tone) are set in a parent container view and their display is “contents”, so I can switch one view off for another when the combo box parameter is changed (from Whelen to Two-Tone).

But when the plugin first loads with Whelen as default, the Two-Tone view still overlaps on top of it until I click the combo box to trigger the view for Two-Tone to be visible.

Basically, there are two views - the first one is the default view when the plugin loads, but the other view is still visible on top of the first view even though I’ve set its visibility to false. This only happens when the plugin first loads.

Is there something I’m missing so I can have the default to be Whelen with the other view to be not visible?