Demo to preview the plugin:
Introduction
The Native Device Info plugin provides comprehensive device information and location tracking capabilities for mobile applications built with Bubble. This plugin is specifically designed for mobile platforms (iOS and Android) and allows you to gather essential device data including platform details, screen dimensions, network connectivity status, and real-time location tracking.
The plugin automatically collects device information when initialized and provides location services with customizable tracking intervals. It’s perfect for applications that need to adapt their behavior based on device characteristics or require location-based functionality.
Prerequisites
This plugin is designed for mobile platforms and requires:
- A Bubble mobile application (iOS or Android)
- Location permissions will be requested automatically when using location features
- No external API keys or third-party accounts required
This plugin is designed specifically for the mobile version of the Bubble editor. To test the plugin on your mobile device, use the TestFlight app available at:
Please note that the testing app is currently available for iOS only.
How to setup
To start using the Native Device Info plugin:
- Install the plugin from the Bubble plugin marketplace.
- Add the “Device Info” element to your page.
- The element will automatically start collecting device information once placed.
- No additional configuration is required - the plugin works out of the box.
- To use location features, simply trigger the “Get Location” action when needed.
- The plugin will automatically request necessary permissions from the user.
The element is minimal in size (20x20px by default) and can be placed anywhere on your page as it serves as a data collector rather than a visual component.
Plugin Element Properties
The plugin contains a Device Info visual element that should be placed on a page to collect device information and provide location services.
Device Info
Element Actions
Get Location
Stop Track Location
Exposed states
Name | Description | Type |
Platform (IOS/Android/Web) | Operating system identifier (ios/android/web) | Text |
Platform Version | Operating system version number | Number |
Is IOS ? | Boolean flag indicating iOS platform | Boolean |
Is Android ? | Boolean flag indicating Android platform | Boolean |
Screen Width (px) | Physical screen width in pixels | Number |
Screen Height (px) | Physical screen height in pixels | Number |
Window Width (px) | Application window width in pixels | Number |
Window Height (px) | Application window height in pixels | Number |
Pixel Ratio | Device pixel density ratio | Number |
Font Scale | System font scaling factor | Number |
Device Name | Device manufacturer and model name | Text |
Locales | Array of user’s language and region preferences | Text (list) |
Timezone | Current device timezone identifier | Text |
Calendar | Default calendar system in use | Text |
Network Type | Connection type (wifi/cellular/ethernet/none) | Text |
Is Connected | Boolean indicating network connectivity status | Boolean |
Is Internet Reachable | Boolean indicating internet accessibility | Boolean |
Timestamp | ISO 8601 formatted collection timestamp | Date |
Location Latitude | Current device latitude coordinate | Number |
Location Longitude | Current device longitude coordinate | Number |
Location Accuracy | Location accuracy in meters | Number |
Location Status | Current status of location services | Text |
Element Events
Name | Description |
Info Ready | Triggered when device information has been successfully collected and is available |
Location Received | Triggered when location data is successfully retrieved or updated |
Workflow example
Here’s a basic workflow to get you started with the Native Device Info plugin: