How can I get device information in Flutter?

Introduction

While developing mobile applications, it is essential to make sure that our app runs on all devices as intended. If we talk about Android devices, there are many smartphone manufacturers with different specifications and different Android OS versions.

Some Android API levels have different permissions requirements, and some have different.

To make our app a breeze to use, we'll have to counter all these cases while we are deciding upon a feature.

Why is it important to get device information?

Performance optimization and user experience enhancement

Collecting device information can have multiple reasons. There are some cases when we need it to optimize our app and enhance the user experience. After all, it's all about a good UX.

For example, let's say we're building an app with a super elegant UI with lots of animation. The app will work fine on high-end phones with good specs, but when it meets the lower spectrum of the specs, it starts to lag and gives an unpleasant experience to its users. To mitigate this issue, we can get the device information, including its specs, and limit our animations and all heavy-duty tasks to avoid lag.

Bug fixing and troubleshooting

Testing an application in-house is sometimes not sufficient. We must implement proper logging techniques into our app to get to the root cause of the issue. We can always get all the device information and push it into our logging system to reproduce the error and fix it.

Speaking of logging systems, we can use Firebase error logging, which is efficient, fast, and easy to implement in the app.

Get the device information using the device_info_plus library

The device_info_plus library is used to get device information within our Flutter application.

By using these plugin classes, we can get information on almost all the major operating systems, including Android, iOS, Linux, and browsers.

A list of all the classes in the device_info_plus library:

AndroidBuildVersion: Derived from the android.os.Build.VERSION class, this class represents the version values of the current Android operating system build.

AndroidDeviceInfo: Data extracted from android.os.Build about an Android device. It offers information on the item, like the model, maker, version, and so forth.

BaseDeviceInfo: The fundamental class for platform-specific device information is called BaseDeviceInfo. It provides device information on many platforms and acts as a foundation for other classes.

DeviceInfoPlugin: A plugin that provides operating system and device details. Retrieving device-related data is facilitated by its central interface, which abstracts away platform-specific implementations.

DeviceInfoPlusLinuxPlugin: On Linux computers, this plugin provides device information. It adds functionality to the DeviceInfoPlatform by incorporating characteristics unique to Linux.

DeviceInfoPlusWindowsPlugin: This is DeviceInfoPlatform's Windows-specific implementation. It provides Windows operating system device information.

IosDeviceInfo: Data collected from UIDevice about an iOS device. It contains specifics like the name, model, and system version of the device.

IosUtsname: In UNIX-like operating systems, utsname is a data structure from which this class gets its information. It provides basic information about the system, including its name, version, and other features.

LinuxDeviceInfo: Device details unique to Linux systems are listed in LinuxDeviceInfo. It gives information on the hardware, kernel version, and other aspects of the device.

MacOsDeviceInfo: An object for macOS systems that contains device information. It provides information on the macOS device, including the model and version.

WebBrowserInfo: The navigator object provides information about the web browser. It contains information about the browser, such as its name, version, etc.

WindowsDeviceInfo: An object for Windows systems that contains device information. It provides information on the Windows device, including the model and version.

Adding dependencies to pubspec.yaml

    dependencies:
        device_info_plus: ^10.1.0
                    

Importing package

    import 'package:device_info_plus/device_info_plus.dart';
                    

Example code

    import 'package:flutter/material.dart';
import 'package:device_info_plus/device_info_plus.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late DeviceInfoPlugin _deviceInfoPlugin;
  late Map<String, dynamic> _deviceData;

  @override
  void initState() {
    super.initState();
    _deviceInfoPlugin = DeviceInfoPlugin();
    _getDeviceInfo();
  }

  Future<void> _getDeviceInfo() async {
    try {
      if (defaultTargetPlatform == TargetPlatform.android) {
        AndroidDeviceInfo androidInfo = await _deviceInfoPlugin.androidInfo;
        setState(() {
          _deviceData = _readAndroidBuildData(androidInfo);
        });
      } else if (defaultTargetPlatform == TargetPlatform.iOS) {
        IosDeviceInfo iosInfo = await _deviceInfoPlugin.iosInfo;
        setState(() {
          _deviceData = _readIosDeviceInfo(iosInfo);
        });
      } else if (defaultTargetPlatform == TargetPlatform.linux) {
        LinuxDeviceInfo linuxInfo = await _deviceInfoPlugin.linuxInfo;
        setState(() {
          _deviceData = _readLinuxDeviceInfo(linuxInfo);
        });
      } else if (defaultTargetPlatform == TargetPlatform.windows) {
        WindowsDeviceInfo windowsInfo = await _deviceInfoPlugin.windowsInfo;
        setState(() {
          _deviceData = _readWindowsDeviceInfo(windowsInfo);
        });
      } else if (defaultTargetPlatform == TargetPlatform.macOS) {
        MacOsDeviceInfo macosInfo = await _deviceInfoPlugin.macOsInfo;
        setState(() {
          _deviceData = _readMacOsDeviceInfo(macosInfo);
        });
      } else if (defaultTargetPlatform == TargetPlatform.fuchsia) {
        // Handle Fuchsia platform
        setState(() {
          _deviceData = <String, dynamic>{
            'Error': 'Fuchsia platform isn\'t supported'
          };
        });
      }
    } catch (e) {
      setState(() {
        _deviceData = <String, dynamic>{'Error': 'Failed to get device info'};
      });
    }
  }

  Map<String, dynamic> _readAndroidBuildData(AndroidDeviceInfo build) {
    // Implement parsing Android device info here
    return <String, dynamic>{
      'device': build.device,
      'brand': build.brand,
      // Add more properties as needed
    };
  }

  Map<String, dynamic> _readIosDeviceInfo(IosDeviceInfo data) {
    // Implement parsing iOS device info here
    return <String, dynamic>{
      'model': data.model,
      'name': data.name,
      // Add more properties as needed
    };
  }

  Map<String, dynamic> _readLinuxDeviceInfo(LinuxDeviceInfo data) {
    // Implement parsing Linux device info here
    return <String, dynamic>{
      'name': data.name,
      // Add more properties as needed
    };
  }

  Map<String, dynamic> _readWindowsDeviceInfo(WindowsDeviceInfo data) {
    // Implement parsing Windows device info here
    return <String, dynamic>{
      'computerName': data.computerName,
      // Add more properties as needed
    };
  }

  Map<String, dynamic> _readMacOsDeviceInfo(MacOsDeviceInfo data) {
    // Implement parsing MacOS device info here
    return <String, dynamic>{
      'model': data.model,
      // Add more properties as needed
    };
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Device Info'),
        ),
        body: _deviceData == null
            ? Center(child: CircularProgressIndicator())
            : ListView.builder(
                itemCount: _deviceData.length,
                itemBuilder: (context, index) {
                  String key = _deviceData.keys.elementAt(index);
                  return ListTile(
                    title: Text(key),
                    subtitle: Text('${_deviceData[key]}'),
                  );
                },
              ),
      ),
    );
  }
}

                    

Conclusion

In this article, we learned about how to use the device_info_plus library to get device information and take appropriate action based on that data.