Premium GUI elments

Recently i've shared my summer nights project where i tried to create flash style (gradient heavy) gui elements; premium knob and fader.
Lemur doesn't have angular gradient, and creating it on the fly takes a lot of resources and more math than one could like, but it's possible and therefore why not.
Some things currently as of ver 5.3.2 i cannot make, but i've spend a lot of time to make it as good as it can be.
If you have any comments or constructive ideas, or if something in code is unclear, do not hasitate to ask.

Greets
d

this is great work. Magnificent. The brushed aluminium background is incredible. Never thought such things could be possible in Lemur. Excessive use of rand(), never seen something like this. The recently released Fader will go into my WIP Mixbus template, it was exactly what I was looking for.

I was thinking of using my 'Buchla'-Fader, which is nice, but not visually suitable for a DAW controller. Creating a new fader would take me a lot of time, and now it's already there, created by you. I'm very grateful for what you've done. Working with Canvas is not my speciality, so I'm also grateful to learn so much from your work.

The Buchla-Fader:
https://forum.liine.net/viewtopic.php?f=26&t=4543&start=30&hilit=west

P.S.: I went to the forum to open a discussion about the 'premium' material, and now the thread is already there.

Thank you for you reply. I hope that fader will serve you well

Thanks very much for this, thanks, thanks thanks!!! looks great!

I still haven't found out how to change the colour of the Fader frame.

If you mean border around fader, code for handling that is in FaderBackground, under build() subrutine.
Code looks like this:

if (border) {
	shape[0] = createBorder(border);
	shape[1] = 3;
	shape[2] = 0;
	shape[3] = {1, .8, .8, .8}; <<< here are alpha, r, g, b values
	shape[7] = 0;
	addShape(shape);
}

Also, above code is a good example how things are drawn on all canvases.
Usually onLoad subrutine calls build() subrutine.
Here you define shapes, colors etc:
shape[0] holds drawing path (made with rect, lineTo, arc etc.)
shape[1] is line ticknes for stroking, if value is 0, then shape will be filled.
shape[2] is line cap (if shape is filled, this is ignored)
shape[3] holds gradient for filling, or, like above vector for stroking (currently stroking with gradient is not possible)
shape[4 if gradient or 7 if vector] used for rotation. Values are -2 to rotate, or 0.
Then, when needed, all shapes stored in vector are drawn in onRedraw()
Sorry for only few comments in code.

Few days ago i did some updates on Fader (i've added live meter) and will upload it soon.

thank you very much for the explanation. Now I understand. Also thanks for the tip how to work with Canvas objects.

hi denoiser, i tried to implement the knob into my template, on the tablet i can't see: theknob, the ledring, just the background and screws, do you know why(just on the computer)?

can i resize the whole knob incl. ledring? i need it way smaller...

it would be really nice if you could upload your new fader with led, want to use it!

nice work!
thank you

resizing is possible with the underlying object itself. The canvas will follow its size.

I think it's best to export your project as jzml, load the entire Premium project, and import your project.

schoko wrote:hi denoiser, i tried to implement the knob into my template, on the tablet i can't see: theknob, the ledring, just the background and screws, do you know why(just on the computer)?

can i resize the whole knob incl. ledring? i need it way smaller...

it would be really nice if you could upload your new fader with led, want to use it!

nice work!
thank you

Hi schoko,

knob consists of three parts needed to work:
KnobBase - this is original lemur knob. select it in browser, bring it to front, make changes and send it back.
KnobMask- this is canvas that draws knob background. In onLoad () function there is variable 'parent', change its value to hold new name if you changed orig. lemur knobs name
KnobHead - this is canvas that draws knob foreground. Same rule for assigning parent appplies to this one.

This is specialy important if you have multiple knobs, hence each one will have unique name. ie. KnobBase1, KnobBase2... so changing 'parent' var in those canvases is a must in order to work properly.


I will upload fader soon, just need few checks.
i've just 'finished' something, i hope you will like 'one'

EDIT: I've uploaded updated fader.

Greets
d

hi denoiser,

i tried to implement your premium elements in my template, for a reason i cannot figure out i can't see the canvas graphics, except with the button.
(it is just visible in the editor, but not on the tablet).

can you help me out here? (i must have missed something).

Thank you!

premium_elements.jpg

Hi schoko,

attach your project and i will help you.

Greets
d

Hi d,

thank you for the support, i think it must be a little thing...
this is the "all in one", quite a huge template, which should do all possible controls...

all the best,
schoko

rework_5_new_kontakt_v16.7z

That's a big one.
I've created one test interface inside. It 'should' work.
I didn't saw any problems in your code, except this is a huge project, and my canvases doesn't help either... i guess you've hit lemur limits.
If new interface doesn't work, try copying it to new project.

Greets
d

rework_5_new_kontakt_v17.rar

hi d,

it's good to hear that you didn't find any bigger problem, i don't think i have hit any limits, the memory says 19%...(since the new editor version, before it was 23%) , (max overall file size is 16 mb, my project has 1,6 mb)
will try it on the tablet..
do you use an ipad? , maybe its an issue with my tablet / android version, i will try it on my smartphone too...


thanks!
schoko