Creating a Custom Slider Class


#1

I’m trying to make a custom slider class but can’t get them to show on the plug-in.
I started a new project to try and implement just this. The class looks like:

#pragma once

#include "../JuceLibraryCode/JuceHeader.h"

class CustomSlider : public Slider
{
public:
	CustomSlider();
	~CustomSlider();

	void resized() override;
	void paint(Graphics& g) override;

private:
	Slider slider;
	Label label;
};

//---------------------


#include "CustomSlider.h"

CustomSlider::CustomSlider()
{
	slider.setRange(0.0f, 1.0f);
	slider.setValue(0.0f);
	slider.setSliderStyle(Slider::SliderStyle::Rotary);

	DBG("\n\n\n\n custom made \nn\n\n\n\n\n\n");
}

CustomSlider::~CustomSlider()
{

}

void CustomSlider::resized()
{
	slider.setBounds(10,10,60,60);

	DBG("\n\n\n\n custom resize \nn\n\n\n\n\n\n");
}

void CustomSlider::paint(Graphics& g)
{
	DBG("\n\n\n\n custom paint \nn\n\n\n\n\n\n");
}

Then in PluginEditor:
#pragma once

#include "../JuceLibraryCode/JuceHeader.h"
#include "PluginProcessor.h"
#include "CustomSlider.h"

//==============================================================================
/**
*/
class Test_sliderClassAudioProcessorEditor  : public AudioProcessorEditor
{
public:
    Test_sliderClassAudioProcessorEditor (Test_sliderClassAudioProcessor&);
    ~Test_sliderClassAudioProcessorEditor();

    //==============================================================================
    void paint (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.
    Test_sliderClassAudioProcessor& processor;

	CustomSlider customSliderTest;

    JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR (Test_sliderClassAudioProcessorEditor)
};

//--------------


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


//==============================================================================
Test_sliderClassAudioProcessorEditor::Test_sliderClassAudioProcessorEditor (Test_sliderClassAudioProcessor& p)
    : AudioProcessorEditor (&p), processor (p)
{
    setSize (400, 300);

	addAndMakeVisible(customSliderTest);
}

Test_sliderClassAudioProcessorEditor::~Test_sliderClassAudioProcessorEditor()
{
}

//==============================================================================
void Test_sliderClassAudioProcessorEditor::paint (Graphics& g)
{
    g.fillAll (getLookAndFeel().findColour (ResizableWindow::backgroundColourId));
}

void Test_sliderClassAudioProcessorEditor::resized()
{
	customSliderTest.setBounds(getLocalBounds());
}

#2

You’re overriding the paint() method so the slider drawing never happens. Either remove this, or do the following to call the Slider::paint() method:

void CustomSlider::paint(Graphics& g)
{
    DBG("\n\n\n\n custom paint \nn\n\n\n\n\n\n");
    Slider::paint (g);
}

#3

Thanks for your reply Martin,

The slider still isn’t displayed whether I take the paint function out or call Slider::paint()


#4

don’t you have to override the LookAndFeel methods for the Slider class if you want to customize how it looks?


#5

Oh, right I see what you’re doing. I don’t think this mix of inheritance and composition is a good idea. But … in CustomSlider its slider member is never added as a child component.


#6

What do you want to change is your slider? I wonder if one would want a custom slider or a custom look and feel object.


#7

Is there any way to reword this? I don’t quite understand

is it possible to set things such as these in a look and feel class?
set slider.setRange(0.0f, 1.0f);
slider.setValue(0.0f);
slider.setSliderStyle(Slider::SliderStyle::Rotary);


#8

You don’t call addAndMakeVisible() on slider.


#9

I wouldn’t create a class just for this stuff. If you set the same configs for different sliders you can make a function that you call for each.


#10

If your goal is just changing the way the slider is drawn, still with JUCE paint primitives, then I suggest you create your own LookAndFeel class (done here: https://github.com/mbrucher/ATKJUCEComponents/tree/c912cb45016e474b1a019c9e9bf41c5f34c762a4/JUCE)
If you want to draw bitmaps, then there is another class available in the forum that helps to do so.

The nice thing of LaF is that you keep the text displays working, otherwise you have to rewrite them as well.


#11

If you just need to change the range and style of the Slider, you don’t need to create a custom class. You can set these in the AudioProcessorEditor constructor directly like this:

Test_sliderClassAudioProcessorEditor::Test_sliderClassAudioProcessorEditor (Test_sliderClassAudioProcessor& p)
    : AudioProcessorEditor (&p), processor (p)
{
    addAndMakeVisible (slider);
    slider.setRange (0.0f, 1.0f);
    slider.setValue (0.0f);
    slider.setSliderStyle (Slider::SliderStyle::Rotary);

    setSize (400, 300);
}

and declare a regular slider in the header:

Slider slider;

If you want to learn more on Sliders, I would suggest reading this tutorial: https://juce.com/doc/tutorial_slider_values


#12

Another useful thing I’m using (hope @juce people could tell me if this is the right way) is ::getProperties() so if I need more unique object values (in addition to colors) this allows me to actually have single LookAndFeel with my own custom shapes for buttons (for example) or other unique properties for our needs.

This seems to be my next refactoring mission without doing over-inheritance.