How to get Device info – Flutter

An app should not be limited to a single device, it should work on all devices, which should be the first priority for any developer. Sometimes unlikely our application probably wouldn’t work on some devices, in which case it’s best to gather device information. So that developers may use that log report to simply track and fix bugs.

In this tutorial, we’ll learn how to get device info using the coolest package called device_info_plus available in pub get.

About device_info_plus 

We can get current device information from within the Flutter application by using the device_info_plus package. Which is supports all kinds of platforms, including Android, iOS, macOS, web, Linux, and Windows.

Adding dependency

We need to add this package to pubspec.yaml and run the pub get command to get it into our flutter project.

dependencies:
  device_info_plus: ^3.2.0

Import Package

After the package has been installed into our flutter project, we can use the classes and functions by importing it.

import 'package:device_info_plus/device_info_plus.dart';

Create a DeviceInfoPlugin class Instance

The DeviceInfoPlugin class is the package’s core class and contains most of the methods, we should create an instance of it as seen under.

//Instance of DeviceInfoPlugin 
 DeviceInfoPlugin deviceInfo = DeviceInfoPlugin();

Get the Device info from a Specific platform

We can access device information using the respected platform method after making an instance of the DeviceInfoPlugin class.

//Android
AndroidDeviceInfo androidDeviceInfo = await deviceInfo.androidInfo; 

//iOS
IosDeviceInfo iosDeviceInfo = await deviceInfo.iosInfo;

//Web
WebBrowserInfo webBrowserInfo = await deviceInfo.webBrowserInfo;

//Linux
LinuxDeviceInfo linuxDeviceInfo= await deviceInfo.linuxInfo; 

//macOs
MacOsDeviceInfo macOsDeviceInfo= await deviceInfo.macOsInfo;

//Windows
WindowsDeviceInfo windowsDeviceInfo= await deviceInfo.windowsInfo;

If we take the Android device information, this plugin obtains all of the information generated from ‘android.os.Build’.

 AndroidDeviceInfo({
    required this.version,
    this.board,
    this.bootloader,
    this.brand,
    this.device,
    this.display,
    this.fingerprint,
    this.hardware,
    this.host,
    this.id,
    this.manufacturer,
    this.model,
    this.product,
    required List<String?> supported32BitAbis,
    required List<String?> supported64BitAbis,
    required List<String?> supportedAbis,
    this.tags,
    this.type,
    this.isPhysicalDevice,
    this.androidId,
    required List<String?> systemFeatures,
  })

We now got an idea of the device_info_plus package. Create a new flutter project and replace the following code and run the application to get more idea.

//How to get the device info in flutter applications - Flutterant.com
import 'dart:async';
import 'dart:io';
import 'package:device_info_plus/device_info_plus.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  runApp(const HomePage());
}

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  static final DeviceInfoPlugin deviceInfoPlugin = DeviceInfoPlugin();
  Map<String, dynamic> _deviceData = <String, dynamic>{};

  @override
  void initState() {
    super.initState();
    initPlatformState();
  }

  Future<void> initPlatformState() async {
    var deviceData = <String, dynamic>{};

    try {
        if (Platform.isAndroid) {
          deviceData =
              _readAndroidBuildData(await deviceInfoPlugin.androidInfo);
        } else if (Platform.isIOS) {
          deviceData = _readIosDeviceInfo(await deviceInfoPlugin.iosInfo);
      }
    } on PlatformException {
      deviceData = <String, dynamic>{
        'Error:': 'Failed to get platform version.'
      };
    }

    if (!mounted) return;

    setState(() {
      _deviceData = deviceData;
    });
  }

  Map<String, dynamic> _readAndroidBuildData(AndroidDeviceInfo build) {
    return <String, dynamic>{
      'version.securityPatch': build.version.securityPatch,
      'version.sdkInt': build.version.sdkInt,
      'version.release': build.version.release,
      'version.previewSdkInt': build.version.previewSdkInt,
      'version.incremental': build.version.incremental,
      'version.codename': build.version.codename,
      'version.baseOS': build.version.baseOS,
      'board': build.board,
      'bootloader': build.bootloader,
      'brand': build.brand,
      'device': build.device,
      'display': build.display,
      'fingerprint': build.fingerprint,
      'hardware': build.hardware,
      'host': build.host,
      'id': build.id,
      'manufacturer': build.manufacturer,
      'model': build.model,
      'product': build.product,
      'supported32BitAbis': build.supported32BitAbis,
      'supported64BitAbis': build.supported64BitAbis,
      'supportedAbis': build.supportedAbis,
      'tags': build.tags,
      'type': build.type,
      'isPhysicalDevice': build.isPhysicalDevice,
      'androidId': build.androidId,
      'systemFeatures': build.systemFeatures,
    };
  }

  Map<String, dynamic> _readIosDeviceInfo(IosDeviceInfo data) {
    return <String, dynamic>{
      'name': data.name,
      'systemName': data.systemName,
      'systemVersion': data.systemVersion,
      'model': data.model,
      'localizedModel': data.localizedModel,
      'identifierForVendor': data.identifierForVendor,
      'isPhysicalDevice': data.isPhysicalDevice,
      'utsname.sysname:': data.utsname.sysname,
      'utsname.nodename:': data.utsname.nodename,
      'utsname.release:': data.utsname.release,
      'utsname.version:': data.utsname.version,
      'utsname.machine:': data.utsname.machine,
    };
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text(
           Platform.isAndroid
                ? 'Android Device Info'
                : Platform.isIOS
                ? 'iOS Device Info'
                : '',
          ),
        ),
        body: ListView(
          children: _deviceData.keys.map(
                (String property) {
              return Row(
                children: <Widget>[
                  Container(
                    padding: const EdgeInsets.all(10.0),
                    child: Text(
                      property,
                      style: const TextStyle(
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                  Expanded(
                      child: Container(
                        padding: const EdgeInsets.fromLTRB(0.0, 10.0, 0.0, 10.0),
                        child: Text(
                          '${_deviceData[property]}',
                          maxLines: 10,
                          overflow: TextOverflow.ellipsis,
                        ),
                      )),
                ],
              );
            },
          ).toList(),
        ),
      ),
    );
  }
}
//How to get the device info in flutter applications - Flutterant.com

After successfully running the application, we will get the following output as shown in the image below.

Device info

For more information about device_info_plus click here

Thanks for reading … 🙂

Leave a Comment