childPanel painting issue

ustk

@Christoph-Hart This drove me crazy for hours until I found this might be a bug...

In this example, a childPanel has a child at its right with the same alpha value as the reference rectangle at the left.
We can see that the children seem to be painted twice, as the resulting alpha don't look the same...
This also causes the font to be emphasized

HiseSnippet 1420.3ocsX0uaaaCDmJMpswaoXcXO.D4uj67bkS+Z.EEyN1IqFKI0HNqc.EEELRzVDQlTPhNtFEA6UYOZ6QXuAaGo9h1V1KHEU8Op4c7t62c7tiGyfXgGMIQDir1474QTj02ZObNWFzMfv3n98PVOv9DRhjFiSIcv7HRRB0GYYcmeUQvZmsQ5u+4WNfDR3dzRRHzaELO5wrILYI0As+MVX3QDe54rIF69os66I3cEgho.dtisKJh3cIYL8ThZaaYirt6g9LoHdnjHoIHqsOP3OeXfXFOc+ukkvtHjpVzBMDTTJ4iDg9JDqnh5FvB8Gj62IHPKCJiB2IMJ7C1mv7YEzKiFemlAtTBy3g0VaBdsLgm6MGdVFva6T38P6gdwrHYIGE19F69b3fZDANBLgU5dQa8m22tq.1AW1bB4R5QwvhBIbdtqaC7ybcq+xcqo9GbTjHwWQhwS.me.OD+Jbt3ioxthIQBNrvYuL96ojDq+LkNjA+3U32+gWtHUN80T13.Eum4psYldZlPAkFnYtWCiclhrG+XbGeebrX1t0XbEW7nobOISvwBNw2+LwrCjbETiEgNd43rAX2voz56V6yovjMB6jSRs9y4nGiyrAA6oNMJoGJ7HgoDAXmiWvlomZDNMzoLJnhC4+RKixyFHRXJr5.Qa1iJctFEpCBtui4KCbpuryuI0BBKOSLUBB3jGObFWubqFtm5abyQPQXmvPmzBtjlyBXRpoYVzTYwkioij3X5HZLEJ0WVmIpDCk5J0JSFzILJfTP4hPnptA1s4Spur0RA0YTOoy62WkN1.+B3+128CaFWUYXsYV0.9wjYcBYi4T+yoeBRzFzo+omC4YZCteoEaf2yCRaho968+YbkNOVE3caHCXIlmf4qSODqh.tU8WVnuqq9XFxvzwPcF14Bc1li9ru58qp4ZFMMIXiaRmLOGRjcKAPwOFIhc7vLtVW0KyhVv08RqUmCgu4Fdg5aN9GekQ5qgKVEVVWoO3FgT9XY.9QKTKTKSSWCdV0MkJZDrW8zjCc6ftjvvKf7BmU6Tj22S2g4LJHyp8Wp7bHprkRZHMRwEBqQqoyPTSehjz7BIWsIEqLFYrUTVnUQqVk0BO0s9Z18F6.XT8+EUkZVgBnwsxBzMaqUJLqnnr6q6ebOUQoV4UWSVKqfo104GbUcgPr5j7K89.nX.aTMr6REAwzIhqT2mNY.IVk8s9FF5TZuPJItXSaLMNG9qKKdI2SoSCm+Tgj9FtS8Zet1N0ttFdYViFUIuLkERiqjsZps3MInCe5jKnw4Q37MBiur37Q1qe9Hyw27RiLFaTv6yYx2DQ4qapITV3TM+TFpfsJ0SO88YSOQ8eKiNKRDKQLe03S4Kagz.2bNVzu2uGTzlqNPyf0hnwRlxQr5QuBlyMc3rcr6QStTJh.CVbRBitdiM9mJL7eEzddwh1uu8L0sJkv5x1osJKn72iaqvWgMuWpM2MebQUuBs41wNqiqownFFC4trwXkF6t6mEThzo6FFzzMPqBjGjAjClJkBdliWzH1DKdlX4p1rjSDS.MQhAxVaIglDJmnSud3ydy6PIjqn84CzECpIduYltlcd0igkGjbCr78rO6vgGd9p1c0Q0gGLH7mFRjK9JB0SmxX.kNKLttZjbNz4et4Sq9p7zhaJben8.lzKnZ7tUE3EJS9Zi2rGpsq8giFA2FUB1ssO5O95+pLT5MsiOgHiYP1i8oSmLDtdyiBHgCkYp1aVaoZDkt1UsVEYFR495E+K7kwrkZsUFyV4LQSHdwhO5k19R8Tv6qo.XhqeQ7NvSyg03h9U11tMcQSfWn9QOOUn3m.rWsL6eKj4I2BYd5sPlmcKj442BYdwsPledixn9iCzYpTLIsLAHL3P88FVVGxIPVlNiD8e5kdoh.

When you choose a color tone that you want with 1.0 alpha value, I think it shouldn't look like this, even the children painted twice.

ustk

@Steve-Mohican I agree but this means something's going wrong in the back anyway

ustk

I updated the snippet above for a clearer demonstration...

ustk

@Steve-Mohican And this doesn't fix the font glitch (aliasing) when a text is painted twice

ustk

@Christoph-Hart Any insight on this?

d.healey

I found a solution/workaround for you

inline function addAlphaPanelToChild(p)
{
    local panel = p.addChildPanel();
    p.data.btn = panel;
    
    panel.setPosition(110, 5, 70, 40);
    
    panel.setPaintRoutine(function(g)
    {
        g.fillAll(Colours.white); // <<< I added this line
        g.setColour(Colours.withAlpha(Colours.black, 0.3));
        g.fillRect([0, 0, 70, 20]);
        
        g.setColour(Colours.black);
        g.drawAlignedText("CHILD", [0, 20, 70, 20], "centred");
    });
}

ustk

@d-healey Thank you Dave for this workaround. Effectively when it is painted for the second time it acts as a mask.
This works but we still have to keep in mind an operation is done for nothing if painted twice.
I'll use your workaround for now ;)

Christoph Hart

Have you played around with the opaque property? There are some glitches if you set it to true and then fill it with a (semi-)transparent background

ustk

@Christoph-Hart Yep, I tried, opaque doesn't help...

Christoph Hart

Wow, that was super annoying to fix, but it somehow added the child panel twice when you click the button.

BTW, I noticed you're using an external array to keep a reference to the panel. This is not recommended as there is already a list that you can query with this function.

https://github.com/christophhart/HISE/commit/010fa4f29bfc3eebeac89c1054aa74b3b7b02ccb

ustk

@Christoph-Hart Annoying? 7 lines of code?

The list I use is from the example in the documentation. This should be updated then...
https://docs.hise.audio/tutorials/recipes/ui/scriptpanel.html#horizontal-list-example

Thanks a lot!

Noticed the last math APIs... What the difference between Math.wrap and Math.range? Is that more adapted for signals?

Christoph Hart

Fmod behaves weird for negative values so for any kind of looping wrap is better.

childPanel painting issue

31

1.8k

10.2k

89.1k