How To Make Click&Drag Number Box Slider (Without the Slider)?

General JUCE discussion
21

True, but being in a Slider, you would have to get a pointer to the label first which is not trivial (I seem to recall a recent discussion about that). I know I had to do some tricky stuff to get a pointer to a Slider’s Label.

But in general, to me, this is a “bug” in JUCE: why would you NOT want the TextEditor to have the same justification as the label to which it belongs? Who would want the text jumping around to a different location when you edit the label? This one line fixes the issue in EVERY instance of label usage, inside Labels, Sliders, ComboBoxes, etc.

22

If he adds this to the CNumericSlider class it will probably work…

void mouseDoubleClick (const MouseEvent& event) override
{
    m_pOwner->showEditor();
        
    TextEditor* pEditor = m_pOwner->getCurrentTextEditor();
        
    if (pEditor != nullptr)
    {
        pEditor->setJustification (m_pOwner->getJustificationType());
            
        pEditor->setInputRestrictions (2, "0123456789");
            
        pEditor->setColour (TextEditor::textColourId, Colours::white);
        pEditor->setColour (TextEditor::highlightedTextColourId, Colours::white);
        pEditor->setColour (TextEditor::backgroundColourId, Colours::black);
                
        pEditor->setBounds (getLocalBounds());
    }
        
    Slider::mouseDoubleClick (event);
}

Rail

23

I suspect just overriding createSliderTextBox() in the LookAndFeel should do it, something like (untested)…

class MyLookAndFeel : public juce::LookAndFeel_V4
{
    juce::Label* createSliderTextBox (juce::Slider& slider) override
    {
        if (auto* label = juce::LookAndFeel_V4::createSliderTextBox (slider))
        {
            label->setJustificationType (juce::Justification::centred);
            return label;
        }

        return nullptr;
    }
};

Maybe, but unfortunately this would potentially be a subtle breaking change for a lot of users.

24

Everyone that don’t want it to move around all the time when entering the new text/number.

Entering and displaying text/numbers are two different things. Both conceptually and visually. When you just want to displays a text you mostly wan’t to do it in a clear, distinct and visually pleasing way, sometimes even with an artistic touch…

When entering text you have other concerns; it should be easy and it should be accurate.

If you then have the text right (or center) aligned makes the already entered text shift to the left for every new character entered, which makes it harder to read and a probably a bit more error prone. It’s just more cognitively straining to watch moving text. Especially when you’re writing at the same time.

Compare it to writing on a paper. The text is left-align (at least for us in the western civilization), it doesn’t move and the text is entered to the right. And you clearly see when you come to the end of the paper and have to stop…

I think that’s the way people are accustomed to also when using computers. And if that’s not enough of reasons the control/widget should prefer left alignment for entering mode, you have the additional one of a clear indication that something happened when you clicked the control and that it’s now in entering mode.

25

Can’t agree with you there, but OK, fair enough, “someone” likes it that way. :slight_smile:

There are plenty of other methods to indicate “something happened” such as changing the background colour or the text colour, rather than having the text suddenly jump to a different position.

But I wouldn’t expect this to be changed in JUCE, so for me, my one line fix does what I need.

26

That’s not going to do anything to the justification of the textEditor that is not even created until Label::showEditor().

You would need to do something like this; I just tested it; it works:

    class MyLookAndFeel : public juce::LookAndFeel_V4
    {
        juce::Label* createSliderTextBox (juce::Slider& slider) override
        {
            if (auto* label = juce::LookAndFeel_V4::createSliderTextBox (slider))
            {
                label->onEditorShow = [this, label] {
                    label->showEditor();
                    if (auto* ed = label->getCurrentTextEditor())
                        ed->setJustification(label->getJustificationType());
                };

                return label;
            }
            
            return nullptr;
        }
    };

Agreed. :slight_smile:

27

Thanks for the correction @stephenk. Quick check are you sure you need to call label->showEditor() in label->onEditorShow ?

28

You’re right - that’s redundant. Revised:

    class MyLookAndFeel : public juce::LookAndFeel_V4
    {
        juce::Label* createSliderTextBox (juce::Slider& slider) override
        {
            if (auto* label = juce::LookAndFeel_V4::createSliderTextBox (slider))
            {
                label->onEditorShow = [this, label] {
                    if (auto* ed = label->getCurrentTextEditor())
                        ed->setJustification(label->getJustificationType());
                };
                return label;
            }          
            return nullptr;
        }
    };
2 Likes