Flutterexperts

In general, making a mobile application is an extremely mind-boggling and testing task. There are numerous frameworks available, which give magnificent highlights to create mobile applications. For creating mobile applications, Android gives a native structure framework on Java and Kotlin language, while iOS gives a system dependent on Objective-C/Swift language.

Subsequently, we need two unique languages and structures to create applications for both OS. Today, to beat structure this intricacy, several frameworks have presented that help both OS along desktop applications. These sorts of the framework are known as cross-platform development tools.

In this blog, we will explore How To Get Unique Device Details In Flutter?. We will implement a demo program and get unique device details for both Android and IOS using the device_info package in your flutter applications.

device_info | Flutter Package
Get current device information from within the Flutter application. Import package:device_info/device_info.dart…pub.dev

Table Of Contents::

Introduction

Implementation

Code Implement

Code File

Conclusion

---

---

Introduction:

Flutter gives get current device data from inside the Flutter application. How to get unique device details for both Android and IOS in flutter utilizing the device_info plugin. At the point when we talk about a unique device detail in native, we are having Settings.Secure.ANDROID_ID to get a one-of-a-kind device detail.

Demo Module :

This demo video shows how to get a unique device detail in a flutter. It shows how the device detail will work using the device_info package in your flutter applications. It shows when the user tap on the raised button, the unique device Andriod/Ios information like device name, version, identifier, etc shown on your screen. It will be shown on your device.

Implementation:

Step 1: Add the dependencies

Add dependencies to pubspec — yaml file.

dependencies:
  flutter:
    sdk: flutter
  device_info: 

Step 2: Import

import 'package:device_info/device_info.dart';

Step 3: Run flutter packages get in the root directory of your app.

How to implement code in dart file :

You need to implement it in your code respectively:

Create a new dart file called device_detail_demo.dart inside the lib folder.

First, we will create a UI. In the body part, we will add a center widget. Inside, we will add a column widget. In this widget, we will add a mainAxisAlignmnet was center. It’s children’s property, add a RaisedButton(). In this button, we will add padding, color, and the OnPressed function. It’s child property, we will a text “Device Details”.

Center(
  child: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      RaisedButton(
        padding: EdgeInsets.all(14),
        color: Colors.cyan[50],
        onPressed: (){},
        child: Text("Device Details",
          style: TextStyle(color: Colors.black),),
      ),
    ],
  ),
),

When we run the application, we ought to get the screen’s output like the underneath screen capture.

We will create three strings deviceName, deviceVersion, and identifier.

String deviceName ='';
String deviceVersion ='';
String identifier= '';

Now, we will add the main function of the program. We will add future _deviceDetails(). Inside, we will add a final DeviceInfoPlugin is equal to the new DeviceInfoPlugin(). We will add the try{}method and we will import dart: io for the platform.

import 'dart:io';

If the platform is Andriod then, the build is equal deviceInfoPlugin for andriod info. Add a setState() method. In this method, we will add all string is equal to the build. Else if the platform is Ios then, the build is equal deviceInfoPlugin for ios info. Add a setState() method. In this method, we will add all string is equal to the build.

Future<void>_deviceDetails() async{
  final DeviceInfoPlugin deviceInfoPlugin = new DeviceInfoPlugin();
  try {
    if (Platform.isAndroid) {
      var build = await deviceInfoPlugin.androidInfo;
      setState(() {
        deviceName = build.model;
        deviceVersion = build.version.toString();
        identifier = build.androidId;
      });
      //UUID for Android
    } else if (Platform.isIOS) {
      var data = await deviceInfoPlugin.iosInfo;
      setState(() {
        deviceName = data.name;
        deviceVersion = data.systemVersion;
        identifier = data.identifierForVendor;
      });//UUID for iOS
    }
  } on PlatformException {
    print('Failed to get platform version');
  }

}

We will import services for PlatformException

import 'package:flutter/services.dart';

Now, we will add _deviceDetails() onPressed functon on the raised button

onPressed: (){
  _deviceDetails();
},

We will add the device version, name, and the identifier is not empty then show a Column widget. In this widget, we will add all three text like Device Name, Device Version, and Device Identifier will be shown on your device. Otherwise, show an empty container.

deviceVersion.isNotEmpty && deviceName.isNotEmpty
    && identifier.isNotEmpty?
Column(
  children: [
    SizedBox(height: 30,),
    Text("Device Name:- "+deviceName,style: TextStyle
      (color: Colors.red,
        fontWeight: FontWeight.bold)),
    SizedBox(height: 30,),
    Text("Device Version:- "+deviceVersion,style: TextStyle
      (color: Colors.red,
        fontWeight: FontWeight.bold)),
    SizedBox(height: 30,),
    Text("Device Identifier:- "+identifier,style: TextStyle
      (color: Colors.red,
        fontWeight: FontWeight.bold)),
    SizedBox(height: 30,),
  ],
): Container(),

When the user taps the button then, all three data will be shown on your device. When we run the application, we ought to get the screen’s output like the underneath screen capture.

Code File:

import 'dart:io';
import 'package:device_info/device_info.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class DeviceDetailDemo extends StatefulWidget {


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

class _DeviceDetailDemoState extends State<DeviceDetailDemo> {

  String deviceName ='';
  String deviceVersion ='';
  String identifier= '';

  Future<void>_deviceDetails() async{
    final DeviceInfoPlugin deviceInfoPlugin = new DeviceInfoPlugin();
    try {
      if (Platform.isAndroid) {
        var build = await deviceInfoPlugin.androidInfo;
        setState(() {
          deviceName = build.model;
          deviceVersion = build.version.toString();
          identifier = build.androidId;
        });
        //UUID for Android
      } else if (Platform.isIOS) {
        var data = await deviceInfoPlugin.iosInfo;
        setState(() {
          deviceName = data.name;
          deviceVersion = data.systemVersion;
          identifier = data.identifierForVendor;
        });//UUID for iOS
      }
    } on PlatformException {
      print('Failed to get platform version');
    }

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.redAccent[100],
        title: Text("Flutter Device Details Demo"),
        automaticallyImplyLeading: false,
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            RaisedButton(
              padding: EdgeInsets.all(14),
              color: Colors.cyan[50],
              onPressed: (){
                _deviceDetails();
              },
              child: Text("Device Details",
                style: TextStyle(color: Colors.black),),
            ),
            deviceVersion.isNotEmpty && deviceName.isNotEmpty
                && identifier.isNotEmpty?
            Column(
              children: [
                SizedBox(height: 30,),
                Text("Device Name:- "+deviceName,style: TextStyle
                  (color: Colors.red,
                    fontWeight: FontWeight.bold)),
                SizedBox(height: 30,),
                Text("Device Version:- "+deviceVersion,style:    TextStyle
                  (color: Colors.red,
                    fontWeight: FontWeight.bold)),
                SizedBox(height: 30,),
                Text("Device Identifier:- "+identifier,style: TextStyle
                  (color: Colors.red,
                    fontWeight: FontWeight.bold)),
                SizedBox(height: 30,),
              ],
            ): Container(),
          ],
        ),
      ),
    );
  }
}

Conclusion:

In the article, I have explained the How To Get Unique Device Details In Flutter of the basic structure in a flutter; you can modify this code according to your choice. This was a small introduction to Get Unique Device Details On User Interaction from my side, and it’s working using Flutter.

I hope this blog will provide you with sufficient information on Trying up the How To Get Unique Device Details In Flutter? in your flutter projects. We will show you what the Introduction is?. Make a demo program for working Device Details and show when the user tap on the raised button, the unique device Andriod/Ios information like device name, version, identifier, etc shown on your screen using the device_info package in your flutter applications. So please try it.

❤ ❤ Thanks for reading this article ❤❤

If I got something wrong? Let me know in the comments. I would love to improve.

Clap 👏 If this article helps you.

find the source code of the Flutter Device Details Demo:

flutter-devs/flutter_device_details_demo
A new Flutter application. This project is a starting point for a Flutter application. A few resources to get you…github.com

---

Feel free to connect with us:
And read more articles from FlutterDevs.com.

FlutterDevs team of Flutter developers to build high-quality and functionally-rich apps. Hire a flutter developer for your cross-platform Flutter mobile app project on an hourly or full-time basis as per your requirement! You can connect with us on Facebook, GitHub, Twitter, and LinkedIn for any flutter-related queries.

We welcome feedback and hope that you share what you’re working on using #FlutterDevs. We truly enjoy seeing how you use Flutter to build beautiful, interactive web experiences.

---