Preset Browser - List item background

[DanH]

How could I design alternating list item backgrounds like below:

[Chazrox]

@DanH I think there's a 'obj.rowIndex' you can reference. I dont know how to go about alternating the colours tho.

---

Yup thats it.

Heres a dumb way to do it because I dont know the odd/even math api.

LafPresetBrowser.registerFunction("drawPresetBrowserListItem", function(g, obj)
{
   	 if (obj.rowIndex == 0)
   	 {
   		g.fillAll(Colours.darkgrey);
   	 }	 
	 if (obj.rowIndex == 1)
	 {
	 	g.fillAll(Colours.grey);
	 }
	 if (obj.rowIndex == 2)
	 {
	 	g.fillAll(Colours.darkgrey);
	 }
	 if (obj.rowIndex == 3)
	 {
	 	g.fillAll(Colours.grey);
	 }
	 
});

looks like this just to show you .rowIndex works.

Does anyone know how to do an odd/even check in an 'if' statement or something?

[d.healey]

@Chazrox said in Preset Browser - List item background:

Does anyone know how to do an odd/even check

Think I might have made a video about it...

If (i % 2 == 0)

[Chazrox]

@d-healey

sweet! Thanks. Thats a cool one.

@DanH

	 if (obj.rowIndex % 2 == 0)
	 {
	 	g.fillAll(Colours.grey);
	 }
	 else
	 {
	 	g.fillAll(Colours.darkgrey);
	 }
	 
	 g.setColour(obj.textColour);
	 g.drawAlignedText(obj.text, obj.area, "centred");

[DanH]

@Chazrox @d-healey ah perfect, thanks guys!

[ustk]

@DanH the modulo operator is definitely your friend whenever you want to loop back an increment/counter.

I would just write it as a one liner for less clutter

g.fillAll(obj.rowIndex % 2 ? Colours.darkgrey : Colours.grey);

[Chazrox]

@ustk

@ustk said in Preset Browser - List item background:

for less clutter

obviously the smarter way.

[DanH]

@ustk well done

Does anyone know how to add a column to the preset names perhaps? So not a new category, just a column which could display what kind of preset they are, bass, lead etc.

Currently I have a 2 letter identifier preceding the preset name, but I have lots of space to write it properly now.

[ustk]

@DanH something like this could do:

HiseSnippet 1428.3ocsW01aaaCDlxMpXx60Bre.DF6C1CFt1401FTrXGGuYrjVC6ztADDDvHQYyEIRCRp7BJBv9Ir+G6S6e1919X2QQIK6Xu1z.LAmHw6dtiO73oimFHE9TkRHQNkO9loTjyW3N5Ftdx9SHLNpeWjyW4dDQooRrUTmalRTJZ.xw4Q+nQfi2Znzq+9G5PhHbeZgHD5sBlO8PVLSWHcvd+LKJpGIfdLKdNzatWeeAeeQjHA3yibahlR7ufLl9JhAVIWzOQTSPNeuavlmSIqSZ97muyl6P72t4FquSycdV3lTx19A9asILZaB4bjyiOHfoExQZhlp.m1QDbynIhq31I3sLE67HpYPKzHXlshQ6OgEELHO3nPHm0FTDpdjMT8stGwBXyjWDx9lTE3BKlOn4T5CQoVeBTxYNJslkROwcjujMUWnwvmO2sOG1ACIvdy7TwhEU510b2W.H35FwjKn8jvfYVTc6lMqig+Ua2x.JkHh1vOhRjUAAkKC6XJM9RhDVtTktiTbkhJO6v18vuDm6UeIEVrGJ7IQGJDWzlGziRiRcPNjwT89h3oBNLnZkdQBhlwGeLKh1pRsFJpdIqu67Y7VAaXAfiXgLpTAD4jJcZWoNtR2gUNc24P4SzljqbHiFYA8liFYvAW2cRZHoiYlWG5kv80LAuZk.I4JCLZNtCA.80zXvWg4nFWGKN+2pU9ck8FaVM1r7p1apFWMgoovBvqrmgVDfOCo9ZBebDsJXXCBDAs5Yg3TI9hnjXded.8Z7KeId8Zk8.m6YW66l8Dr9xejCqSyyvubWnoWC6MvF.j3ppV4rJ0.mj5EOV.FCjXFJ0zHlNExIMOcW7SeJFxhRhgsH7zz0dp+wLEte2yrQCSf03JfCFWkGpOYtclFLC8ecXUVPsSMjyK0Kqddakh3V3OZjhtBvvFlmGA1ghEWZRhiOjFpqtgIw0Ch5l8o1QrwbZvw.ZXNqiIv1cDfpRsrPy82byjuBGXhsLUWZHC.VEVzEwz488P13I5psrNeEdGLz5boAn06vRG9YW7uakbJORbGdca4aqsadpHVvekPSeMuZZ1X4aKiuqpvvUpy7ppTDEQkqTsoXt7CYXUdR74TYc3MunD5LfPwqEqH936WEQeaki4.JfWGX5WOklMtmHJvToy77x0OQYkdfmdS+tDMwTRMSFfaJUpYF53zkdIbHls.qmaWp5BsXZJ1r5UPEVc1IB1RpyW9Bw.F70tKTQCccwode2d2LavuGt2Ur.MbFmqyKJgPSnlceyn8blwWKQ9Z2Ep4fNeb9AmdOF7z+XbGTSItP5e89+38KJc8LvoWoQfR+YI22UFiqXhpiHWR6jn0BdkWf0xDZ8bMGb8TBWAatp1p8SqCAHBIPl4LHowd4pM2jjoVxmPNfE9BpJDCokv5Ez0p4LiZGDr5oXH0794p00kFQ0+G5FAGr4OoCQNuhdjKERHrYZOYFKJHw7pWvrjnnAD8jb8pEBRYq09PbLf1QHgn0B5eURrMzZLaiTQ1w+hICYHjLI.Em.xw3lMVeq5K8zVv8SSMzbhTa3DjYjOyr5q51LqrS2PwUCHAAPp680tYwvNhDdfg9mXUbjPlE1uqlhTs6pIO3sj1x2BcRtTCPPqWhfjHhdw9wLcplo.xZWnIHSiNvdf9l46j8SnIslevlztuT7ItCXZ+IqlikVAGghU+evwrVa+R2CBCgFPJH3Zt890GZerejoenHwTY7HhVxfBitPl+Hn5jOElcNGNuyT.rjofscbSyXSDXDkGjN38vUlxVlwNYJakqDES7khy7sGDYZd9yRk.bhm9wEdvW4.iwsPoGNMebNF5k+Le+Ec0RFt9C0vMdnFt4C0vsdnFt8C0vcdnF9rOtglO0pchVDaesAgNZvAomk43b.m.YfoYqn+E.+3Ojw

[DanH]

@ustk ah nice idea! Let me try it out :)

Although it would be perfect to make them justified to the left in that bit. I'll see what I can do....

[ustk]

@DanH just do this instead

if (isDefined(cat))
{
	a.removeFromLeft(150);
	g.drawAlignedText(cat, a, "left");
}

[DanH]

@ustk thanks! I'll DM you as having trouble getting this over the line!

Is there a way to have the browser pre-select a bank? This avoids the preset side appearing empty when opening for the first time.

[DabDab]

@ustk said in Preset Browser - List item background:

One problem I guess.. If a user doesn't know the exact way to save presets name like

Category names like "BA", "DR" etc  and  _  speparator

the Presets name shows something like this

[DanH]

@DabDab yep, will need a safety built in

[ustk]

@DabDab absolutely, it was just a quick draft but more safeties have to be made, which in the end are just some undefined checks

[ustk]

@DabDab you just need id to be checked

		if (identifiers.contains(id))
		{
			a.removeFromLeft(30);
			g.drawAlignedText(id, a, "left");
		}

this works even if a user enters a name that contains an _ char

[DabDab]

@ustk said in Preset Browser - List item background:

  if (identifiers.contains(id))
  {
  	a.removeFromLeft(30);
  	g.drawAlignedText(id, a, "left");
  }

But if a user only enters words without the id and cat the name is unidentified. End users must need to know how to write and save presets otherwise it will not be visible.

[ustk]

@DabDab try this

HiseSnippet 1448.3ocsWssaaaDDkT1Lnh8RZ.5G.gPePpPPPR9VRMBpkrrZEpbhfkSZALBLVSNTZqI2UX4JeAAFn8On+G8o9GzOg9oz25ioyxkTjTRtMvngPW3NyYl4ryNb1kiDbWHJhKLLsO81Yfg4mXM9Vlb5gSITlwfdFlel0wjHIHbzh5d6LRTD3YXZtw2pDXVdSi3q+5a5RBHLWHSjgwq4TWXHMjJyjN5fumFDzm3AmRCygd6CF3xYGxC3yQ9rgUSiYD2KISfWPTvJYY7cjnoFlekk21W.j1jlO6Y6s8dD2catU68Zt2S82FH6554ty13ncIjKLLezQdTIWLVRjPjg4lc4d2NdJ+ZlN.ulFQuH.TCZYLFirVbedfmZJpjZb3TZf2nzDUjA5kQYosMzosuv5XpGcg7rz2mGqvIyh7IPyREo2FEnWq7zqYN5sFJYliRapozSrF6JnyjYZT74isFvvUSeBtNkmJZrFk9iMsNjiHXxFgjKg9BbvBKptayl0cvepsuMhJhG.MbC.hnJJv1FW8hjNWQD3zEhjcE7qi.w4C6z244Nod0U.3jcH2kDLjyurCyqO.AwNHExDPdHObFmgCpVoe.mHorImRCfVUp0HBjqX8xwS4sL1P8PGQ8ofHBIxYU51oRcmJ8Noxa1OGJWhTUnkBY7XMnWc7XEN7Z4fzP.SnpGM5Om4JobV0JdBx0JXPJtgHfARHD8keJpI0c3W7S0reqc4IpYithup9unFWOkJAbBT1trhVDjOm.tRBaR.TEMrAAyfZ8TemXIt7f4grALO3Fmm+bm10rKiNurdtuexc37K8VFNOQ2pLUB2DKF+j5MkHzkLIVCGUsx4Upg9K1gkodNN4LrQzr.pLFxYMeixMkwnnPjlLOKWtuAUQvW5Wk5USCN1kXTyCZQfQTp3pCb4knb9H2R6rxDbAIjekplMbH3KqtkpNUoYRC0BSm.5DF3cJZN575NDb8M.wUQi5Na8W662Sq5GEsV1Sw.yVWadiu+NwW0xknoQ8.eJ5lpXpJKAuRjasaxjX0XiFtbnuKM7JrCQ2Wscql0UecvOjFSA5jonUMaDSFDNDDA5pkUCPZxdonbm8c01OsZ1gydAWBujUMtf19NamkU46uVcpm1E7f.PrV0p8FD+aFVkMO7BPTGe3MXNr.H1+qXSUq6uoZ9d9t5lO4.xwmnnxWNCX22NAFIcrv6d0fdDIQ0INQFhaFHjTEEL6AWg6Cp6KW1pGDcojOKFaRaNrwrLYiDcm37c8LnXK5GaUnQnwMYab9kGb6hA+r+AWS8jSWH3O+kCzq5Y3kGjvQMgdrUgVVFWLIcO3xOBQ+2JSvVRgYR+828quqnz1IfiuhyDk9sRVu01wohJiNlbEzctTxYU9ZGoXNTOUyQ2LivhvE1nNQGF2FCQ3SvpxEPh2MVrdyUEXQq3Sb8WCufpLwXIINeQc3CFoF0wya8g3DP8P9500CB.48naLtun6ztDQdE8IWwEXZScRmErHiD4UWvr4AAiHxoo5iJjjRlqCv7nGzkKvrUA8uXdnN0pLaqXQ5w+fpR4DrnhiJNCk6fcFZuS8UtaG7+2DanZCsN3FPKHehY0W2eKrRGtS3WOh34gkvuu1sHG1kOm4on+YZEGyEIo8k0jUpsrlzj2JZsuCOT5JmeBO4F2ad.QV73bpC8ln.qZKbFJ04jv0.4s4OT7+amw68khOwZDU5Nc8brzZ3H1z5CAGSNY7mZcjuOd9kLBtoU+e7CywfMNgOW0g7XhTPwFjVXk+Xr6jKfQmwv85PYlkTMt0iapFqx.iAlW7f2gWIJaoFalnrUpRiPhqfetqdSH0Yu+nXIHmXwumRY7ElvwNsLh2XJedNDeUfyccK5pULr8C0vsdnFt8C0vcdnFt6C0v8dnF9z+aCUuoVm4Rdn9wFCiiGcT7dYllGwHXEXb0pw+bl8Q4G

[DabDab]

@ustk Excellent. Working Correctly.

[DanH]

@ustk Got this working nicely, thanks! However I guess what I'm really after is a reflection of the preset tags... @Christoph-Hart is there any way to dig the preset tags out a preset and display this in the preset browser list items?