Smart way to make an Expandable GUI Template
-
For my projects, I have a template that includes top, bottom menus and automatically positions according to the dimensions of the GUI.
Therefore, instead of using direct numbers for the plugin UI, I use variables such as
GUI_WIDTH
andGUI_WIDTH
in many places in this template.Now, I will add our new feature, the GUI Expansion button, to this template,
I need the bottom bar to be placed automatically when the GUI is expanded vertically.
But since I use these common variable parameters in many places, I was going to ask if there is a shorter and smarter way to handle this, friends.
HiseSnippet 2020.3ocsXs0babaEdWYsIgr1owyz9ZGD9P5J60TbIE0E6w015lkZsj3XJm5jLdz.sKHIFuDfcWPao3QyzeZ8eR6Og7Peu8.f8BVxkpxZZnkkHNW+NGbvkC5EyCHII7XK6Zmd4Dhk8cc5eISLZmQXJy5vcA5Nu7MGh1kM1Z6KmfSRHgV1124kR110V1R84Wd113HLKfTPxx564z.xqniohBp8d9egFEsONjbJcrgzq87CC3rc3Q7o.TtiSKqI3f2iGRNFKEaIGK6uXuPpfG2WfEjDK6k2lGdY+Q7Oxzx+8zD54QD4.eq9fgzj2mGEJQrjp0NinQg8xB4DKvJ8JR.2Qm.9cNGQCo4zKRDeihApPCy7g8Rkg2cJAOeS30x.dU.IaCHsrFR22oePLchnfiDO+FmCYBR7.Lj1MghVVqkFbOm5PRMQf9.NFAShm8WOb2SO.8TT2VsdxLrNXuCe4AmB75zt6SpWeGNXZln4X76I6GCCxckatg7LTbEPGUcSyPx.R7N3nnygIvDWQ7ThjY85qtJ5T9DTOLiDY3bf1Y8XQfmy7INLTIjaiTdM7Psfe.yjIRBQlKlPhETRBfuw+49mbro7epwGoghQMdrAZaLhPGNRz3wcZckFRRLsMWH3imCVZxKDYEr0fyHE9HTma.TKYfaHZkv80RhYf9G4KD4RVJNWC7ykogmQ4wiPs88PabSCASi7oFv7N+i4y9MdLpwKhhPEDf3ZBNFL5N7wS3L3KRYJkLxxEJXjmEziDbdjfNQpibSoXRB8morgH9DAkyPBNBvJRLhfnY0qHPDRCcJjAaljLQRTh5CvrvHRb8OUuVQ16nCO9re7jSNBRasZtArLwj2KdaFu1MKyRR9r9mtWOkd9.y50L4GFiGNjDuKVfAI9Ie+Vd9s1xyesNd9cZ401eSu02.FtA700g+10ac3Os1bNRyn.HQqz+UAqYHkK47rlwMasUkvqijTKusVO2AkoLOBjPdcfRmL90qc8XrrBU.zRdbA3rUau1s872rvIkorPb520eABTMLyjuBbVxiJb5CAOj9QuSWbTQ4QOrXjw50fXBbXhjnKT9pTwPvlQbbnb0nrnx0n.SK6LqNUKhgSxDulOUPYD2ASYAxEMtCWodMXIPsgRQzm.6p+SRyOREidQzjQ3bJmGAqi8PthQzjlgf2ZNh+ARL569NTAI0t.6BHZEzyfkCagdL76tcWQhLvOCfq.nhJinwCVT3gj+rg7+uSJ5U5Hgxh..ix.LRYcYf4NQFYdHNKMDTimABP9jydRNSHFOhOMgrCDL7XWvbOKc6G0Nq6viYj3WK2WIUjF.3abLOdLNJkfGJO8LhJH.xkmNoPbpShISjoZ0r1UxPn.xyLs3gROfr5YLMTS28rXJi7An7HMlmch3oHEW8HIjfenCzpzLHhF7dRHnpRWCk+YvsvcWhEfA5SDPIxvjlCIBIbdEnbjJXjQSg0FKQ2aljasXhXZLKULSAkyy4RAT+1pJUj7JLgbjZkAEOjyvxiwNRVzm72hEEWA4AEGa8PiyfePoKljZofowxCdTmYdswXsrUj8nWnN+rkhZJ1Khn2h9SnhQ+fN.L0qjrOvD.qfVs3DWk0IQIjqy.+P0FPGj43KC8iwWzO.GQ1GG.2I0XKEHZgqGRHrs4SYgItCvfeW4m57t4smY1OcgTUkKOrHUkCiRp8PHNJNdbUT6UpVtzI3wTlqIcuYBlEn8iRUevXd3L5m6bspU4zXLaHYF0xtIfW949EtVlajofS4uIg.FwTyzhWnTwrh6aeZgBpJE0ZgZ4kgIlkgERp73UoK7xVsWZ6E3WWUO+5g6cArCTHZ6ovVIr50mcqSNSu0llurnHlG4FjcWLO3vnHX6H4UhLt72Ap6f4ZbG2GpEDpIa2UdY2qLZYXHo3xctML8WiUzGwn7Z9tZUhora7V7wHFNlKHmvbUvDBdzrrFLnRdolFtxWkrkMjFecJ5xlN9bRrYRRJHzkV4V+bVbqelclFnyWFBxYGxnhSlPXKpeUqzjrrMwTTAhJTMI90oMIpyiVzPIIyTqkB2lcna8lCkWXHyZfgKtmOPaWxGfN30sfVyYWRx6E7If+xmdsrqq888xZPUdvkx00bRaFy5BHiXKc1kYeQcAePju3eaqgg9R9RJ+gTfAmqNN60.tqyZs2biM2Zs06toAi1yv4bdbHItODtlgnl5qwgzoIlzkQbdT7kkihWgOOMJ9JG02aKChTc+6Cd9klFZl1YLibA4BgrM871dsHPgBN+Y.rtIIx65TzczL4x+n8MJW94kXlOyuk+Vc1rUUY9TN1K8YjK8Mxk+qR4xe4YykKKE75z4W6X1w90jQqsnL58cl4lV5z5+zNMs9klkn+dqYSqYTR6E0xdUmOqdQst9nrbGzV1+VmRcPWJDW9ltxuHk+OF9bUPdg503l6kl9Fmi3gSivhxO7k709RY.wVoWaR9vPrDpnzD4+2dMraJDuuSOpHXT0XboJvHrCvuFXL8MDumydCFPBDE.bYm8e6uNOXnktitgvEYhoxJ4imNtOrJMf.dmAk2xijrWRd3gdbqrMQ5SXgpA+G3SJSe4X6Tl9YLsFiCh4mEnOxQ9JkekhBfIl5AZq4bjbLxe9CYFSComEDT1TyoX6aqhctsJt1sUwt2VEW+1p3F2VE27+shx2z9ESgcezKarrNp2dpKEXauGStyppZ05+Bfk6vbB
-
@Fortune Just move the panel.
HiseSnippet 2048.3ocsXs0babaEdWYsIgr1Iwyz9ZGD9PlU1qo3RJpKNiq0cK0ZIwQTN0IYb0rZWPRLdI.6tf1Rwilo+z5Og7OH8mPdnu2d.vdA6xkJxZRnkkHNW.9Ne3fKGzKh4iiiYQFl0N6pIXCy6a0+JJezNi7HTiC2Eja8hWcHZW5XisuZhWbLNvvz7duPn1r1hFxO+xy21Kzi5iyEYX7sLhO9kjwDdtzda92Hgg66EfOiLVy5U17PeFcGVHaJ.k6Y0xXhm+a8FhO1SX1BVFlexdADNKpO2iiiMLWbaVvU8GwdOUY+2RhIWDhEMbM5CcjR79rv.AhERM1YDILnWZHGa.8RubB3dJB3OZcDIfjIOmH9RoBTtG57g4BEg28J.OWc30RCdU.ISMHsnBROzpueDYBOWi.O+AqCobbz.Of10ghxViE9oGXUGH0XN5cdQHXR77+9g6d1Anmg51p02TR0A6c3KN3LPWm1cKqauWe1oakaQ6tf202gACNk2br2aw6GAMx.ic1P4n00KA9HyrZFfGfi1wKL7BXJN1lGMEKTt7xnyXSP87n3PM..xNuGMDF2zQzKHPZjciDcMbPsfefNI0jXrfqlfi3DbLftw+09mbrt8enw6IA7QMdpFVaLBSFNh23ocZcs.PBDsMiyYimATJwyEW4pUPSifeBpys.nE5faKVOUHIEweOatvVnRp4FvdlMMbzxbdBpsqCZsaK906jOz.lvYuOaZuwSQM1JLDkK.BpIdQPmtCa7DFE9hvlBLQJQHgQFEnZwYrPNYhvGw9UQ3XxORnCQrIbBih3LDfUDeDFQRSTQfI3FJ9iB6yDOQHTf5C7nAg3n5endsb16nCO97u+jSNBnsVMWCVCnqaqWmpqcyhpDhOu+Y60S5mqXsSMc8AQdCGhi10i6AV7Cttsbbasgi6Jcbb6zxos65NqtFzbM3qqB+sqypveZs9LhJ4.XQqj+UgpRhxrbVUkFlM1nR30QHpkyFqlM.EkLKBDPdUPRmT80qcyXrnCU.zBi3bvYq1Nsa63td9fTTxbwoaW24XP0vL09JvYgQThSWH3A5G8FUxQEoG873izVu5GggyYDBsgzWoKZF1Lj4EHVMJRpr0RvT1VZ0obQLbHG+T1TNghsGLk5KVzXObo50fk.0FJLQc3rs5OwMeOgOZqvIi7xjbQHrN1AYyGQhaF.iVyQr2giPe8WixEI2EXW.QKgdNrbXCzSge2s6RBjAiy.31AxnRKZbfEENHwOqI9+aDldsJRHzP.vnT.ij8tHvrmHhLGDilDBx1kf.vmL52joDhwiXSiw6.ACKxF5tmmr8ibm0cXQTbzoh8URLoA.9FGyhF6ElHvAkQOiHbLfbwASRDmLHQ3IBpVNqcsHDxgbooEGTxIiUOiofZxtm4SY32AoGIwb4IhmgjZUsDPB9gLP4RS+Ph+awAfqRe0b9GggEtVSDG5f9XNjhLLt4PLW.mWBNGJCFQzj2aiEn6USx5sHLeZDMwLcCEyyYVAR+ppRUD5x6BQK4JCh2PF0SbL1Qhj93+YDO+tGOJ+XqGqc.7iJbijjdxeZj3fG4Yl2XLVKcEYOxkxyOaIklf87H50n+BJu02oB.c+JX6izAvRnkyOwU163vX7M0AeW0cfJHyvWJ5G6cYeeuP79d9v0U01RAhV3liXLca1TZPr8.OXbW5G57lY6Oc1OYgTUoKONmpxfQA2dLDG4GOtLp8RUaWxD7XB0VWtSofYNd+jD2GLlETx+rAW4ZUCZjGcHtjao2DvI6b+7gVvMBJ3L1qhwPmn6YRxKjpnmw8UOK2AYlhbsPsrzvX8zvbKki30IK7RWsWX6E3WWWW8Atd3dWB6.Ef1dJrUBsd8xacxnps1T5EIEQrPa+z6h4.GFEBaGItRj1k+NPdGLasK39XkgPNY4RGDXJ+5bBusabUiB2Nd9Nmdw4q0J8XHN+th1MzgeikTmXIChrMIqLDk29qvGMJ4XFGeB0VF0.WhJqZvfJ0kz0vMHqTsnz2naxQa5zwWfiz4bggP8fEKxzZ9EYpWCruhuzLjQOjR3mLASmWkwFIjrnfzDTAlxkki94Ikip3QCRfPjN0ZHws9aAX7pCE2+Hs2fNNurAP1t32Q7wphcqYsKN9sb1DX7xldMLqqF6GjVJr3bP4PWyJorNiKAFwTLXWk9EY8BfIex+0TACUMCBI+4DfAGSON8cGtu0JsWes02XkU6ttlh1kzbAKJ.G0GBW8PTI8Tu.xzXc4hHNKJ9zhQwK8tHIJ9LK42aKBhDe+WC17J8NpT0Q5QNGeIW7f.YEPafgDEurGbv31Pj22Je0YAtLABSh17Vvmebjyrr+FtazY8VUw9IZLW3ifOc03y+SA97Wd9L7YABPQoetk9K.bCrZs4wpOzpzk2TT6Oaljl9o5oo+IixzZpjjxaMLW15ip7ViaNJKVTtg4WXUnn7Bg3h21U+4T9+dnNk+O1zX1215KsNhELMziW7o1DuuXhBH9J79VhGZhFS3ElL+M682tsP7gV8Hb+QUiwEp.ivNA+dfwjWs7AV6MX.1mmCvEs1+0+97DkFpBEGB2OJhHxlOd539vJUeLL5THEWbzj4BhCQTsaktYReLMP13+AeRT5JZalnzMUowXO+H149pidDuK5mIk.XhJeR3ZVGIZibm8vlwj.x499E6pYbr8c0wN2UGW4t5X26piqdWcbs6piq+q6n3Uz2ZJrCjZYigwQ81Sd4.Sy8nhcWkYqF+e31Ak+M
A better solution would be if we had a
Content.getHeight()
function, not sure why we don't actually. -
@d-healey Thank you!
That is, defining the
GUI_EXTRA_HEIGHT
variable and setting the panels that need to be positioned automatically on the Expand button's callback on the y-axis again.Normally, my template is more complex and I also use the
GUI_HEIGHT
variable in some inline functions in this template too, I don't know why but I get instant crash while clicking the ResizeButton.Yes
Content.getHeight()
would be useful. -
@Fortune Instead of using a const for the gui height variable, use a reg and update it with the new value when the ui height changes.
You'll probably want to use a broadcaster to watch this value and automatically move all your components that rely on it.
-
@d-healey Sorry, can you please give a small example with the broadcaster & reg combination for this use?
-
@Fortune I don't have time at the moment, broadcasters are never simple :) But the reg thing is pretty simple. Just swap const for reg and when you expand or shrink your UI update the GUI_HEIGHT variable with the new value.
-
@d-healey Ok, Thanks.