LAF ScriptSlider?

[ustk]

@Christoph-Hart @d-healey There's a valueNormalized but I might have made a mistake (or not), so this is where obj.skew might help.
This is the formula of the valueNormalized I've made:

(s.getValue() - s.getMinimum()) / (s.getMaximum() - s.getMinimum())

so this doesn't take the skew factor, hence 0.5 isn't the middlePosition of 1,000, but half the range (10,000 in the case of a 0-20,000 time knob)

[ustk]

@d-healey @Christoph-Hart This is what you want, but since it complicates too much the formula, I should either add a valueNormalizedWithSkew, or modify the existing valueNormalized... ?

laf.registerFunction("drawRotarySlider", function(g, obj)
{
    var a = obj.area;
    var width = obj.area[2];
    var height = obj.area[3];
    var stroke = 3;
    var mark = 4;
    var startOffset = 2.5;
    
    var valueNormalizedWithSkew = Math.pow(10, (Math.log10(obj.valueNormalized) / (1/obj.skew)));
    
    var endOffset = 5 * valueNormalizedWithSkew - startOffset;

    Console.print(obj.skew);
    g.setColour(obj.itemColour1);
    g.fillEllipse(a);

    g.setColour(obj.itemColour2);
    g.drawEllipse([stroke / 2, stroke / 2, width - stroke, height - stroke], stroke);

    g.rotate(endOffset, [a[2] / 2, a[2] / 2]);

    g.setColour(obj.textColour);
    g.fillRoundedRectangle([width / 2 - mark / 2, 0, mark, height / 2.5], 1.5);
});

[Christoph Hart]

Yeah, valueNormalised should definitely include the "deskewing", otherwise you can just use the normal value.

[ustk]

@Christoph-Hart Alright, correcting...

[ustk]

@Christoph-Hart @d-healey that's fixed and pushed, so you can now do this:

laf.registerFunction("drawRotarySlider", function(g, obj)
{
    var a = obj.area;
    var width = obj.area[2];
    var height = obj.area[3];
    var stroke = 3;
    var mark = 4;
    var startOffset = 2.5;
    var endOffset = 5 * obj.valueNormalized - startOffset;

    g.setColour(obj.itemColour1);
    g.fillEllipse(a);

    g.rotate(endOffset, [a[2] / 2, a[2] / 2]);

    g.setColour(obj.textColour);
    g.fillRoundedRectangle([width / 2 - mark / 2, 0, mark, height / 2.5], 1.5);
});

[d.healey]

@ustk Woohoo! Thank you both!

[d.healey]

@Christoph-Hart Merge?

[Christoph Hart]

@d-healey Merge.

[Natan]

@d-healey @Christoph-Hart so Is This Stable To Build?
https://github.com/christophhart/HISE/commits/scriptnode

The Top One, Is The Latest, Right?
71f75e5 <<< This?

[Christoph Hart]

Yes, that should be fine.

[A Former User]

This post is deleted!

[d.healey]

I'm convinced that LAF is the way to go now for a custom UI without images.

[A Former User]

@d-healey I was experimenting with Lottie graphics yesterday and was totally blown away by its looks and possibilities! I don’t get what LAF is exactly tbh. But it looks really nice too!

[d.healey]

@vewilya I haven't used rlottie much but what I have done with it has looked nice, very smooth animation.

[ustk]

@vewilya Be just careful with Lottie since all actions aren't rendered/compatible with Hise. So complex animations might not work, keep them simple.
Custom LAF is a way to redraw the components (sliders, comboboxes, etc...) with fully customizable graphics (shapes and colours). So you don't necessarily need to recreate the components from script panels for full customizations, the original ones can now give you almost anything you want...

[DanH]

@ustk We seem to lose the 'boxes' around the option buttons when using laf - anyone else come across this?

[ustk]

@DanH Unfortunately, when using custom LAF, Hise LAF isn't separated from plugins LAF. The recommendation is to write your custom LAF and then deactivate it (comment) when working on the project. Then reactivate (uncomment) before export.
I'd like this to be different like many of us, but Christoph said it would be a nightmare to modify if I translate well his words...

[DanH]

@ustk yes but the blank boxes carry over into the plugin itself - for example at the beginning of the whole process, when installing the samples, and when overwriting a preset...

I'm guessing we don't have any workarounds at the moment! :face_with_tears_of_joy:

Look at this monster lol

[d.healey]

@DanH Yes we have a workaround - LAF :p

Solutions have been posted in this thread - https://forum.hise.audio/topic/3228/look-and-feel-toggle-buttons-and-the-midi-sources-panel/14

Basically you have to style everything yourself.

[ustk]

@DanH When you use a custom LAF you have to redesign the whole component as it starts from blank...