Change keyboard note colours in a Preset within an Expansion

[DanH]

Hi guys, I'm using LAF for my keyboard. I have a new expansion in which I'd like to use two different sets of colours in a few of the presets. The keyboard colours will be identical for each preset. My current thinking is to create second keyboard with these colours, and use a hidden button to switch which keyboard is displayed, depending on the preset.

Currently I'm unsure how to grab 4 notes at a time and set their colours independently of the rest of the keyboard. Help hugely appreciated!!

HiseSnippet 1535.3ocsW01aZbDD9NrunBMsMQpeppeXKe5nAiuChM1IJMFafTqXGaYbRZkkUzxcKvVerK5tEaih7+49Ovc1cO3Nv32nJfjk24kcelcm4gYNLj6Qhh3gFlYOdz.hg4SsZMhI5sSOLkYracCyezZebjfDhzh1dz.bTDw2vzbo2IEXlcYC0m+8saiCvLORhHCiOwodj8n8ohDoGt06oAAMw9jio8SY8K2ZWONaGd.eHfmkrbLFf8NC2k7ArzrLVFlOogOUvCaIvBRjg4xay8G0pG+Bl19OQinsCHxEtFsfMRKtIOvWhXoTic5QC7ObbbGY.6xgI2BKouE9Yq8o9zIxStMdlRAJwiz2GlYlFdKME7buM3MGHYlBRKqgzysZ4ERGHRzHwy2asKCdb5fgq8zPQaqQlmk0ZGNXASTpO9LRyPXwDOrW2woHB9SgWmKGb0GIPmiCQA3Nn2fZv5RYjRdgDHXdW.uMNPuo6w4mUi42jPBrAGWcUz6a72aePsipmKG3ZoPRWpLgo4PlmfxY148CwW74dTA4CbAIeQTmwZ5VDwa+OEx80bYkGLFN1S.AkvvgdhyoJs5EtoWTN8hJmhVA4d5qykMWVZGjsTgObkWHW1rJsu3MHWH9x1sTDQnytrctrYyFUjegH.zzARHOhOjAoIGQ7DXV2.hMtHRoN6M2Y.v586cgXeJb61D1.6SbtTdgpgtFy5yKpzETQuZAC5gsGKoc.jbWD4TZsBItT4zSUm38fnqRGrmQFo2Szu8FjSZvEGrSYzid66wOmD9+Kjk21NNU2bipEQtyIZWc0zv8V72s5ZUWS5uxkwuEn2htqfA8Jz8Eqvq6z4FS8.U30nUWE.PmNkUezoKxD54tiPpncEzuiljpTDAtnOAoS6AkT1iC+xStxz+UmroKEXPkhj1KoPrKQHod9PrB0aixpg8aSjOq5mrwNVhBn6xC5Xmem7EjYFq3NmTiYh0wZaBrD14q0lDrxQjtCCvgPUqakXCjARs.ZWFw+XxkhIGYQzII4AnWfhqMK6LNXKKUl2CxcBI940YZWIQ9sSarsDXORZC3ngppam7PxWLKAR0SmGEgi5iDnwonyl62roNsX5J.o7JqI+l7LGmqK2GU9Hj1XiuaxmxSdTuENsGNwzLjNOjx0MqWqA7nWxovMBh4DE2SX.OzeiHrbiIrtEFq6mZoVkIwZgzrQy9TmX2ijeu5bt.e.DoPRoL+4wyldSpQ8qzcxEVdBu+z0.2j269ovj0ziqUQblr58.lspbM2U4PyppSm4pS11RHOHfDNW0xVGCuKGsYJhwhPKMACISLD5mZ5lzdxCqIMOcWToLjy1kQEGLfDu9t6xzHtML3+93t0wBrrKuXYfcCHgBpDNl0ImCsLq64KqUcRzYB9.ks8GvYxcv7oh3lT0Mj0LfiETV2io.ro.B9IqzhbMtLoG6+XqQIKDacA0Wzyvzx7WyXXziP61SHWwRvqFH4rdOYTaNNz2nc2wcnm8I999WK2Hn0t9IRu95q+kokVNVrxXA7aFIFOdPA0URlSMs9ZNDJObZeVBs7uB49xRNEkxpSiFDfGc.j0dd7u5Ap6fChHJ86wu.bCDsoZ4eR0qbKWUsdmgQBdenlaPOpWzTdVmzAOLPTav.BNTNACnUDNTqT8KPvVcDbgxAENkVeS0mM1.JBcp5pr5XdWnRZetOYpcV9K1vvCLFIPBEkrOFQ9DT5wCSgkImFnrY.VzRLJXlc5vFieBlUNjIGJRNkxik2f4m5rWO2UvnW2XrBXfFtO7K7homxQNZWrBnpZpQKjiOvhnhQoG86QL5iycN5yCEhO25Ppvq27wXl4fQnd6aAFiGX7GrZzoC7pl.vksZ9WK5zg2ywCD3xh68whPJTaaAECsfxIOR7ycjrFNirFVu1QtVdCzhv7UKj0hwJckqMiU5NVoQerWH+KdZtT4HoemRBfIlZZ7rV6KWibMT7qfeVNkbL5CI7ewySF9q.zfy2mxKfOUV.ed4B3yZKfOqu.9TcA7Yi6zGIWSsg.Gmtb.DbXCEqpoYCFFxrTYgF+GjPaU3L

[d.healey]

@DanH said in Change keyboard note colours in a Preset within an Expansion:

My current thinking is to create second keyboard with these colours, and use a hidden button to switch which keyboard is displayed, depending on the preset.

Keyboard colours apply to all keyboards, so that's not the way to go.

Make an array containing two sub-arrays that have the key colours you want (we can discuss the details of this if you have a complex colour scheme). Add a hidden knob to your UI that is saved in preset and will be used as the index to the sub-array.

Then in the knob's callback you loop through all the keys and colour them based on the values in the array.

Use local laf for this not global.

[DanH]

@d-healey Thanks, I'm gonna need help with this one! How do I make a sub array within an array?!

[d.healey]

@DanH

const myArray = [[], []]; // An array with two sub-arrays (also called a 2D array)

[DanH]

@d-healey thanks, I only need two key colours really. Do I need an array at all?

[d.healey]

@DanH

Do I need an array at all?

Yup.

Tell me what colour schemes you want.

[DanH]

@d-healey Undecided but lets say red and blue.... alternating every 4 keys... 4 keys red, next 4 blue, next 4 red, etc etc

[d.healey]

@DanH And for the other one?

[DanH]

@d-healey the other keyboard is the normal black and white...

[d.healey]

@DanH In that case you don't need an array

HiseSnippet 1315.3ocsV0saaaCElJIpXRcqaEXWsqXCvvrQcckRyRRa1PSiiSmQaZLhS61MCELRzVDglTPhJIFE4l8jsWlc+dCxNjT1RNMKq0.yWXnyeemOdHOGx9YxHZdtLC43c7jTJx4KcGLQnR5jPXBTu8PN2y8.Rthlgsp1cRJIOmFibbV9kZENdqfL+96muKgSDQzJUHz6jrH5qYiYpJs824ULNeeRL8X13Zdu9N8hjhNRtr.3yxtAnTRzojQz2PztsjKx4NciYJY1.EQQyAe1UFOYPh7bg0+2wxYmvoZgPz..HqZTmDFOt+z0ZNB4rR+pU9x1U925d.KlMSeUE3aLFvUQTuF3rzsQovOCJ4TiRqXoz8cGDkwRUUVz74tt8DvFxPBTpqSEqunk9qkc6HAODp1iImR2OCDlEQiMBBZgg+ZtsuOSvYBJdXgHRwjBrTragRIEg53yj7FQxwoRAfTK7YDdAso+G78hL6PuhN4DIIKtg0v19WB.NMuinpNSCswpkftZy14Z8Fn6P37Sfs2FWOm2DutVFGKisL4wOFeDEvDCfgOkNI22anLC2fg+Ybv1XF9mvgqsE7wCeXSeOuthQ.rZR.PYOm0f0BGbgoX3wFha7.C13LppHSrMFRP2KXJLXRa.yxwA9l71qRSHVkPE3yo+PFEmPynsvmKkIR4Cv1jnsWROeOtLhvgUTgPsckj1sdhX5EVlCIH.957DlBPKD9LiFqi9VVdevCrOEPvi4.EB.+7R5j21fK9YyjAvM4rCP5bpgt1n8MX9uT2lgFSk7BdZBoQDTLa+jlMsfM2ZGpZdlEMvrF1OdHNrI96wqa7tmHJiNFNtTl8B8AVa5M6KFMMw1J+LWLaHfHQgGSIhb8lvYTnXQhRnw30agykXELkAqj3gbVpITltl..6MecOD+n5EMX24R+Kq0a7Fohdnng4jm+k93qaZ3vazV44ZNM6FMqmAlcaA1PTL9DZV8NPsivPh4m7bmOsIOQ1VzZNJE8DL0gozR48k7X8DE82e7bJTYOtdhUICAWUl4U2qbdksiFw.P7bKauQF5W+tAza6sGQQlBDfIjmTZlhoWNN6QOCt6vNHzycOZ9oJYJbMvrAKPE3SHsWfbbct.x1D8GGiLqfYHbWU4reKB6ykDESL5XFT3z370t0UYPqZALYlvex2obIX4qu6zgUnSFM8FMu6DGGek1cn6abk1qt5puadsqUp13rhdgpx4o41T4V52cb+fOFuJjsekEqRV8Y3v0aGzRqaOVdJmL4vHE4L5aLmg.yCI7bpw9qkmCgApdpQ7WXVov01zH2oHWIG+xLRZBKJetH2iNjTvUuHMkRxz23CVUYEVi6xgo5.TGAUMIXHn8FO07aqsB17oAaFZ75X4nQb5AvDz4PVeQKbwqPP4ZpXz81b56nQvA8ZbYV1.i6yIpApI7qgT+tS2BttdngISUkk0lpuqHtVt2v+Rz45ZZ0l7erC5iuiFdcfLt.3v7OYP+1nRCP27b2SquKVjyTSp+1oOi2QDbqui3Skh22sOSEkbybboafiPe5+Gbr70Weka2gCgs4JBth69+1h9Tq+izejrP2Re.QkwzyGftiAP+UDsb+OWOpXI8jBqbfVVWAFPEwFAcyYowPsrSowvoFQiIQYx2GYmPpee2WXz.bRXdNqG7tZPFOavnqaP6.zXnC38QQ5k+ifwu2bLqs.w7jEHl0WfX9wEHlMVfX1bAhYqaMF8vmWT.C8rsCfh9cMiYcb5JHvIKyoPz+.h4yrg.

[DanH]

@d-healey that's clever! I am using LAF for the normal keyboard, however (sorry when I said normal I meant normal colours, not the stock HISE one).

[d.healey]

@DanH

Your laf should read the key colour values set with Engine.setKeyColour.

https://youtu.be/et0QAQOjhyk

[DanH]

@d-healey why is that better than what I have already?

[d.healey]

@DanH You're hardcoding it in the LAF function which means any time you want to change the keyboard colour you have to edit your LAF. If you read directly from the key colour properties you can change the colour at any point in your script.

[DanH]

@d-healey Can you show me how I get it into my script pls?

[d.healey]

@DanH Something like this

HiseSnippet 2036.3ocsXstaiabElx6xfRkKMAn+p+ZVADDptZ0RJYuxabShkkkRMV60F1NaZggQvXxQRSM0LBjirsPfAxCV+aeO5iPeC1dNyPJRIKeYc5JCXv4Ly4LemaejybPrLfkjHisJ4b7zwLqRel8QSEpgcFR4Bqc11pzWXuGMQwhIFQaMcLMIgEZUpzS9QTPImmZo+8e+gsnQTQ.KWjk06j7.1t7QbUtzC17M7nndzP1w7QEV8patSfTzQFIm.34I1dVioAmSGvdKEW1J1Vk9jtgbkL9HEUwRrJ8zsjgSOZn7RgY8uimvOKhgC7sNBLjQbOYTHhXTpUmg7nvCx76DKvJGjGEdhIJ7mr2iGxmIOOZ7k5IH4ZTLdTZk4g2SlCd9EgmWA3sDHUp.jdpARek8QAw7wp7YP77o16HfjSeJD1KBEyZsV4e+41cjvJDp5inmy5ECClog6q77pQf+Ucixk4hHtfQ5OQDn3RAQJ1ZhRIE9n9wxH2.4nwRAXoZjKnQSXUK+qkcBzYq2vldljFG5ZlXixWCFLaeGvTcxT0sRpQqTsdBJWa5NznnyfTs6h6IhqW9RnxiEbNg2mHjJFQLYzYP4HOgbVDnD4b1za.ddxV3b.tbEZbFyTShED2S7qQZB9bMx50H9dmVmKBYWsee2wz3DFDYf0S9Zheipjm8cjW3i9xMiMK30ijglnAf0CYfeQ.GBwURYm9xXhKm7cDuMHbxeEr75vCO+4UK6.J3.NkaAvxqBxcb5JF.6GFg.glFBWdMh4oj5WxUCaGMdH0MShNRTi3Ue8p.hcbXQIrGkgtbHWwxMz0NNkKqA4yzNIwDG2f.dZ2q3JLofSfYCux5.vN4R7IpgLA4R12DyHCYwfguTJGJkOKEA37owoxNQx.ZDDZmHTajOBW1NXNxDBgMvCdJEl9viwrPT66JNCNgSlAgULmQAEH+.YN2m7syFCFWumc.Pmvzv0ncYsMevg2.Lj1DBoZiMmuCQMGsSCHy07vyI9XQ3p5UuiHHlMB5cR28IX2qY604EsjpDSje1RzIDXHUQFwnhDLIbACBVzfgrPxp0HIRhBneIJIoeDerVUcy.V2Leb2m7hhAMrt.6Jfs7Mc+Gase6C2tLPbmnP2Q2QrKsOnVFA.fefObWL9uqTddaQXOFKxEatMpcAMlzKRRUbwfi4QL+BJOO6wbqpBXg4DfIharMEvDtiEFBY2Ab7Ua8R6qcqDFSu7mwZf2BLMUpMqi2cPMh7r+otIGQKEP3Iff5Tv2Nw6T8rlA9EGzn3flmBwQ+S2.KWwTGNQH7xArkWO6ygPM.QmAFtQc4DtnyyJtvVxA06Cu87PHICuS6PVfhJFDwbo.ult0+lFG4Yzl7GiogbHN1CLf6IdWgr+Fzaf8CfeYsp4pz7zS0638fnqK5uybEjd0qH3tM+8Cx7CkWvh+84xdW0qmmWqWudKfeYId6KeYQ3dK562ZsVqg5qUIKW.DM2ky.7N2mupoiW19qSPZ5E..862P+yTtf0zK0hP0naSxegLqToFATwrCnR6BbatYteiYgLy+MEaltA70x32nAMEoLhPWK9cRuMcBctQuJ86tw9PcJKSwYuEtRmJYu38lkFK3qYy1ShLCsOiE8hCYClDQigFW+loK.cj1Q7ABV3wrqTy1xZjSxqC.F2z1yFdYNaCbxJAPsC7RfJlJsqeXLH5Wm+Axf.P.5ttcdDj5XQtjVmtHago3E+g.NsTcwdfd8LkGy2IfxatF9Wd5NslGsittDJebo2MITiYI2agd6gSPs.4yCos80a2tKj7q6U8FNwR7h6wMfD9GIhK+Thqag459oXZ2bluVsHqzho5708Axy2ZIAvG.gJTTh0Oe3rp2jhzjktSNwFy3+muG3l7e2OUF1aW3rOX269BWc6J7sNjEmpe+kNW54VhXwKcZ77tw2khtlC2T7DV3BgCAN+IKsu8SVV7fuAlOhpvBkhcDb09iYha63vVoe4EdJzTTAKUoOC5WjdFTyozr3vQMcrSOxlkFxEO6u0Osy1TEMyPfMg8YLKVwQWnz1rK3ALygacr2lkbtRNFNl+rO2C75Gv1dEDMJ8ufcaJ9PeKsGLyBelJ877FKT7yE014OZO2WPhVKyA99MmlOPs4k7P0vYB9O+1lCY7ACyuVie6jMS8RiKU1N67gVmMH6RMb9jvvv2iKG9FyQ4Re+6e+eddoMREqWrBdyU9hyBu5f6JmVx9WKSHUfc6mQHV4aI9qV2qFJaadx3H5z8gdlKRe2KLceJb5P876JuDTCD8Z8v+F2LxuQK83NSRTxQPG+3g7fj4zbaVe5jHU6wiYzX7RefYUwSLSlcb1Cg.qDlvq9qds925qCT.ds70q5X4.nOdO3rhyYY76F5LjJDrHDJZY+TB6cPiuLt.Vlsavj8hnpiTSiVvRGzMKErnbnOJVkuKMxj2UDVXueU4qsrt4Mw7k1.nguyPM+ECg2FV5DPO8b2FCdiKhDtZZwaK6+a2VzCEhek8AbUvvkiwUVBFgN2OFXL8N19b6t86CY0b.9T6d+8ONWnlE75CrIeOpJliLFPyvQP6T.KMcibpkVA4NLi8vwXD3HlHTO.6ESmzGGWJcR+rIsFQChk+RfgyDuEu+fVBfIg9BLcr2CGSlQUZa6U2yZDTv+KAAn6+BfPd45z3QnSyGgNq9HzYsGgNu5QnSqGgNqem5fbMsm.bbl1APvAc0rpkJ0UPgJKcUn0+C.O.zZL

Your script needs a bit of cleanup. For resetting the key colour I needed to add a function to check if the note number refers to a black or white key, apart from that it's pretty much the same as I had in my snippet.

[DanH]

@d-healey Amazing, that's working, thank you! It seemed counterintuitive to me to define the keyboard colour in the main script, as well as having an LAF for it as well...

[d.healey]

@DanH It's the same idea as setting the component properties in the property editor and using those within LAF.