Is parentComponent property deprecated?

[aaronventure]

Is this still the way to go when creating tabbed interfaces? I prefer doing things in code rather than dragging and dropping and organizing in the visual editor (call it a habit from Kontakt, but it makes for rather re-usable scripts that, If I open them months/years later in some other project, won't have me scratching my head for half an hour).

I ask because there's a single passing mention of it in the docs, zero results in the forum search here and on google, but is used in a snippet that Chris posted some odd 7 years ago.

[Christoph Hart]

the parent component hierarchy is one of the most important principles in the entire UI designer so it's definitely not deprecated and I've used it in every single project I made with HISE. If you're not into dragging stuff around, you can set the property via script, but I actually found it much more enjoyable to build the interface with a photoshop like workflow.

When it comes to implementing a tabbed interface there are many ways to do it, the most recent (and thus recommended way) is to use a broadcaster that you attach to a radio group ID (with the page buttons in an array that lets you implement the logic with a minimal amount of code)

HiseSnippet 1212.3ocuW0saaaCElJIJHwasXEnWrKIztwFvM0NIqqaAAq42Bi0jZTmULfffBFIJahHQZPR4Tgg9FrK1ivtXOf6MX6PRYKEmD2ZWr5KLHOmyGO+xCOpqTDRUJgD4s9Y4CoHuu1uWNWO3fADFG04Pj2C8OgnzTI1QZ+7gDkhFg77V9kFBdquBx96e948IIDdHsjDB8VAKj9JVJSWRs6K9EVRxwjH5YrzJRu8K5DJ3GHRDYf8rreKzPR3Uj9zSIFwVxG4s5QQLsP1SSzTEHy9hn7dCDWycx+VlhcYB0roMpGbPNxnCFvRh5N1WUHj2JcK87kcd9i8OgEwlPuLB7MVF3RDUiAdKMKSp8bXRdULoUblzi76EJYC0kbL1yW42gCIjXBDpqZJNYQKo88OP.Rv0ajRthdrD1LAQ8m0pUSL7WicpUCB2JMdDQhOgxy1OSqAB3cwmOFeep9.Q5PAG1TOvIP6fFMqguueyB4lKLxsVXjaGz3BvSiEx5oWhY7pdZiZ+ds0SubCEEDWRhXhWJEYCCZh+wVsZ2XG7SeJlvyw7rzKgK.WCUs3HAVOfh0RV3UkfUjQzN7tRJrCfGSRTTH.+gpg3gPk79RAIJzceZW7Q79LNciPIEpcpvpNXVArnfeBGLEnfl.GhruB3ctkYGdD88AWXnqIUn+jADdTBi2O3hZevjqAeIgAmAjf0B7k1H.NLAbCE3Y5AV2pOaDkisgBbeSrn1TFvFDslDN3LwalDtpaBVMwAVJXWD7lEWcgyXFkUcIbZx8UUMCHaN+P1Z9gTT.AgOH2ZCRiLWoYILcNVDaoXBRJiHlMwY7PMCBtoYf+Ko5LIGpWxnXgzUYzDqD3qg87j7pBXNAnPcxQZj4ZBWaRXJnkBt90CnRZIelI4CAVCA25BCxkdab6rWTzD+CZpLjJ04uxVU.Uc1zDjHG4ZYA0wAVsZNDSQcgeU2poN78jRRdS7jhP6soBuopH3c2sTncbEiSaWJJOZOUNO7DnMGvq94stvc+yZAwLIDJMflDbE7SEZ5q40spEtogmlUb7cxyjpkhjDvguK1lmjjyBXcW2flPkcRFchfPO6a9PvpeZODD5p7pHnf2gyzudHsX+whjHSCdy5a+rApnzEV8qcNjnIlWRJnUjgYFyw6P5H3oX26Jq6eHUckVLD4s1j5Avj0VtOr3UGWWRDKx.nn2O58HOeOyq04lE0fEkMNA4Vsw24dLuZGwwPPykt1zoq+3Kgt1xoqu06Kft11oq+9yWWq3z0CFOkfockUUq465o5zTywQv3ov6+QvWjA9qw3ifEiFWF6s77bTSGf+LNph32edeG0sGiBFfSDkkPz2bpNy3qELfa32XTJy3RbEzgu53sywndsl4ndepl3i76xzgCtaabo6vFg69+eXiECH+.+ihiog5RCbE+i+sEcZ3Oh5eiHSCSubBAlzxjuOMKsG7cAgTP6bnJPYR8KYpmc6aM9BRO3oD6l+E9UvrsYuWAy1iYhRIgRw6Bc80MifulkBXSb6WbrN7oOvdbajsWOfyu0FsPovWC7tvPi6+Dnk7ciYyE.yVK.lsW.Le+Bf4YK.leXAv77Yhw7gX6koEotqC.gtGYezyy6HNAprrUgn+S22uw0

const var MenuButtons = [Content.getComponent("Button1"),
                         Content.getComponent("Button2"),
                         Content.getComponent("Button3"),
                         Content.getComponent("Button4")];

for(mb in MenuButtons)
{
	mb.set("radioGroup", 9001); // any number will do the trick
	mb.set("saveInPreset", false);
}

const var pageBroadcaster = Engine.createBroadcaster({
	"id": "pageBroadcaster",
	"args": ["pageIndex"],
	"tags": ["page-handling"]
});

// listens to button clicks with the given radio group
pageBroadcaster.attachToRadioGroup(9001, "Radio Group");

const var Pages = [Content.getComponent("Panel1"),
                   Content.getComponent("Panel2"),
                   Content.getComponent("Panel3"),
                   Content.getComponent("Panel4")];

// set the visibility of the pages
// the function must return true or false, so we only return true
// for the page we want to show (where the page index = the index of the button)
pageBroadcaster.addComponentPropertyListener(Pages, "visible", "show page", function(indexInArray, pageIndex)
{
	return indexInArray == pageIndex;
});

pageBroadcaster.sendAsyncMessage([0]); // show first page

[aaronventure]

I meant the way of doing it in script using this seemingly obscure property. Broadcaster is very powerful especially for big apps. For what I'm trying to do, this would be a bit overengineered

I just wanna set up the interface in script and have it fall into proper hierarchy on initialization, so if I ever end up recycling it, it's ready to go (and for text-only clarity). So in my case I just use a single function that first hides all panels and then just shows the one that's triggering it.

Great clean example, tho. Thanks.

[Christoph Hart]

@aaronventure why is it obscure for you? It‘s just the ID of the component that will be its parent so I think it‘s self-explanatory how to use it.

[aaronventure]

@Christoph-Hart No I mean the property name, because I only accidentally found it as a passing mention in the docs and used by you in that ancient snippet. It's not found in the property editor of a scriptPanel either.

The fact that it exists and can be used like this to set up hierarchy from the script is what I meant by "obscure".

[Christoph Hart]

@aaronventure ah I understand now. Yes it‘s deliberately hidden in the property editor because you are supposed to set the parent hierarchy by dragging items in the component list.

[aaronventure]

How can I see all properties of a given component? Creating a reference and then doing trace(reference) does nothing (the console just says "Interface: ".

[Christoph Hart]

@aaronventure select the component in the interface designer and press J, this will open a popup that lets you edit the raw JSON data.

[d.healey]

@aaronventure Back in the good ol (bad ol) days of HISE 0.x all the properties for every component were visible in the script editor. The hidden system is soooo much nicer :)

[aaronventure]

@d-healey Hey, there's an idea for your next video. HISE museum! For April Fools or whenever.