Look and Feel - Toggle Buttons and the MIDI Sources panel...

Lindon

@Lunacy-Audio sure here:


laf.registerFunction("drawPopupMenuBackground", function(g, obj)
{
    g.fillAll(0xFF222222);
    g.setColour(0x9F5AC4EC);
    
    g.drawRect([0, 0, obj.width, obj.height], 1);
});

laf.registerFunction("drawPopupMenuItem", function(g, obj)
{
    var a = obj.area;
    var h = a[3];
    
    if(obj.isSeparator)
    {
        g.setColour(Colours.white);
        g.drawLine(a[0]+10, a[0] + a[2]-10, a[1] + a[3]/2, a[1] + a[3]/2, 1.0);
        return;
    }
    
    if(obj.isTicked)
    {
        g.setColour(0x9F5AC4EC);
        g.fillEllipse([a[0] + h/3, a[1] + h/3, h/3, h/3]);
    }
    
    g.setFont("Verdana", 16.0);
    
    if(obj.isHighlighted)
    {
        g.setColour(0x9F5AC4EC);
        g.fillRect(obj.area);
        g.setColour(Colours.white);
        g.drawAlignedText(obj.text, [a[0] + h, a[1], a[2] - h, a[3]], "left");
    }else{
        g.setColour(Colours.white);
        g.drawAlignedText(obj.text, [a[0] + h, a[1], a[2] - h, a[3]], "left");
    }
    
});

Casey Kolb

@Lindon Ok this is an easy fix. You just need to add a customization for the combobox as well. Just tested this on most recent scriptnode and it's working. This is what I have it set to:

laf.registerFunction("drawComboBox", function(g, obj) {
    var a = obj.area;
    g.setColour(0x00FFFFFF); // make transparent
    g.fillRoundedRectangle(a, 1.0);
    g.setColour(Colours.withAlpha(0xFFACACAC, (obj.enabled && obj.active) ? 1.0 : 0.2));
    g.drawAlignedText(obj.text, [a[0] + 10, a[1], a[2] - 30, a[3]], "left");
    var h = a[3];
    g.fillTriangle([a[0] + a[2] - h/3 - 10, a[1] + h/3, h/3, h/3], Math.PI);
});

Lindon

@Lunacy-Audio thanks Casey - however....

Whilst I'm sure this works I have discovered a huge tranch of my current problems with HISE (failing to save, locking up etc.) all go away when I stop using LaF, so I've decided that LaF is "broken for me" - and I will use discreet panels to get the visual layout I want.

Lindon

@Lunacy-Audio - and of course this fails to solve the problem if you want your combo box text to be black;

laf.registerFunction("drawComboBox", function(g, obj) {
    var a = obj.area;
    g.setColour(obj.bgColour); // 
    g.fillRoundedRectangle(a, 1.0);
    g.setColour(Colours.black);
    g.drawAlignedText(obj.text, [a[0] + 10, a[1], a[2] - 30, a[3]], "left");
    var h = a[3];
    g.fillTriangle([a[0] + a[2] - h/3 - 10, a[1] + h/3, h/3, h/3], Math.PI);
});

As the Audio Settings panel ignores this:

g.setColour(obj.bgColour);

and sets the combo box colours to black, tho it does recognise the transparency. So really the Audio Settings widget ISNT obeying LaF guidelines.

Casey Kolb

Whilst I'm sure this works I have discovered a huge tranch of my current problems with HISE (failing to save, locking up etc.) all go away when I stop using LaF, so I've decided that LaF is "broken for me" - and I will use discreet panels to get the visual layout I want.

Yikes! Very strange indeed. I've used just about all the possible LaF's on my project and haven't experienced this. I wonder if it's an OS version thing?

Christoph Hart

One thing to keep in mind (I think I've mentioned this in the docs) is that the methods that you give the LAF object must never access script variables outside their scope. These functions are executed directly in the UI rendering and everything else in HISE is being executed on a dedicated thread and is more robust in the sense that there aren't too many weird concurrency issues.

Lindon

@Christoph-Hart - yeah that aint it.. here's my entire LaF code:


laf.registerFunction("drawPopupMenuBackground", function(g, obj)
{
    g.fillAll(0xFF222222);
    g.setColour(0x9F5AC4EC);
    
    g.drawRect([0, 0, obj.width, obj.height], 1);
});

laf.registerFunction("drawPopupMenuItem", function(g, obj)
{
    var a = obj.area;
    var h = a[3];
    
    if(obj.isSeparator)
    {
        g.setColour(Colours.white);
        g.drawLine(a[0]+10, a[0] + a[2]-10, a[1] + a[3]/2, a[1] + a[3]/2, 1.0);
        return;
    }
    
    if(obj.isTicked)
    {
        g.setColour(0x9F5AC4EC);
        g.fillEllipse([a[0] + h/3, a[1] + h/3, h/3, h/3]);
    }
    
    g.setFont("Verdana", 16.0);
    
    if(obj.isHighlighted)
    {
        g.setColour(0x9F5AC4EC);
        g.fillRect(obj.area);
        g.setColour(Colours.white);
        g.drawAlignedText(obj.text, [a[0] + h, a[1], a[2] - h, a[3]], "left");
    }else{
        g.setColour(Colours.white);
        g.drawAlignedText(obj.text, [a[0] + h, a[1], a[2] - h, a[3]], "left");
    }
});

laf.registerFunction("drawToggleButton", function(g, obj)
{
    var a = obj.area;
    if (a[2] == a[3])
    {
        g.setColour(Colours.darkgrey);
        g.drawEllipse([1,1,a[2]-3,a[3]-3], 2);
        if(obj.value)
        {
            g.setColour(obj.bgColour);
            g.fillEllipse([4,4,a[2]-9,a[3]-9]);
        }
    }else{
        if (obj.value)
        {
            g.setColour(Colours.grey);
            g.setFont("Verdana Bold", 14.0);
            g.drawAlignedText(obj.text, obj.area, "centred");
            g.setColour(obj.bgColour);
            g.drawLine(0, 76, obj.area[3]-5,obj.area[3]-5, 4);
        }else{
            g.setColour(Colours.grey);
            g.setFont("Verdana Bold", 14.0);
            g.drawAlignedText(obj.text, obj.area, "centred");
        
        }
    }
});

d.healey

@Christoph-Hart said in Look and Feel - Toggle Buttons and the MIDI Sources panel...:

You can reset the look and feel

How?

ustk

@d-healey I might have wrong but I think Christoph's saying you can comment out the custom LAF and re-activate it when you're ready to export your plugin.

d.healey

@ustk Nope, that doesn't reset it.

Docs aren't helpful either - https://docs.hise.audio/working-with-hise/menu-reference/view/index.html#reset-custom-look-and-feel

And I've got the same problem as @Lindon. I'm not even using LAF for comboboxes in my script.

@Christoph-Hart - In fact as soon as you add this line const var laf = Engine.createGlobalScriptLookAndFeel(); to your script and compile it will turn all of the settings floating tile comboboxes black, try it yourself.

Update:
Look what I found :) Doesn't fix the settings panel though.

A Former User

@d-healey

Try this.... ..
IF it doesn't work save the XML close HISE and reload the project/open XML.

A Former User

HiseSnippet 1496.3ocwW80aaaCDWJMJnwcYsEn.CCXOHjGJrWcbkcRV1ZvP8eRbavRZMhyJFPPPGsDsMWnHEnnZhaQw9psG1KC6Ky9FjcTTxRJUMKMCCSAQl73wi+t638GMPvcwggbgg4xGMK.aX9YVCmwjS6MEQXF6sig4mac.JThE1ZRcmEfBCwdFll25YJBlKunQ7ye8ztHJh4hyHYX7JNwEuOwmHynNn8OPnz9HO7QD+bbuQ68b4rdbJOBvysrbLBPtmhlfeARw1BVFlKsqGQxECkHIND3oK2a1vo7yXZ9eEIjLhhUSZZLDDjlrQuoDp2fTcMzvvbwAYZ9szZ9CrNf3QlSOyBbu3Ery1Qdaf4BEgzhEfTyOFj5yodJA7QfmYN3snFd22ZnqfDHyVQgs6XsGCbNiQfYOOrz7ZrvyWxpGG3fIa3iNE2W.Sluipa53T2dCGmZauRkUp.F+Po8aPBaJZr82auKaBgga3Jvfp8LJeDhpE69b9ocXd8wXZU0VA1aHvSHpqI8iXtRBmUcUOA5rA7fnfCvrntfmbhfGw7Vst83TdlT2lO5WpsRk2sREa3YRiwvMiNTZUmy62uU7iFauW+y03j1Sh8upyPoeHP6.hMPfpscF4o.YzwqeRBI8ax3pJVIgCwAHABb00zKjHOMtCwR8E2p5eBab1ThDWa67Lov49fIsJ5XmSdTSv1qFX+H3mVmrlddS870O4ws9foMa3jWfBrLRvRH79Rw7QD2SwdWMfcN+65uYmdarauhnU4J1kRIAg3pGm.zoOd84nJdb5qSpUFNhOl9vUtpq1CQIiDDvyzbyL03Rv84jISov+x+MX9PrqrZp2s3xWauTG.ELr2Q3y0hRBCpaO2JnsA0i8a1qomu9I.gUo3wxUmaKvzP769+D.Wi.mdb+Q7t7yKIlw9pCYJ5Pbb5uU2s5sUssyGKenJjG6o7IH1DJb0uv03RsHD4zNzfon3j.c5o9qtcrU.yPPtTO6G9PMV.z9FbM6mpDo8SrcZzpVlj+mMioQbysiq6jYHcgblBr2baYIIHzmwQBhV0NNWzrxo730g24hpShU1H9EbDGfjSaLXuutU8DKB3qRcA1b1K3R7KYUqU4cUVtx6qXe4kFOtz0To6EbJEKJcYUIWwUswprH+QXQcPgoQ34LB0gJVnaoqWgNWc0mbLxY6wHxWFfSlmUJrYIkBMRJeoJJlfPfUYbIw6kTRL8JrAwSUQLcZSiXUHe6HF+3d6fjnTgAxENq.rPRTpj4N32.sqnq2tr0N3vSk7.33.IFvYJTXVQezqjVMFwvz3y81VwiaZbtgoko5rlkN3Lhmb5bXz9WaOEqRxkArYsGwEdXwgHORTXd.qoOj71BpAjxvOsOokWZy09xeuH0VJxewCt6eDycNzacMMbmmcZNsmkMoZaezb8KufuiLoGJsf6S4HIgM4HBbiPI76ZkmT9C3mcye.eU6D+xQI.sWTnj6ODKU6MzXzjL8FX+hOzZ7m+1EWTh0Hkbr6eg2ZZEmaa0cDPFDwpOwVJhv00jhuDTfzKijAQxBj5FMdr1wTf7Pje.EeHDhTfrt6otCNnHyPBFjOnWGv8tjXbQTbeH+FuH1hamtiOjTUdPDURBnjKg9dTLRn5WsWuR.19bWjJb+RJ7nnqDB6CkMf0NVm0yowl0SGsU5PHC17QsxHlNpUCG0fSfbboQCVl6.2hRiDrLOScm5Ca6EZ9l6EQU8ckuib0mdjr.nNEZ8U0dKKjHmk+SS9DZS2oz1zKM2z0Dt22Z.Q5Nsb7tPI3ExO8eMdS9nmUr1EtG6Jy.6hV8+oa5W37I.Enw.UDMTCTPTYTdQj+PHV0ECHgA4QCU2IVPkjQO2IMqyPLyKdxEvSxhMUyMSVrY5hF9HWA+0t5pFpOq51wT.Lwh+hxkgOsElaOuPgkkSCGCeH540ttJSwZ.1KeOstA6Y8avd13FrmMuA64atA6Yqavd91qbOpDWchfD95vDfvfciyXaZtqt2O0MRi+FP+myEH

A Former User

Transparent 2.jpg Transparent 1.jpg
LAF with Custom settings (Transparent BG)

d.healey

This post is deleted!

d.healey

@Rudra-Ghosh but I want to use laf, if I comment it out and reset that doesn't fix the problem. Or will it be okay in the exported plugin?

A Former User

@d-healey Yes... LAF is okay in Exported plugins too.

A Former User

@d-healey said in Look and Feel - Toggle Buttons and the MIDI Sources panel...:

if I comment it out and reset that doesn't fix the problem.

In such case you will need to reopen HISE.

d.healey

@Rudra-Ghosh said in Look and Feel - Toggle Buttons and the MIDI Sources panel...:

@d-healey said in Look and Feel - Toggle Buttons and the MIDI Sources panel...:

if I comment it out and reset that doesn't fix the problem.

In such case you will need to reopen HISE.

What I mean is that hiding the problem is not a solution.

Are you saying that with laf enabled and the settings panel combo boxes black, I can export the plugin and the settings panel will look normal again?

A Former User

@d-healey If you enable Laf register....you will get black box until or unless you write

laf.registerFunction("drawComboBox", function(g, obj) {
 .........rest of the code
    g.setColour(0xFFF7B7C7);

A Former User

@d-healey I didn't hide anything...didn't hide black combobox either. If you write

laf.registerFunction("drawComboBox", function(g, obj) {
 .........rest of the code
    g.setColour(0x00F7B7C7); // make transparent

});

Look and Feel - Toggle Buttons and the MIDI Sources panel...

18

1.7k

11.8k

102.7k