Finally: Fully customize stock UI elements with a scripted LookAndFeel

[ustk]

@Dalart In the doc you'll find examples

[d.healey]

Found a bug. I customized a combo box to have an invisible background but this has also affected the rendering of HISE's windows.

Also I have a usability question. What happens if I want to customize two controls of the same type but have them look different? Is it possible to attach the paint routine to individual controls or must be use a control statement within the paint routine to determine how each control should be painted?

[Christoph Hart]

Nope, it overrides the global look and feel. However you can use the colour properties to customize individual UI elements at least a little bit.

[d.healey]

Knobs/Sliders next please :D

[Lindon]

@d-healey said in Finally: Fully customize stock UI elements with a scripted LookAndFeel:

@ustk said in Finally: Fully customize stock UI elements with a scripted LookAndFeel:

• MidiLearnPanel => column widths

Side request - can you make the midi learn panel even more useful by adding the ability to select the assigned CC from a right click menu? This will be very helpful for users who don't have many hardware controllers but still want to use CC automation in their DAW/host.

Assuming this request didnt get executed? If so add my vote for it please.

[Christoph Hart]

There you go:

- added Assign to Midi CC to MIDI learn context menu · christophhart/HISE@d30e21d

The open source framework for sample based instruments - - added Assign to Midi CC to MIDI learn context menu · christophhart/HISE@d30e21d

GitHub (github.com)

[Lindon]

@Christoph-Hart said in Finally: Fully customize stock UI elements with a scripted LookAndFeel:

There you go:

- added Assign to Midi CC to MIDI learn context menu · christophhart/HISE@d30e21d

The open source framework for sample based instruments - - added Assign to Midi CC to MIDI learn context menu · christophhart/HISE@d30e21d

GitHub (github.com)

hey @d-healey - is this in your latest commit? If not any chance of adding it?

[d.healey]

I think at this point it really would be best if Christoph could merge my branch into the official repo.

[d.healey]

@Christoph-Hart Who else needs to sign the agreement thingy for you to merge? I can send dogs after them if needed :)

[ustk]

@d-healey We were 3, two of us did it :)
@Levitanus doesn't seem to be an active member for a while...
Maybe Christoph could reach him by email? traditional mail? carrier pigeon?

[d.healey]

@ustk He's active on VI-Control. I'll send him a message there.

[Levitanus]

Hi, I'm ready to sign. Ohhh. How complicated things are... It's just few lines from the JUCE repo)

[Levitanus]

Can't see what should I do

[d.healey]

@Levitanus I think you'll need to wait for Christoph to send you the doc tomorrow.

[Levitanus]

OK, thanks. pianoist@ya.ru for the case

[Christoph Hart]

Actually, if you just pasted some lines over from the JUCE library, you don't need to sign it (because then the JUCE guys have the copyright). I've just seen your name in the commit history and wanted to make sure that everything is cleared before merging.

Alrighty then, we're good to go. @d-healey can you send me the link to the branch I should merge? I kind of lost track :)

[d.healey]

@Christoph-Hart

Build software better, together

GitHub is where people build software. More than 150 million people use GitHub to discover, fork, and contribute to over 420 million projects.

GitHub (github.com)

There is a pull request open for it.

[Christoph Hart]

Alrighty, done :)

[d.healey]

Woohoo!!!!

[andioak]

@Christoph-Hart

While trying to add a customization I seem to get an infinite loop:

laf.registerFunction("drawToggleButton", function(g, obj)
{
    var blue = "0xFB00A6C9";
    var yellowish = "0xFBB4CF0C";
	  
    if(obj.text == "Button1") // accessing only one of the item for a special color, or anything:
    {
        Console.print("object id is button1"); // this code keeps repeating over and over... ?
        g.setColour(yellowish); // custom color only here.
    } 
    else {
    
        g.setColour(blue); 
        
    }
    
    g.fillRoundedRectangle(obj.area, 4.0);

    if(obj.over)
        g.fillRoundedRectangle(obj.area, 4.0);

    if(obj.down)
        g.fillRoundedRectangle(obj.area, 4.0);
    
    g.setColour(Colours.withAlpha(obj.textColour, obj.value ? 1.0 : 0.3));
    g.setFont("Arial Bold", 12.0);
    g.drawAlignedText(obj.text, obj.area, "centred");

});

The if (obj.text == "Button1") is processed all the time and always returns true, even though there is only one single item with that name.

UPDATE: after testing the same if-types as already used in the hise docs copy-paste that this one is made from, it works if I remove the Console.print() and replace the if statement with this only:

... 

g.setColour(blue);

if(obj.text == "Button2")
        g.setColour(yellowish);

...

Is that how this was intended to be used only? Is there an issue with the Console? Not being handled in that stage?