On this page

• Introduction
• Step 1. Prepare development environment
• Step 2. Get app source code
  • Flutter ThingsBoard Mobile Application compatibility table
• Step 3. Configure ThingsBoard API endpoint
• Step 4. Run the app
• Live demo app
• Next Steps

Introduction

The goal of this tutorial is to demonstrate the basic setup of ThingsBoard Mobile Application with your ThingsBoard platform instance. You will learn how to:

• Setup development environment;
• Get application project source code;
• Configure API endpoint to your ThingsBoard platform instance;
• Build and run your version of ThingsBoard Mobile Application;

Step 1. Prepare development environment

Flutter ThingsBoard Mobile Application requires Flutter SDK starting from version 2.12.0. Follow these instructions in order to setup Flutter SDK. For an even better experience we recommend to set up an editor using these instructions.

Flutter ThingsBoard Mobile Application is served by ThingsBoard platform starting from version 3.4.0. You will need to have ThingsBoard server up and running. The easiest way is to use Live Demo. The alternative option is to install ThingsBoard using Installation Guide.

Step 2. Get app source code

Flutter ThingsBoard Mobile Application compatibility table

Determine the Flutter ThingsBoard Mobile Application version according to the version of ThingsBoard.

You can get Flutter ThingsBoard Mobile Application source code by cloning it from github repository:

1
git clone -b release/1.0.6 https://github.com/thingsboard/flutter_thingsboard_app.git

Step 3. Configure ThingsBoard API endpoint

Open flutter_thingsboard_app project in your editor/IDE. Edit lib/constants/app_constants.dart.

Set value of thingsBoardApiEndpoint constant to match api endpoint of your ThingsBoard server instance.
In case of Live Demo set it to https://demo.thingsboard.io.

1
2
3
4
5
6
abstract class ThingsboardAppConstants {
  static final thingsBoardApiEndpoint = 'https://demo.thingsboard.io';
  
  ...
}

Note: Do not use localhost or 127.0.0.1 host names.
If you are using local ThingsBoard installation use alternative ip address/host name accessible within your local network.
You can read Connecting Flutter application to Localhost for more information.

Step 4. Run the app

Run the app in the way your IDE describes.

When using terminal run the app with the following command:

1
flutter run

You should see either Android or iOS output, depending on your device.

Android

iOS

Tip: The first time you run on a physical device, it can take a while to load. Afterward, you can use hot reload for quick updates.

Save also performs a hot reload if the app is running. When running an app directly from the console using flutter run, enter r to perform hot reload.

Live demo app

To be familiar with common app features try out our ThingsBoard Live mobile application available on Google Play and App Store.

Next Steps

• Customize your app - Learn how to customize your ThingsBoard Mobile Application to meet your requirements.
• Publish your app - Learn how to build release and publish your version of ThingsBoard Mobile Application to Google Play or App Store.