The correct mobile way with groups and data

[gurun]

Dear forum and admins,

I have some issues wrapping my head around the correct way to use groups, states and element states to build a well functioning app.

The documentation is not very clear and I`ve searched the forum but only gotten half-way methods for this.

1. My purpose with this thread is to clarify for myself and others what the official and recommended way is to handle hidden/visible views in a single-page mobile “app”.

2. Also I would love to see how to pass data to a group in the best way so that when I click one of the items in a repeating-group it will show a new group with the detailed-view of the clicked item.

[georgeciobanu]

For #1
We recommend using custom states and then use conditional formatting to hide/show elements based on the value of the state (which is then changed by actions via workflows).

To answer #2

I’d suggest to first go through these tutorials:
Build a reddit-like app to vote on city names
Using a list of things
(and perhaps even “Sending data to a page”)

All these are available directly from your Bubble dashboard.

Let’s say your first group shows a list of users, and each user has a shopping list
If you already did the tutorials, try showing your first group, adding a workflow when an item is clicked that

1. Shows the second group
2. Sets the second group’s item list to that of the clicked user

Let us know if you need more help.

[NigelG]

There is some good information in this thread.

Creating mobile apps

A good technique is to create a field on the user type named “current view” and then use some conditional formatting to show / hide groups based on the value of the current user’s current view. Then you can use some simple workflows to change the value of the field for the current user. That way hiding and showing elements doesn’t happen in workflows, which is easier and cleaner.

Nowadays you don’t need to store the current page state on the User (although it may not be a bad thing if you want to preserve this across sessions).

So you would create a custom state on your page of “Current View”. And then use Conditional statements to show / hide your elements. Workflows then set the state of the View.

For example you click a “Menu” button, this sets the Current View to “Menu” and the elements react to this, with the Menu Element showing itself based upon this value.