Overview — Screens, Database, Layout Settings, Use Cases

Features a chat interface to facilitate one-to-one messaging conversations between your end users on any screen size.

With the User Chat feature template, add three screens to your app to manage and begin message conversations between the users of your app. The template comes equipped with all appropriate database properties and relationships to facilitate conversations via messaging from within your app.

Screens Overview

📚 Instructions Screen

Quickly get an overview of the template with quick tips, a help doc, and associated templates that may be of interest. This screen may be deleted at anytime.

User Screens

🧾 Conversations List

Users can preview all ongoing and historical conversations from this screen, select a conversation, and be taken to another screen to continue the conversation.

💬 Chat Screen

This simple screen displays conversations in the way that most other chat applications display a conversation between two people.

➕ New Chat Model

Select someone from a list of all users to chat with one-on-one.

Database Overview

The User Chat Feature Template comes with a database that contains sample data. Each Adalo database contains Collections and each collection comes with the associated Properties. Any necessary relationship between the collections is set up, as well.

Important Note About the Database:

If you delete a Collection or Property from the Feature Template, this could impact the functionality of your app.

If you add a Collection or Property to your Feature Template, this will not impact the functionality of your app.

Below is an outline of the included Collections and their Properties. The Collection name is bolded and includes a description. The Properties include their name, property type (in brackets), and a description.

Basic Collections & Properties

👥 Users

The Users Collection automatically comes with every Adalo app. This collection will hold all the information related to anyone who uses the app. This information is initially collected from a user when they sign up to use your app.

• Email [Text] — the user’s email address.

• Password [Encrypted] — the user’s password which is not visible to anyone, including Admins.

• Username [Text] — a user’s username, set by the user.

• Full Name [Text] — the user’s first and last name, collected during sign up.

• Messages Received [One-to-Many Relationship] — this relational field shows that one user can receive many messages, however, each received message can only belong to one user.

• Profile Photo [Image] — a user’s profile photo. This is not automatically collected during sign up, but can be via the sign-up form.

• Messages Sent [One-to-Many Relationship] — this relational field shows that one user can send many messages, however, one user cannot send a message to many users.

• Conversations [Many-to-Many Relationship] — this relational field shows that many users can belong to many conversations and many conversations can belong to many users.

• Friends [Many-to-Many Relationship] — this relational field shows that each user can be a friend with many users, while other users can also have the same friends.

📣 Conversations

The Conversation Collection holds information regarding the group of messages that make up the conversation.

• Name [Text] — a unique identifier for the conversation taking place. In this case, it is the name of the two individuals in the chat.

• Messages [One-to-Many Relationship] — a relational field to show that one conversation can have many messages, but those messages can only belong to one conversation.

• Users [Many-to-Many Relationship] — a relational field to show that many users can belong to many different conversations, even if only two users can belong to the same conversation at once.

💬 Messages

The Messages Collection holds information regarding all the messages that are sent between users in the app.

• Text [Text] — the message body that is sent from one user to another.

• Sender [Many-to-One Relationship] — this relational field shows that many messages can belong to one user, and each message can only have one sender.

• Receiver [Many-to-One Relationship] — this relational field shows that many messages can be received by one user, and each message can only belong to one receiver.

• Conversations [Many-to-One Relationship] — this relational field shows that many messages can belong to one conversation, however, each message is unique to that one conversation.

• Image [Image] — this property holds an image that is sent alongside a message.

Layout Settings

Each screen in the Browse Classes Feature Template is created using responsive design. The screens will look good on any device or tablet.

Most screens have been designed with Custom Layouts. If you add a new component to a screen, you might notice that the other screen sizes are impacted.

Layout Overview

To view or edit the layout for different screen sizes — click the Screen title to reveal the dropdown.

The default view for this template is Desktop. When you change the screen size for one screen in the Builder, it does not change the screen size of the rest of the screens on the canvas.

Hidden Components

In each view, there may be components that do not appear on Desktop, but are visible on Mobile. These are grayed out in the lefthand panel & denoted with an icon.

Another way to view which device components are visible on is the Layout Tab here:

Custom Layout

Some components come with custom layouts based on screen size. To view those settings, check the Layout Tab & scroll to the Custom Layout Settings.

Example Use Cases

• A chat experience for pickleball club members to talk with one another.

• A messaging experience for teachers to communicate with parents or students.

• A conversation feature for landlords to converse with their tenants.

• and many more!