Hope everyone had a great holiday season! So right now, my device type is set to Mobile as I want a proper navigation bar. For each main section, I have a conditional visibility set up. So once I click one of the sections through the navigation bar, I am able to make the other pages disappear. This makes it looks like a proper app. However, this only happens when I click on one of the sections originally through the navigation bar. When I first start the application, I see all three sections side-by-side. How do I set it so that I originally only see the first section, and I can navigate to the other sections through the navigational bar?
So, here, once I click “Upload”, I see one screen. But I want to start off with just the Upload screen. Variable-based collapsed state is not what I am trying to do (to reduce confusion).
I assume you’re not using collapsible sections either, right? If you were, then you’d be able to set the initial display as open or closed.
If your conditional visibility is determined by a variable then you likely will have to have a clever default variable value that gives you this initial state as needed. EG setting your section visibility to false by default and then having your on-click actions to trigger different states as desired. You might find that the current variables you’re using have default values of null/undefined which may by why it’s not triggering the state you’re looking for.
You can find some great guidance on building mobile-friendly apps in the documentation here including a section dedicated to multi-step interaction workflows
If you want to “enforce” that the users go through the steps in sequence (i.e. you can’t go to “Analysis” until you’ve completed the “Upload” step), then you should use the Stepper widget, which combines the functionality of the Tabs widget, where clicking emits a navigation event that can move the user to a new tab in the container, with a variable-based “completion” for each tab that determines if the next tab is available for navigation.
