Colour accent on preset select, laf fix?

[Straticah]

@Straticah thats with same size

[d.healey]

You probably need to change the width in your paint routine.

g.fillRoundedRectangle([a[0], a[1], a[2] - 273, a[3]], {CornerSize: 2, Rounded:[1, 0, 1, 0]});

a[2] - 273 is the width. You'll want to change it depending on the state of the favourite button (probably).

I like the accent idea. Can I steal it?

[Straticah]

@d-healey haha sure! if you let me steal the image buttons soon? ^^ i guess you will make a video about that, you can also show how to make only selected corners round, ppl need to know :)

There are not many tutorials targeting the hise browser i think. Tx for your help, really apprechiated.

[d.healey]

@Straticah Good deal. I'll post a video about loading images into look and feel on Saturday.

[DanH]

@Straticah I'm guessing this bit didn't work for you?

		    if (obj.text == "Add a Bank")
		        obj.text = "Select a library";
		        
		    if (obj.text == "Select a Column")
		        obj.text = "Select a Category";

[d.healey]

@DanH Should do, that's the code I'm using :) Oh you're right, he's put it in the wrong place. It needs to be in the drawPresetBrowserColumnBackground function.

[DanH]

@d-healey ah yes just seen in the docs too, thanks!

[DanH]

@d-healey so you're just using that? Mine goes blank, do you not have to specify colours, fonts etc?

[d.healey]

@DanH Yes that's only a tiny bit of the code.

    presetBrowser.registerFunction("drawPresetBrowserColumnBackground", function(g, obj)
    {
	    var a = obj.area;

	    if (obj.text == "Add a Bank")
	        obj.text = "Select a Library";
	        
	    if (obj.text == "Select a Column")
	        obj.text = "Select a Category";
	        
	    if (a[2] > 300 && obj.text != "")
	        obj.text = "No Results";		

		g.setColour(style.presetBrowser.columnBg);
	    g.fillRoundedRectangle([a[0], a[1], a[2], a[3]], 10);
	    
	    g.setColour(obj.textColour);
	    g.setFont("bold", 20);
	    g.drawAlignedText(obj.text, a, "centred");
    });

[DanH]

@d-healey perfect, thanks!

[Straticah]

@d-healey can width of the rectangle be written in % of the maximum length? For being responsive?

//colour accent
		   
		g.setColour(0x99ED3237);    
		g.fillRoundedRectangle([a[0], a[1], a[2] - 100, a[3]], {CornerSize: 2, Rounded:[1, 0, 1, 0]});
	}

100 in this example

[d.healey]

@Straticah Sure, just multiply a[2] by 0.5 for 50%, or 0.75 for 75%, etc.

[Straticah]

@d-healey this finally fixed my issue the accent is now the same size on each tab, independent of tab length :) ty for your help. I have learned a lot in only a week.

[DanH]

@Straticah snippet!

[Straticah]

@DanH haha i have too much going on in my project to share, maybe this will help? :)

//color preset select

	if(obj.selected)
	{
		g.setColour(0x99521F22);
		g.fillRoundedRectangle(obj.area, 3.0);

//red accent
		   
		g.setColour(0x99ED3237);    
		g.fillRoundedRectangle([a[0], a[1], a[2] / 1000 + 3, a[3]], {CornerSize: 2, Rounded:[1, 0, 1, 0]});
	}

did you mean that?

[DanH]

@Straticah yes, thanks!