Control Tabbed Component with Text Buttons

General JUCE discussion
1

Hi. I’m quite new to JUCE and programming, but I’ve recently discovered the way to control TabbedComponent Tabs with Text Buttons. It can be quite useful for UI design if you would like to place some switches in different parts of your plugin. It’s a very primitive code but maybe it will help someone.

in Plugin Editor.h:

/*
  ==============================================================================

    This file contains the basic framework code for a JUCE plugin editor.

  ==============================================================================
*/

#pragma once

#include <JuceHeader.h>
#include "PluginProcessor.h"

//==============================================================================
/**
*/

class SliderTab : public juce::Component {
    public:
    
    SliderTab()
    {
        setSize(100, 100);
        addAndMakeVisible(slider);
        slider.setSliderStyle(juce::Slider::SliderStyle::RotaryHorizontalVerticalDrag);
        slider.setTextBoxStyle(juce::Slider::NoTextBox, true, 0, 0);
        
    };
    
    void resized() override {
        slider.setBounds(10, 10, 100, 100);
    }
    
    private:
    juce::Slider slider;
    

};

class TabsDemoAudioProcessorEditor  : public juce::AudioProcessorEditor
{
public:
    TabsDemoAudioProcessorEditor (TabsDemoAudioProcessor&);
    ~TabsDemoAudioProcessorEditor() override;

    //==============================================================================
    void paint (juce::Graphics&) override;
    void resized() override;
    
    

private:
    // This reference is provided as a quick way for your editor to
    // access the processor object that created it.
    TabsDemoAudioProcessor& audioProcessor;
    
    
    juce::TabbedComponent tabs;
    
    
    juce::TextButton button1 {"Tab 1"};
    juce::TextButton button2 {"Tab 2"};
    
    void setTab1 ();
    void setTab2 ();
    
    JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR (TabsDemoAudioProcessorEditor)
};

in PluginEditor.cpp :

/*
  ==============================================================================

    This file contains the basic framework code for a JUCE plugin editor.

  ==============================================================================
*/

#include "PluginProcessor.h"
#include "PluginEditor.h"


//==============================================================================
TabsDemoAudioProcessorEditor::TabsDemoAudioProcessorEditor (TabsDemoAudioProcessor& p)
: AudioProcessorEditor (&p), audioProcessor (p), tabs(juce::TabbedButtonBar::Orientation::TabsAtTop)
{
    // Make sure that before the constructor has finished, you've set the
    // editor's size to whatever you need it to be.
    setSize (400, 300);
    addAndMakeVisible(tabs);

    tabs.addTab("demo 1", juce::Colours::blue, new Component(), true);
    tabs.addTab("slider", juce::Colours::black, new SliderTab, true );
    
    addAndMakeVisible(button1);
    button1.setSize(100, 50);
    button1.setToggleState(false, juce::NotificationType::dontSendNotification);
    button1.onClick = [this]() {setTab1();};
    
    
    addAndMakeVisible(button2);
    button2.setSize(100, 50);
    button2.setToggleState(false, juce::NotificationType::dontSendNotification);
    button2.onClick = [this]() {setTab2();};
}

TabsDemoAudioProcessorEditor::~TabsDemoAudioProcessorEditor()
{
}

//==============================================================================
void TabsDemoAudioProcessorEditor::paint (juce::Graphics& g)
{
    // (Our component is opaque, so we must completely fill the background with a solid colour)
    g.fillAll (getLookAndFeel().findColour (juce::ResizableWindow::backgroundColourId));

    g.setColour (juce::Colours::white);
    g.setFont (juce::FontOptions (15.0f));
    g.drawFittedText ("Hello World!", getLocalBounds(), juce::Justification::centred, 1);
}

void TabsDemoAudioProcessorEditor::resized()
{
    // This is generally where you'll want to lay out the positions of any
    // subcomponents in your editor..
    
    tabs.setBounds(0, 0, 400, 200);
    button1.setBounds(10, 225, 200, 50);
    button2.setBounds(210, 225, 200, 50);
    
}

void TabsDemoAudioProcessorEditor::setTab1()
{
    auto active = tabs.getCurrentTabIndex();
    if (active >= 0) {
        active = 0;
        tabs.setCurrentTabIndex(active);
    }
};

void TabsDemoAudioProcessorEditor::setTab2()
{
    auto active = tabs.getCurrentTabIndex();
    if (active == 0) {
        active = 1;
        tabs.setCurrentTabIndex(active);
    }
};

For standalone builds make sure to switch input and output to false in PluginProcessor.cpp at the top initialising list. It will otherwise crash.

Cheers !