Change order of childComponents inside panel?

ulrik

Christoph Hart

Alright, that was rather easy:

function mouseCallback(event)
{
     if(event.clicked)
        this.setZLevel("AlwaysOnTop");

     if(event.mouseUp)
         this.setZLevel("Default");
};

There are more advanced options ("Front" and "Back"), which you might want to use in certain occasions.

I also drive-by fixed a crash with your snippet (dragging around the panels made my system go boom).

ulrik

@Christoph-Hart Hallelujah! Thanks :)

ustk

@Christoph-Hart I'm testing, although the commit - fixed multithreading crash won't compile :

ulrik

@Christoph-Hart Error when compiling

Skärmavbild 2021-03-26 kl. 15.58.52.png

Christoph Hart

Oopsies, little typo. It's fixed now.

ulrik

@Christoph-Hart the setZLevel("Back") seems to behave a bit odd, when setting a childPanel with this once, it will become unreachable, the mouseCallback will no longer function.

Is there more commands than this 4?
I'm trying to sort 10 childPanels in Z and it seems impossible to do that with only this 4 commands.
Is it possible to have an index system for z depth, or a way to set just 1 forward or 1 backward?

And "Default", does it mean the order they where created, first created - deepest z, last created - on top?

ulrik

@ulrik I saw in your commit there where this "numZLevels", is it already possible to set z-depth with numbers?

ulrik

@ulrik ok, I tried but it wasn't

ulrik

@ulrik I think the commands "Backward" & "Forward" would be great to have (1 step for each execursion)

btw, thank you @Christoph-Hart for implementing this!

ulrik

@ulrik I found this in Juce


void 	toFront (bool shouldAlsoGainFocus)
 	Brings the component to the front of its siblings. 
 
void 	toBack ()
 	Changes this component's z-order to be at the back of all its siblings. 
 
void 	toBehind (Component *other)
 	Changes this component's z-order so that it's just behind another component. 
 
void 	setAlwaysOnTop (bool shouldStayOnTop)
 	Sets whether the component should always be kept at the front of its siblings. 
 
bool 	isAlwaysOnTop () const noexcept
 	Returns true if this component is set to always stay in front of its siblings.

I think the “toBehind” would be enough to handle several child panels

ulrik

@Christoph-Hart
Ok, I got it working the way I wanted :)
In this project I have to have all child panels in right z order, so I thought that if I iterate through the child array backwards, and used

child.setZLevel("Front");

it would work, and it did, for awhile
I noticed that after a couple of rearranging in the child array, it did not work.

So first I had to set all childs to

child.setZLevel("Default");

then I could use the

child.setZlevel("Front");

and it seems to work so far.

I'm happy

HiseSnippet 2894.3ocuZstTajbEdjsGrAujrNU9appW9gqQAPVBiMdCAGDRBrpU.ZQBRhoHjgYZg5vnYzNSKDJ6RU6iVdTxiPd.RUImtmKcO2jDjxAWkgo6y4zm96bs6YZ65Xf87bbUJrX2ICwJE9J0NSro8q0WmXqzrtRgWoVqOwxrstM1xCcDdrxdSFp64gMUJT3oGvHqvhOSg+y+5OrmtktsAVLjhxYNDCbKx.BULZ6c+Nhk095l3tjARTu4tMMbrq4X4LBTompVVYntwM5WiORmQ1STUJrPCSB0wsCUmh8TJ7r8bLmzouyXae5Oi3QtxBydnhRGPP9CuuikISiYip3ugB25dJfTZK.hm5CD+Z0CIljnwE.xWym.I3PFOJ7joodUjUuxyu5UPR8dlu58J0NFtjgTwLLc6kpMsoX2d5fIPVs7oU4IE+Mp0b.JrokFneCdeW3gHNzde4xqgdW4xE2d4k.yfGEcqtKp8Qstr1wG0sZyiZbBZGTn.tFSq4LXniM7f1JwnZk3RnSitGU8vF4xav7I35r14xvYs4zx92adCB0ASQV5SvtHavMY4kH1VDaLp2HaCJwwF4XGrBLo45XoYDJp0fUxZDt3xK8iKuDB9wxwP2hKFXw4yss7DDy6fwOqMSeNiMqVwf4CVgRdXP+t02JuxZnd5Vd3PZLXF1VDO54fbtHIoT2QSkRJ9NJPFS2xgLW7PvIkFoSKuz8bTZFnNS7AHSMcKqqfHNsjPVHbG.3fGNFAz5qAC8yMvgKO1Bud7eh4Kz83SpdvT7E7mOv9xVrC.qqXYPdj+NN4Bj6h07ySYkfIkVlr2SDajNxBPXz7rdQ1CXQO+hHQW0zDYiGKuKl1NX8r7fqVu9r8dI8PZgCwdNXXg+KWC.kKVzZIcSSQNdt2yhQdWw78VoEOJaEzphsZIKr80z9YwE.lNiCco7X7WEfWw.Q7D7KeczCzOvR0AryZIoHVT1XhIsOHUuRiyZ0mwz8wjq6S4ymgx2lEHchyHJXFzZeRZBNzYjGNJb4vZ6kTUYF9ZNironw8IF8gTGHhGx1ghnPlWagkgYzRhlnc1AUtnfFICo.nF55LrIyZ1v9ZPMKY5LBxjz0oC0kXesFjKubXlfveBhtJYpS0O2m+KB8UkoyeaxnpDgsBkkl+dweJ9KHVAOC0kDKxPd9dNtHMKVrVDNTLNEIDHG17wqgi75qYEppI2u2yBASsTDPIprMhf98P0N32qt5brbfU5aBVSHfmB9GdZjhESSYFLmEjR1Na5lKaKICa6C0FG9CjVwywBWZnKq1A0k0IfrLJl2BckKV+lLl69T1.o+TNDQ30CfI1kxbY4iEEK43Zhc44lDoB3lPi77VRf9FAHtWGrE1fhYPJulbRG9TEOk0WQc1xWjg.YUtC0Nn2.uvdChLQL4L8hwP587JDKx7KJVc7I0gdwp8olsp2t5QMZ0A8fqnHgrQ0OX0v7fNtYM+rYTSD4mZVLCjwhkHMCdlHk9HJ5qrezWxzdxwhRFRo1bB5EZBj2dhrkZBZ0c.kXUe0W.6reEuXW7j+oR79aQZQhg64eunsmSZHg6sZ1o6CF0cwBbmspZPeaqgzGvpSjrITqDYKCLAi0g.ZVWnrdQWMf2X3d9AHx8CDk7znXb3JQqkPfw.mawZVgsYlp4yvn2.UaMTJRC1.7bmVXc2HmmvbOwG8ArMhm7xfEUEzsRwL2Vf0+ysv2Bs4HDZnQl2EXitnSZdvm5h975sZbViVS2Dm1BKV.cWW8IBipX6DNQRu7RBdWoNtm9HKXWrc58PTTDWPhPGzG4wUqudZYyo7bBZcTkKjWF9A.iVjfLT9HQ8FsZzsgTNlGdJFaeYbYG3W051XFMvt3L6dM+Sek1U.nUdxTmTh4SC69As0cwIx5mx0ONyxjln9T59hluJGYRcVEjxq5xzJsjvHjWYlrsUhy846UzFRh18jiOsKjKEMCOhjmNpM61CzBcOztNdcGR9c6P6S7B6bRpwGFWlt5iAR.Vi01Cw7hX4Rh6aDvTnbtlAH66vvJyfvt0PUJKltGwxBN4hl+8R4U5Jn5ANdxpq8AU17QjMlP6W0ZXecAiV.VC6fRaUTHcl1zExX4uMkRfsF5bngnMWCENwejchFMX7JalH0Z9JAeIyHwpIKSTHPjJdyeO2vxhLzCqctI3OtFx77JWv0G1pmNsj7+yBkkrZQt7YsRo0YWbrF48gnS.Anw.jxY.HgC7IdccshfdVQN7P91hN73S6znV0Vs1qZsu6A5BCmyKlOLjEUtvc3kQ4ErcEfAmPnLGw3FAJDKSQHurafXjcbI7++1dSmIioefoBsBCqWAQcPo0wrL4oyxkVlL93Y2AodVa+hBYmzStoCS7cG2i6lkcs9XWMn+MClo4.85Wi7GXBzSZkMR6jlyk6IeicoHi0hpHhdxJEykxfKWIY3uL874l1UKd+1IC+xcK9wL2hx4XYUYyAn2NKNlHS+4wjzEQa+Lc.lmaMc9brlE.7S+T...4RtlAGei+id8I8n0cFamFRdbUkRcDbnVjei1m6uhPCxAlhKRsESFMl2tJRqEFV19ZZGcJgYItOZfYbUIY8my1hIzgAra.6zg4mDhgeGc5g0Y.9NnC0o8K4BGVwTSZQPuQxuO3TYotvgTmZJ1dYsvEIIa4zb18YWV3.nye98Eu+oGUqayiOZpkFR2saz4hSbLN1YlYxUNztj2PKB7DZk3mhdLP6PcWObSvGvCJ5l9P1RSuQxyWwIx4p+FZmT9AqLdkeGZ7ZRCzGFneVdYtX5HWalbhe52VGePzs2OyRloOK.v9kAr++zEYOsqqRbtfhy+UuHoX40abZcW1yoVqFUOAAMTLGMSjIzvEvkf.lMvLWGJ1H+y2vfCQpcwwtWL4MsEBowOtwzvwncQdnXxsISfRnvQNT7w1ZEW5GWZwkteITxo50Ky4BDlE1MyoYueY2ownl8nAWgcCQ5PBUJ7r3uIW07eStxunYCerQhPG6l1D5wCw1489cUB.TEkBKDnU.oT9648WE7ddwlmQviG53RUHlfxodVaEtFCZVA96NOIm+h.N2aDk5Xy4RUsZ85grIdC8oXc4vWtL6EBw4bQ0.GhHtWHWtyXgWVUJDZNTfLDwKUi7edbB3UpINhaFh4zl0gpJr23dfIALSCwtTByCnPc7sDCr+6eeQ05XuanNCUJ77nf.kBuX1Vs6j+bGlHdn9t72XUz.+iq10ufXzH+yQ6Rn3AgedDek5Fu6sucyxa9sarkxUWKM7leXiu88aA+GeiDobOOOq6uTM1cjJqhJJSjeHtJt6eUnhQ9CC4YbjVV9tNlh7x3JRK8qDtY9cDJqBufiRK7uSnBKbWv.IPI.UYUYgXIUHvkpzCrjrJyBBd8tozwjHfLbt4Fe38eXqM25cuW41vf9nXtjV9bi5Dane9GjM6ata9XZjmAw6PmAvxn6NwOIh+NbYljQu1+0ADSadddH7BprlQxSa94uOg1n7WxPa7W7kTqrQYzcnOTNKbXZoPlW2KkOtaZaqm9sP+OscwPMFer3V4uolL.gYlOJOSi4ixzLeZfb5r7LF+vWv0Oc1v7zhadbZQ5OYouV8PGyQV5z3eMUrOgrfIfByw9rkXeZR1dD5D4OwruHehUyq59J01DpQ+r02mjg9B0R9RquAevZKq1nWO3jwBk8Yp6+m9x+0oo3+YRbMb.OWB3DodznAcfTmFXPSrYeEMrzkOgksz+4xgoO6fsM4O7efeBlrB64BASVIbRkA5FtNWZ3Wkm8Iw8B9HfNYy+x.WT8P1ynJQMEoVtTYkADSxkFFLnXcP2ylmMdD771GAOa9H34cOBdd+ifmsdD77goxC6ijr5Hpy.+vDXf1M3MWUnPCacvKi6Qp7esMMA3E

So for me this is enough of z-options, thank you Christoph!

Christoph Hart

But why don't you use the always on top mode for the currently dragged one and set it back to default on mouseUp?

In your animation the Layer 4 being dragged is still beyond level 2...

ulrik

@Christoph-Hart Yes you're right about setting the dragged to Top so it's visible, I will do that change
The purpose for the z-depth thing is this:

ustk

@Christoph-Hart Default doesn't seem to reset the level...

HiseSnippet 1063.3ocsW1saaaCEGmzILM1ctXEXO.D9Jafr.Ym1tgUTTO+QJLV9vHtM6i1hBZI5XhHQ5IQkFihBzGk8Hra2c8QXOB6QXWr68H0GVzKpAVtXBH.4bN7u3ORpygGOzWXSCBD9.X4mOeFE.+Bzn4b4ztSILNXPO.7dniIARpON1Um4yHAATG.Dt0yzNfk2FD872OsCwkvsoYt.fyELa5QLOlLy6v1+.y08PhC84LOiQ+f1CrE7tBWQnhmsPVfYD6KIWPOgnGVID.tSeGlT3ORRjz.0X5HblOZp3s73weNKfM1kpMZBFodQwtAcmxbcFltVC..31CyV4aEux+JzwLG1R+Y6.eYT.blBy8.XoUQZ6UPp4mBoCEtN5Wvm.OnAdaGi28Qir8YyjYQzrcWz.t5vYBQssahU7XAk9mRntB0H3x88HWROzWYrTQ8GYYsG9gVVMdLtZkJpM+.I9JhOdrjGfeB9koRufJ6J7lI3Ji505DJkBdyZM1qZE7MdtMMs1.MGTqwqe7JzMi6dKzMjvotECtHIsJtjTzpVgwcYbJdRH2VxDbrf2Qx0J8Et0sSksmBe2PZipUdW7LoWIuTuYuOi6Pu9zIYiswq2OfJ+kinWQcqGIC+TbsnyuZ3uCWqGcBIzUVqgBf2q9ahvGWeLlwiN7ZfGqkmPPWhq6XUpTcSrzB+7dLVsmHjzS40aT4cUJW48Uv+2PSljarDTbo94FVWdv+1DVmG5Ml5mtulNPUNypIk2c8RJsiOpMFnfOfyjmNilXmk1piEupSiZAVtXMcksFM8FszxYXYttYUAPxmhp5CakLb0+IipNbujpCw4L.lhwxnjDUPztiYUYPAj25yS9A4H+EC5QjDcYtjUjZUNi5KY5yJXO5Up6LhK5UF0iFboTLSU5eY1G.ta7zVMsjnNYLZV2EEm9Ctd4D9gWzd9RiO9p1uk4HmBfHXMH.LkxtXpTa8GpnLI0K85mx6..KV.VwaKS2fBvSKCd9KaCd9fn.7rHedVTbdNvfme+WM342lt973u.jGOotM4Ym03izLh934FDA50lEbrvS8dH9J2vRR50ZhPm0uWAmDyiArv7Xna9Sxtnet+QGc5OVv4wb68OudMlm6fd1Y86ehp0nabsup4CgSnKQtZGI5VuRBnpHtxU+5q24AL4byVyJPaJV41lRy7JHsl3dezPlzdZ97VJGdUkF9+l2jl9ph5OYB0VlA61nC+oMsCuBfxYhPIiewwDoOS80B5jPuQpTHaphDtJEMPmzURmFEaaos06LinbmHCUd+hjfM01vjfMSCB7H19h2XGWrV2V4tQdTLwi5ntrp0dkMd4MDHj09V.OU2tuw1VuU70J1yWSqMPyAaflGrAZd3Fn4QafluYCz7s2pF8Oz36CkBu3zDkig8itqDB6yIpuxh9hD7u.dhqlXC

After analysing the source I thought they should have been in a parent but this doesn't fix the issue either:

HiseSnippet 1088.3ocsWssaaaDDcorVWKkpfFf7ArPOIA3ZHImjVzfhnpKNPn9hfUh6kffzUjqrVXxcEHW5Xgf.jeq9V9D5eP+E5C8c0Y4EwU0LFRJsBv.dtb3blY4L6vg9RaVPfzGYU5EymwPVeIdzbgZZ2oTt.MnGx593SnAJlOIVUm4ynAALGjk0NOWqvpTQTzu+5YcntTgMKSEBcgjayNl6wUYZG19G4ttGQcXuf6Y38iZOvVJ5Jckg.e1A2.MiZeE8R1oTsaEvHqc66vUR+QJphE.9zQ5LezT4aEw9eAOfO1koEZhFAOnX0ntS4tNCSy0.Dxp3vrLem3L+g3S3N7k5yp.eUjARFByZfUgUoTwUnTyOEkNR55ne.eB5YYPuhwz6A3Q197YpLKZtcO7.Ab3LgBkcSZE6KpveW.2UBdHTG3QuhcjOHrDQsmznw9jG2nQ8mRpTtLT7CTjqo9jwJQ.46IuJE5kLUWo2Lo.DpUsSnRIEMqVe+JkI252cgo0Vf4vp0e8SWgcyDt2A6FREL2MibQPZs4PRoVkxbgKWvHSBE1JtTPjhNJgFouzslcJr8A56FxpWo76hijNSdktXe.W3vt4rIY9V+0GDvT+5wrqYt0hfQdFoZz4WUx2Qp1iMgF5ppVGHv6g+lH8I0FS3hnCu5jwZ3ILnK00cLzJUyjVZfed+Lx1SkJ1YhZ0K+txkJ+9xj+soISx0VBUbY94ZVOdv+t.VSD5Ml4mVWScD5YVso7dqWSoc7QsgiRw.AWc1LVhbVaq1VbVmZsAZYxZpJKGM0FkZ43VlpaOU.k7pHLeXmD2g+SEMc39ISGh6YPbfikvIMpnnpi4TYzF.u0mG7CyA9KGzipn5wbIYDjkyX9Jt9rxpG6Z3Ni3gdkv8XAWojyfizkcev0.wgsR5HQcyXTT2COj5qc4lr.dd64KEZeQ62xcTSQVXq+zBglx3WNUok9Mq3x5xXT5thgdDiYLdnQL.gkwn5Jw32AibEyK8JtR6hPKVfVQaKS0yhRFCRsL+Pa.SaYvzOLxfoejtALcQ9Lcw+kL8PCl1laxzWt9L0eAJOllpd8X5tqQaUFW+3Elm+8ZyCNQ5AOGpOn1pfhcilq3y62aCCh4QGQZDjOzM+frG9W5e7wm8SaXbLK7+wMqQb9B7yOue+Sgk4t0hJv5RRmPWpZ0cnzKKlX.lguxxJ5ERDAb0bykI2fEqZj6hUMyaD5ZR2GfGxU1SymuExguvvi+u4axZpUv8mLgYqxHaQ7Q+71tS5FPkykgJt3xSnJeN71B9zPuQPykMCXh.ZdCzsiEz2NDK2PKqqLiXBmHAXVwhDiM0xVIFalZD4Qs8kuwN95E8hv6EoA3jH5a.JAeLBHSVdmFF23fFHOX+72XaqKEeMv87wzZKvb3Vf4QaAlGuEXdxVf4a1BLe6chQ+oQ+PnR5E2l.JF1O51cKq9BJ7VVzajn+A7F4HCB

I don't understand why you declare this:

Component::SafePointer<Component> c = getComponent();

And then use this everywhere?

c.getComponent()

SteveRiggs

Just spotted this post.

Does this mean that users would be able to rearrange the signal chain now from the GUI if the plugin is built using this method? This is huge if so! :beaming_face_with_smiling_eyes:

SteveRiggs

@SteveRiggs said in Change order of childComponents inside panel?:

Just spotted this post.

Does this mean that users would be able to rearrange the signal chain now from the GUI if the plugin is built using this method? This is huge if so! :beaming_face_with_smiling_eyes:

Bump Bump ;)

Lindon

@SteveRiggs do you mean the FX chain? if so thats always been possible...just use FX Slots

SteveRiggs

@Lindon Amazing mate! Thanks. I'll look into this properly :beaming_face_with_smiling_eyes:

Change order of childComponents inside panel?

27

1.7k

11.8k

102.4k