How does Flutter get the unique code of the device

[external chain picture transfer failed. The source station may have anti-theft chain mechanism. It is recommended to save the picture and upload it directly (img-g36rsinr-1620689701971)( https://ducafecat.tech/2021/05/11/translation/how-to-get-unique-device-details-in-flutter/2021-05-11-06-16-24.png )]

Old iron remember to forward, brother old fellow will show more Flutter good text ~ ~ ~

ducafecat, a wechat fluent training group

original text

https://medium.com/flutterdevs/how-to-get-unique-device-details-in-flutter-ced2dbe5f8e5

Said brother cat

Getting the device id is what every APP should do. For example, you need to access the unique user statistics.

preface

[the external chain image transfer fails. The source station may have an anti-theft chain mechanism. It is recommended to save the image and upload it directly (img-jsn0zylc-1620689701973)( https://ducafecat.tech/2021/05/11/translation/how-to-get-unique-device-details-in-flutter/2021-05-11-06-16-41.png )]

code

https://github.com/flutter-devs/flutter_device_details_demo

reference resources

https://pub.dev/packages/device_info

text

Generally speaking, making a mobile application is an extremely incredible and testing task. There are many frameworks available that provide excellent highlights for creating mobile applications. In order to create a framework for mobile applications based on Java / objective and Android, Kotlin provides a framework.

Then, we need two unique languages and structures to create applications for both operating systems. Today, in order to break this complex structure, several frameworks have been proposed to help desktop applications use both operating systems at the same time. Such frameworks are called cross platform development tools.

In this blog, we will explore how to get unique device details We will implement a demo program and get unique device details for Android and IOS using device information packages in your Flutter application.

brief introduction

The application that obtains the current equipment data in fluent. How to use device_info plugin provides unique device details for Android and IOS. At this point, when we talk about the details of a unique device locally, we have settings Secure. ANDROID_ ID gets a unique device detail.

https://pub.dev/packages/device_info

demonstration

[the external chain picture transfer fails. The source station may have an anti-theft chain mechanism. It is recommended to save the picture and upload it directly (IMG astrjrxo-1620689701974)( https://ducafecat.tech/2021/05/11/translation/how-to-get-unique-device-details-in-flutter/2021-05-11-06-23-41.png )]

This demo video shows how to get the details of a unique device Flutter. It shows how device details will work using device information packages in your fluent application. It will display when the user clicks the trigger button and the unique device Android / IOS information displayed on the screen, such as device name, version, identifier, etc. It will be displayed on your device.

implementation

Step 1: add dependencies

Add dependencies to the pubspec(yaml file.

dependencies:
  flutter:
    sdk: flutter
  device_info: ^0.4.0+4

Step 2: Import

import 'package:device_info/device_info.dart';

Step 3: run the fluent package in the root directory of the application.

code implementation

How to implement the code in dart file:

Create a new dart file named device in the lib folder_ detail_ demo. dart.

First, we will create a user interface. In the main part, we will add a central widget. Internally, we will add a column widget. In this widget, we will add a mainAxisAlignmnet as the center. It's children's property, add RaisedButton(). In this button, we will add fill, color and OnPressed functions. Its sub attribute, we will the 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 should get the output of the screen, just like the screenshot below.

[the external chain picture transfer fails. The source station may have an anti-theft chain mechanism. It is recommended to save the picture and upload it directly (IMG fafrorrz4-1620689701975)( https://ducafecat.tech/2021/05/11/translation/how-to-get-unique-device-details-in-flutter/2021-05-11-06-28-26.png )]

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_ Internally, we will add a final deviceinfoplgin equal to the new deviceinfoplgin(). We will add the try {} method and import dart:io for the platform.

import 'dart:io';

If the platform is Android, the build is equal to the information of deviceInfoPlugin for Android. Add the setState() method. In this method, we add up all the strings to build. If the platform is Ios, the build version is equal to the deviceInfoPlugin of Ios information. Add the setState() method. In this method, we add up all the strings to 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 the on the pressed letter to the raised button_ deviceDetails()

onPressed: (){
  _deviceDetails();
},

We will add that the device version, name and identifier are not empty, and then display the Column widget. In this widget, we will add all three texts, such as device name, device version and device identifier, which will be displayed on your device. Otherwise, an empty container is displayed.

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 clicks the button, then all three data will be displayed on your device. When we run the application, we should get the output of the screen, just like the screenshot below.

[external chain picture transfer failed. The source station may have anti-theft chain mechanism. It is recommended to save the picture and upload it directly (img-ggc1pijr-1620689701976)( https://ducafecat.tech/2021/05/11/translation/how-to-get-unique-device-details-in-flutter/2021-05-11-06-32-01.png )]

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(),
          ],
        ),
      ),
    );
  }
}

summary

In this article, I explained how to get the unique device details and the basic structure of Flutter. You can modify this code according to your choice. This is a small introduction to user interaction to obtain unique device details. From my side, it works using fluent.

https://ducafecat.tech/

https://github.com/ducafecat

Past period

Open Source

GetX Quick Start

https://github.com/ducafecat/getx_quick_start

News client

https://github.com/ducafecat/flutter_learn_news

Translation of strapi manual

https://getstrapi.cn

Wechat discussion group ducafecat

Series collection

translation

https://ducafecat.tech/categories/%E8%AF%91%E6%96%87/

Fundamentals of Dart programming language

https://space.bilibili.com/404904528/channel/detail?cid=111585

Introduction to Flutter zero Foundation

https://space.bilibili.com/404904528/channel/detail?cid=123470

Actual combat of Flutter starts from scratch news client

https://space.bilibili.com/404904528/channel/detail?cid=106755

Fluent component development

https://space.bilibili.com/404904528/channel/detail?cid=144262

Flutter Bloc

https://space.bilibili.com/404904528/channel/detail?cid=177519

Flutter Getx4

https://space.bilibili.com/404904528/channel/detail?cid=177514

Docker Yapi

https://space.bilibili.com/404904528/channel/detail?cid=130578

Keywords: Flutter

Added by Chris16962 on Thu, 10 Feb 2022 17:23:49 +0200

Programming VIP