Selected button is wider
-
I'm having trouble configuring the selected tab to appear wider and aligning the other buttons accordingly. Can anyone help?
HiseSnippet 1155.3ocuW0sahbCE1CgIJP6tMqZe.FsWrkzDgX3mjTkMpoPRZQsPnKjnJsMMx3w.VYvFMimrgVsRaeC5iTeF5yPuJpWzq6MsGOy.yP.QVHz5qlye96yGermia3HHTWWgCRKcqgCnHsOTu4PtrWkdXFGU8Xj1S0qgckTGi.UkGN.65RsPZZq8UJEZoRh7G+0WTFai4DZjJD5BAiP+VVelLRaii9Fls8oXKZKV+XdW7npDAuhvV3A7YM8bnAXx03tz5XkaIzQeM1sGR6yzIVEIEI61tnIF2YOy16Rauu4dlz8Ikr9bBASJ0lXVn.Fos9IVLovooDKotvjVVXMrYOwa3A.bAyk01lpDLQMAjCTipziYa0XTxwEgzR1HJUsVPp5SzqwrXi0Gkx1z2fQTDwSZZIlGkLW.JoEiRICnzyzaRbXCjQVT74CzqxgcvNXXuINUB7Ek3SWSuh.7fKy1GeM8TGPXbDYJVJ2NFEykaqCRqFvVjqz3FriQ8yqcU4ya05r5MMNznzAwL0.10J6IkfBvzqubjMk9FXN0dj5zcDNFYXfTtCLXFuL9jBJ1d6sR+yoMfQTjulcI39HB2kJqH5OPvAgLO22imarMLkaatEvXUniiOjQyaBBb49yvjAm0UEBW5HrqfssaCEoYDbeejRdnEHx25muXbaFmZzwiSjLA2XJOyPFA+NPty1ipVxorEDrsAy5VfpwfOKiaQu8rNQAA.kJU5T2OOFkuxZS4ck8BylpkSPFcprZVWnJbDo7Q9PCVXFX1YgKTzUg5g9L8EuHbADDCr9ea5oWtwml7WtigzwOhnQrTUcgjdFOieFAlLi6apSmYZKDJapyLMqt1wYdAlg60uM0I99gxQ3X1jmcW+86rKInTKliBdUNSd1.Zn7oBaK0YR02SeRGEVqBecd0iwRr5venNvuATGISQGsio2.W2FbUPJ8iotWKECfq1GWfiz1P5a8ogWTDrQfXVp.BDLQ2Fcmb8iFNV3ce2QugYIgaf00dIH2ix51Spjx.RR5sxfEfK9FZUdCGJTgntlAsPvmON7+3LgOhbylB4ejTnPLJ7tNKbFnviD9hwy.7EF9hOR3KEC9eyYgguzbgOc.7OYz+oT283i9F59eOQwWqXfCkBiA+um.7jZHDSR6OpwgTqu4l2kSERagiE0oI6mlnkj.suBaw7biq+lQGdmjwod.FmeUv3O5O9yecwY7hjXKrJn4uK93gqrD6Cw3hqjRg6Nj9+FiKsJX7c+xl+viiwS2VHzPpvxyFKmrKUU+6gFfe+MQqgp1+3tL4v382u.stlatst99Rwmo2fII8lMGSLCNB+X7+BNF1v+SzOoSGJQFQvj5m98Ka28O.7uR3IY7t0vRGFTVoW2qeSnDgPAz4pN1TkOITWBDHmSIqx.MobKeg+AFgFMUxZgFMGYD0GSbDWQBZ5Q8jhM70.bh6+jqTva+.YCSjeiPwyy8gW3bEgL4TMUf4W1.KrrAVbYCrzxF3tKaf6srAt+CGn5AneomTzO3XCBUqwI9cNpocBGCUf9Uqn+Ev0tpBcconst var NUM_BUTTONS = 5; const var PageButtons = []; const PagePanels = []; for (i = 0; i < NUM_BUTTONS; i++) { PagePanels[i] = Content.getComponent("Panel" + (i+1)); PageButtons[i] = Content.getComponent("Button" + (i+1)); PageButtons[i].setControlCallback(onPageBttnControl); } inline function onPageBttnControl(component, value) { local idx = PageButtons.indexOf(component); for (i = 0; i < PagePanels.length; i++) { PagePanels[i].showControl(idx == i); PageButtons[i].setValue(i == idx && value); } } onPageBttnControl(PageButtons[2], true);
-
@JulesV You want the clicked button to become wider by some amount, and the buttons to the right of it to shift along by the same amount?
I would store the
xof button one and your required width ofbtn_offandbin_onin variables.Then in the button callback, set the position and widths of all the buttons with something like:
PageButtons[i].set("x", x); PageButtons[i].set("width", w);where you increment
xin the loop by the width of the drawn buttons, andwis set based on the clicked button. -
@JulesV Here you go:
HiseSnippet 1231.3ocuW1sSibCE.1Cvrhj1cKqZUUubDWEVnnLjDftAzll.zF0BjtIPqzVJxwiCwhI1Qy3vlzpUp8MnOL8IoOC8JTunuAsGOdlLSfrvRR1NWM97iOe93i+qlmfP88EdHizMFzkhL9Py5C3x1UZiYbT08PFOw7Pruj5YoEUdPWruO0AYXL+WoDXjZATv2+7hxXWLmPiEgPmJXD52x5vjwRqU5aXttGfcnMXcRXc9RUIBdEgqnGvy7lYQcwjKwWPOBqLaNSzWi8aiLdlIwIOIOYyl4sw3VaY2bSZyss2xltMofyWPHXRglD6b4vHiGsuCSJ7pKwRpOxXgxBmA0aKdMWGfSY9rltTUCaTcHxZwGHbcTCQkTTk1LWmZQIJeDzK0hSayqSaeh4gLG1P4woukBTXE6QxDnwbih27ifmcR7xl.uwfjQBjVPizSMqS7XckwZT77AlU4vrYKLLOkDEssn49zELqH.K3x06fujdfGzXnGYxWH6ZV4ylckhoSmFlr7kVWg8rN5jCOu7IMZb7Q0s10pPwDppAyek6Ikf.P0qNKRmRdMLm5FINTd4y+dlirMHbyrESJiNTgc1rpv2R3YkgAsyVzhYsSRH.Aqt5Jo+kzVvWbjdE6Lv7ng2ETYEQmtBNzHyxAVrr0pPWtp8Jv3S45P+CGA2UGnM4l8vnNutuxEtzS3VA651DJuyH3A1Hk7PMfmuIs5iwcYbpUqdbhjI3V2xxLjnvuFjqc6QUC4TtBB10h4zGPMQ3Wmwcn8OtUrSPfRkJcpalGiyWq6R4WHaGlMUCGcF8VY008gZ1HnBh7tVrvLv3yBmpvUE0cUjlvz6vmLK2e40Tnti1IqW.0HP9Npj4Y.9OWKJyHkLedjIqLp0qTL06TXesxAcn2cXnGIBOeXDziDXB7Mou87UxNeiyVyR5AyYESG+kXt9HgjdLOSvTJzYV2TUqViUWXnbodiUsZGWu6xwL7dcZR8RVPoLD1UYzspLe6aUkbmThdsRBCE7pbl73tT9aa+UT3BL3uSptGVhU6uEJCrqK0SxTHXrG8J3zE8tcoL2i5eoTzENIa3pRjwhx.sOIbuPcxGwbTNnaXi5CMdzNgGXMX34Q+52UJXhOo11T1EsSbT1dkjz9R8.wGeEsJulGEpYT6nhdPXrgFi9SIFaLkXjSiwebmX3buXjaJwHuFiOyX5xF4mRLJnwnwThQg6DizZLdbzw0pMUCnXQyf+0EngcZiRwPf9ogPnETRT5FPTpaIlj1I5NUodzRKccVkhlBOGpWc1OOxs0zReI1g0yOo7qhVb+vHeiYI4eze82+9Li7T2C44lkj+mhOdvCm7GRhN+LsD45co+uUhTXVR90+1R+3zQ9suEMb+cgSOWrbzK0qd5SnB33yQtIs51xbelbPxmFMyto+6JhO0rFSRZOdFmaLLBGx99fwv2G8Xy8a0hRjw.tf4A+v6mGCgdonmjwu3PrziAkWlG0qScnDgPgnyUWYEjYLmZIltcVUaUFnNk6Dz3eguPk1p1FgJsiTh5fIdhyI5KModA1hAR.l3AuVME7rYnskMJ3hTIyycfGDdNgLZWcKG2XRcL2j5X9I0wBSpiaNoNt0j5312uip2q+k8jhN5kMHzg01O3VnFF6ywPEXP0J5+.goKbaA -
@dannytaurus @resonant Thanks!