Stand with Ukraine flag
Try it now Pricing
Professional Edition
Community Edition Professional Edition Cloud Edge PE Edge IoT Gateway License Server Trendz Analytics Mobile Application PE Mobile Application MQTT Broker
Getting Started
Devices Library Guides Installation Architecture API FAQ
On this page

Mobile center

Available since TB Version 3.9.0

The Mobile сenter is your one-stop hub for building, configuring, and managing mobile apps in ThingsBoard. Whether you're starting from scratch or preparing to publish your ThingsBoard PE Mobile Application to the Google Play Store or App Store, this tool walks you through every step of the process.

The Mobile center is divided into tabs for convenient creation and management of mobile applications:

  • Bundle: Manage settings for mobile applications included in the bundle. These settings include configuring secure authentication methods for your clients, defining the layout, and managing options for user self-registration within the mobile application.
  • Applications: Manage your mobile applications - add new ones, edit existing ones, or remove outdated versions.
  • QR code widget: Set up a QR code widget on the ThingsBoard “Home” page to give users easy access to the mobile app.

Bundle

A Bundle groups together configurations like OAuth 2.0 settings , layout design and self-registration for one or more mobile apps—allowing you to manage Android and iOS versions all in one place.

The following settings are available for the applications bundle:

  1. Basic settings: Define the bundle name and link your apps. Don't have an app yet? You can create one right here.
  2. OAuth 2.0: Enable Single Sign-On (SSO) for users by integrating with third-party identity providers that support OAuth 2.0.
  3. Layout: Customize the app’s navigation menu to match your use cases.
  4. Self-registration: Set up a user-friendly registration form for new mobile users.


How to add a new bundle

  • Go to the “Mobile center” page.
  • On the “Bundle” tab, click the “+ Add bundle” button in the upper-right corner of the window.

A new settings dialog will open.

To add a new bundle, navigate to the "Mobile center" page and click the "+ Add bundle" button in the upper-right corner of the window.
To add a new bundle, navigate to the "Mobile center" page and click the "+ Add bundle" button in the upper-right corner of the window.

Basic settings

Enter a name for your bundle and select existing Android/iOS apps, or create new ones directly from this window.

Enter the bundle name and specify an existing Android/iOS mobile application(s), or create a new one. Then, click "Next".
Enter the bundle name and specify an existing Android/iOS mobile application(s), or create a new one. Then, click "Next".

You can add applications even after the bundle with configurations is created.

Create new application

  • Click “Create new” in the corresponding section (Android Application or iOS Application).
  • Enter the application package name.
  • An Application Secret will be generated automatically. Remember it or replace with your own.
  • Set the application status:
    • Draft: For applications still in development. You can add store information (e.g., Google Play Store or App Store link, and SHA256 certificate fingerprints or App ID) later after the application is created and published.
    • Published: For applications that are ready to be launched and used by end users.
    • Deprecated: For older applications that are no longer actively supported but still available.
    • Suspended: For applications that are temporarily disabled or restricted from use.
  • (Optional) Specify minimum/latest app versions and release notes.
  • Add store information:
    • Android: Google Play Store link and SHA256 certificate fingerprints.
    • iOS: App Store link and App ID.
  • Click “Add” to save your application and complete the process.
Click "Create new" in the appropriate section (Android Application or iOS Application);
Click "Create new" in the appropriate section (Android Application or iOS Application);
Android Application. Enter the application package name. Remember autogenerated "Application Secret" or input your own. Specify application statuses. Optionally, specify the minimum and latest application versions along with release notes for each. Specify store information: link to the ThingsBoard PE Mobile Application in the Google Play Store, and SHA256 certificate fingerprints. Click "Add".
Android Application. Enter the application package name. Remember autogenerated "Application Secret" or input your own. Specify application statuses. Optionally, specify the minimum and latest application versions along with release notes for each. Specify store information: link to the ThingsBoard PE Mobile Application in the Google Play Store, and SHA256 certificate fingerprints. Click "Add".
iOS Application. Enter the application package name. Remember autogenerated "Application Secret" or input your own. Specify application statuses. Optionally, specify the minimum and latest application versions along with release notes for each. Specify store information: link to the ThingsBoard PE Mobile Application in the App Store, and App ID. Click "Add".
iOS Application. Enter the application package name. Remember autogenerated "Application Secret" or input your own. Specify application statuses. Optionally, specify the minimum and latest application versions along with release notes for each. Specify store information: link to the ThingsBoard PE Mobile Application in the App Store, and App ID. Click "Add".

Then, click “Next”.

OAuth 2.0

Add an authentication feature for your users in the ThingsBoard PE Mobile Application through an external provider that supports the OAuth 2.0 protocol. In order to do this, specify an already configured OAuth 2.0 client(s) or configure a new one. After completing the OAuth 2.0 configuration, click “Next”.

You can also disable the use of OAuth 2.0 for mobile devices.

Specify an already configured OAuth 2.0 client(s) or configure a new one;
Specify an already configured OAuth 2.0 client(s) or configure a new one;
After completing the OAuth 2.0 configuration, click "Next".
After completing the OAuth 2.0 configuration, click "Next".

Layout

Set up quick access to the features and dashboards you use most frequently. Add new menu items, change icons and item names, and reorganize the navigation menu of the ThingsBoard PE Mobile Application according to your needs.

To add new menu item, follow these steps:

  • Click the “+ Add specific page” button at the bottom of the page or between existing menu items;
  • Enter the name for new menu page;
  • Select the page type from the list:
    • Dashboard - link to a ThingsBoard dashboard.
    • Webview - link to an external webpage.
    • Custom - link to built-in ThingsBoard pages.

  • Depending on the selected page type, specify a dashboard, or link to an external webpage or ThingsBoard menu item;

  • Click “Add”;
  • After configuring layout, click “Next”.
Click the "+ Add specific page" button at the bottom of the page or between existing menu items;
Click the "+ Add specific page" button at the bottom of the page or between existing menu items;
Enter the name for new menu page, and select the page type. Depending on the selected page type, specify a dashboard, path, or external URL. Click "Add".
Enter the name for new menu page, and select the page type. Depending on the selected page type, specify a dashboard, path, or external URL. Click "Add".
After configuring layout, click "Next".
After configuring layout, click "Next".


The following routes are available for the “Custom” page type:

Page name Routes Dicription
Home /home Displays the “Home” page
Assets /assets Displays the “Assets” page
Device profiles /devices Displays the “Device profiles” page
All devices /deviceList Displays the list of all devices
Alarms /alarms Displays the list of alarms
Dashboards /dashboards Displays the list of dashboards
Specific dashboard /dashboard/:id Displays the specified dashboard
Audit logs /auditLogs Displays the “Audit logs” page
Customers /customers Displays the list of customers
Specific customer /customer/:id Displays the specified customer
Notifications /notifications Displays the list of notifications
Custom URL link /url/:link Displays the “Assets” page

The menu configuration algorithm for the mobile application is similar to menu customization in the desktop ThingsBoard. Refer to this documentation for a deeper understanding of menu customization.

“More” page

The number of menu items displayed in the navigation menu of the mobile app depends on the screen size of your mobile device. Items that do not fit in the bottom navigation menu will be available under the “More” page.

The number of menu items displayed in the navigation menu of the mobile app depends on the screen size of your mobile device. Items that do not fit in the bottom navigation menu will be available under the "More" page.
The number of menu items displayed in the navigation menu of the mobile app depends on the screen size of your mobile device. Items that do not fit in the bottom navigation menu will be available under the "More" page.

Self registration

The self registration feature allows the tenant to configure a sign-up page for their clients, allowing them to easily sign up and log in to ThingsBoard with predefined permission configurations.

Configure the self registration form for new clients:

  • Page title. Enter the page title to be displayed at the top of the registration page. It serves as a header to indicate the purpose of the form to users.
  • Notification recipient. Specify the recipients that will receive notifications about new user registrations. Learn more about notifications and how to add a new notification recipient here.
  • Redirect settings:
    • Application URL scheme: Defines the custom URL scheme used for redirecting users after successful registration. For example, tbscheme.
    • Application URL hostname: The hostname component of the URL used in redirection, e.g., app.pe.thingsboard.org.
Enter the page title to be displayed at the top of the registration page. It serves as a header to indicate the purpose of the form to users. Specify the recipients that will receive notifications about new user registrations. Specify the redirect settings: Application URL Scheme, and Application URL Hostname;
Enter the page title to be displayed at the top of the registration page. It serves as a header to indicate the purpose of the form to users. Specify the recipients that will receive notifications about new user registrations. Specify the redirect settings: Application URL Scheme, and Application URL Hostname;
  • Registration form fields. The mandatory fields for completing the registration form are email, password, and repeat password. If needed, specify additional fields.
The mandatory fields for completing the registration form are email, password, and repeat password. If needed, specify additional fields;
The mandatory fields for completing the registration form are email, password, and repeat password. If needed, specify additional fields;
  • Captcha properties. Captcha (Completely Automated Public Turing test to tell Computers and Humans Apart) is an automated test used to distinguish between human users and bots. Using Captcha in ThingsBoard helps prevent the automated creation of fake accounts in the system.

To generate the Captcha, navigate to the Google ReCaptcha admin console:

  • Select which version of reCAPTCHA you will use: v2, v3, or Enterprise.
  • Specify the domain name of your ThingsBoard instance.
  • Copy and securely store the the site key and secret key.
Navigate to the Google ReCaptcha admin console;
Navigate to the Google ReCaptcha admin console;
Specify the domain name of your ThingsBoard instance. Choose reCAPTCHA type;
Specify the domain name of your ThingsBoard instance. Choose reCAPTCHA type;
Copy and securely store the the site key and secret key.
Copy and securely store the the site key and secret key.

In ThingsBoard:

  • Select the Captcha version to be used.
  • Specify Captcha site key - the public key used to render the CAPTCHA on the site.
  • Specify Captcha secret key - the private key used for verifying CAPTCHA responses on the server.
  • Captcha log action name: specifies the action associated with CAPTCHA, used for logging purposes.
Choose the Captcha version to be used, and specify "Captcha site key" and "Captcha secret key";
Choose the Captcha version to be used, and specify "Captcha site key" and "Captcha secret key";
  • Show Privacy Policy. Enable or disable the display of a Privacy Policy link on the registration page.
  • Show Terms of Use. Enable or disable the display of a Terms of Use link on the registration page.
  • User group roles. Specify the roles that will be assigned to the user upon successful registration. These roles determine the permissions and access level for the user.
Show/hide Privacy Policy and Terms of Use. Specify the roles that will be assigned to the user upon successful registration.
Show/hide Privacy Policy and Terms of Use. Specify the roles that will be assigned to the user upon successful registration.
  • Advanced settings:
    • Customer group: specify the customer group to which the new user will be added.
    • Customer title prefix: specify the prefix that will be added to the customer's title for identification purposes.
    • Custom menu: Apply a custom navigation menu for the new user.
    • Default dashboard: The dashboard that the user sees upon logging in for the first time.
Fill in the required fields in "Advanced settings". Specify the dashboard that the user sees upon logging in for the first time;
Fill in the required fields in "Advanced settings". Specify the dashboard that the user sees upon logging in for the first time;
  • Home dashboard. The main dashboard that will be displayed to the user when navigating to the “Home” menu item.
Specify the main dashboard that will be displayed to the user when navigating to the “Home” menu item. Click "Add" to complete the bundle creation.
Specify the main dashboard that will be displayed to the user when navigating to the “Home” menu item. Click "Add" to complete the bundle creation.
  • Click “Add” to complete the bundle creation.

Configuration dialog

Next, a configuration dialog will open. Continue configuring your new mobile app using the provided instructions. Or skip this step if you already have a ThingsBoard PE Mobile Application. Click “Close”.

Next, a configuration dialog will open, which contains the basic configuration settings for the ThingsBoard PE Mobile Application.
Next, a configuration dialog will open, which contains the basic configuration settings for the ThingsBoard PE Mobile Application.
Doc info icon

For more information on launching your new app, refer to the “Getting started with the ThingsBoard PE Mobile Application” documentation.

Bundle has been added. The applications specified in the bundle now use the defined settings.

Bundle has been added. The applications specified in the bundle now use the defined settings.
Bundle has been added. The applications specified in the bundle now use the defined settings.

Next steps