Vertical Slider - laf question

[A Former User]

I am having trouble making my vertical slider behave the way I want it to. I just started with this but the sliders are moving from top to bottom and not the other way round. So I'd need to invert that whole thing... How do I do that mathematically in a correctly scripted way in this case?

Thanks for any advice!

u

const laf = Engine.createGlobalScriptLookAndFeel();

laf.registerFunction("drawLinearSlider", function(g, obj)
{
    var a = obj.area;
    if (obj.style == 3)
    {
  
        g.setColour(obj.bgColour);
        g.fillRoundedRectangle([a[0], a[1], a[2], a[3]*obj.value], 5);
       
    }     
});

[d.healey]

Check out my video on custom sliders. Basically you have to subtract the value from the height.

Here's an example

var value = a[3] * obj.valueNormalized;

g.setColour(obj.bgColour);
g.fillRoundedRectangle([a[2], a[1], a[2], a[3]], 2);

g.setColour(obj.itemColour1);
g.fillRoundedRectangle([a[2], a[3] - value, a[2], a[3]], 2);

[A Former User]

@d-healey I went back to that video but somehow couldn’t figure it out. I am having trouble understanding the whole syntax in laf world... I mean there’s the [x, y, w, h] but what is the a suddenly doing here?!

[A Former User]

@vewilya object area... I get it.... Maybe I'll take a quick break just now... 🤯

[d.healey]

@vewilya Yeah using a just makes it easier to read because you don't have to keep writing obj.area[]

[A Former User]

@d-healey I see... And why are there 2 rounded rectangles in there?

[d.healey]

@vewilya One for background one for the value, this is from one of my projects, you can just use the second rectangle if you don't need the background colouring.