Set all Containers and Components in a Stack to "show on mobile"

💬 App Building
1

  • Goal: I'd like to make all Elements in an app stack-element (defined in desktop) show up in the mobile view

  • Steps: I have changed "show on mobile" of every Container and Component by hand.
    -Observed: even when done by hand, some of the elements don't show up.

-- is there a way to "force" c&c's to show and can it be "inherited" from parent container or stack?

1 Like
2

Hello @mascaritas ,

Try these steps to force all elements in a stack-element to show in mobile view:

  1. Check Parent Containers – Ensure all parent containers have "Show on Mobile" enabled. If a parent is hidden, its children won’t appear.
  2. Force Visibility via JS – Set each component's "Hidden" property to false.
  3. Global "Force Show" Toggle – Use a variable (showAllElements = true) and set "Hidden" as !showAllElements for all elements.
6 Likes
3

I think this is a great idea! I really like the idea of a global "Show on Mobile" checkbox, much like the checkboxes in the Notification settings for "Successful Queries" and "Failed Queries."

1 Like
4

Hello hi, thats a great idea to script this,

I did as indicated, in all components states I have { hidden = false }.
Unfortunately they still don't show up

I suspect I need to set each and every components { show on mobile = true } but I cannot find that variable as it might be a hidden or calculated variable.

any ideas ?

( below is the mobile view of a from that shows on desktop )

image
image550×550 4.71 KB

5

Hi @mascaritas,

Unfortunately, the only supported way is to manually select "Show on mobile" for each individual component :disappointed: It cannot currently be set via a variable

I realize this is extremely tedious! We have a feature request on file to add a checkbox for showing on mobile by default. It has been quite complex to implement, and, unfortunately, it isn't currently being prioritized. We're continuing to track +1s for this feature in our backlog, and I will let you know if we end up prioritizing it.

There are two known bugs that could cause a component to still not show up on mobile. The first, is that if they are nested inside a container, you need to show the parent container in order to successfully set the child component to also show up on mobile. The second, is that sometimes you will hit an error like "Could not make visible on mobile because component intersects with ComponentName." In that case, you may need to shift around components that are nearby to see if you can resolve the overlapping/intersecting issue.

For visibility, I will mark this as a solution for the time being, but hopefully, we will be able to circle back with a true fix in the future

1 Like
6

Thanks
So if I understand you correctly, I can't hack it with a script as mentioned above as a hotfix for now?

Best

7

Yes, that is correct

8

Dear @WidleStudioLLP
were you able to implement your proposed solution in one form or another or was it just a conceptual approach / idea ?

thanks anyway