Control Spacing Keeps Changing

  • Goal: Build a usable app with many controls, only some of which are visible at a time

  • Steps: I have repositioned the controls to be right next to each other many times, so that when some are hidden, the remaining controls are shown without a ton of space between them.

  • Details: The controls move back and automatically add space when app is updated. This leaves the layout looking terrible with tons of empty space between controls.

  • Screenshots:


I have repositioned the controls multiple times, but a later opening of the app they are repositioned again leaving huge spaces in between the controls. How can I get the controls to not occupy space when hidden? This will work for short times if I reposition all the controls to be right next to each other, but then that change reverts.

  • App json export: will attach in comment, if possible

Quest Editor - single quest (1).json (1.5 MB)

this is the app after controls were recently reverted in position

This is how the app should look, and looks in the previous revision

and this is the previous revision. Made one change on an unrelated control, and all of these controls repositioned.
Quest Editor - single quest (2).json (743.2 KB)

FWIW, all controls have the "maintain space when hidden" unchecked

Hey @Garr_Godfrey,

How frustrating, I've seen this in the past as well. From what I can see, the actual "position" of your components are one below the other. In fact, a workaround would be to move them all so that they are in the same line (you would see them all over each other, rather than one below each other as you see them now). Then set them to show, and order them in the proper way.

Another, "clenear" appraoch, is trying the "Stack" option for containers. As you have one vertical row, I think it could work and then also define the width and alignment of your buttons to make sure they are consistent. Simply select your container and change to Stack in the layout section.

1 Like

I have set them all to be at the same position, but the order is very important. The tool is repositioning them after I move them all to the same position at some point after it has saved and been working, so that they are positioned under each other.

Important detail is that these are in List Views with doesn't have STACK option. There can be multiple sets of controls, and each item in the list has a different set of controls enabled. But...perhaps putting them all in a container inside the list view would resolve this. I will try that

Unfortunately, I cannot find a way to move these into containers. The app needs to be able to reference each of the controls and when they are inside a container inside a List View, that doesn't seem possible. It would take quite a bit of reworking to get each container to save its state separately somehow (I'm not even sure how, unless we do it on every change event, and with the complexity of this app it is too slow to use when we do that).

But the issue seems specific to List View

Hey @Garr_Godfrey! :wave:

I think that nesting these inside a "Stack" container is definitely your best bet. When testing this out, the most likely reason you're unable to directly reference the controls is that the newer "List View" components virtualize their contents in order to improve performance. You can override this default behavior with the "Enable instance variables" toggle in the component configuration.

image

It's also possible that the behavior you're seeing has been fixed in the newer generation of the "List View" component, but I can't be sure. It's worth upgrading from the legacy version to see!

1 Like

I've been able to test in different apps, and Enable Instance Variables does expose even nested container listview values. This is nice. I cannot find very detailed documentation, but if I have a listView2 instead listView1, I can access control values using:

listView1.instanceValues[index].listView2[subindex].textInputA

It is not intuitive that I use instanceValues only at the top, and I don't need to access .data and I don't need to append a .value. I guess that makes sense if the instanceValues are a copy of nested values. Fairly impressive this even works.

1 Like