You are creating a flutter app and you need a device ID. How you can find the Id of your device? It’s simple. You can use the platform_device_id and device_info_plus for finding the id in a flutter.
Let’s get started
Example 1: Using platform_device_id Package
Here you will create an app where you have a “Get Id” button at the center of the page. And when you click on this button, your device id will be shown on the screen in green color.
Preview:
Step 1: Install package platform_device_id
flutter pub add platform_device_id
Step 2: Get the packages by running this command on your terminal.
flutter pub get
App Code:
import 'package:flutter/material.dart';
import 'package:platform_device_id/platform_device_id.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(primarySwatch: Colors.amber),
debugShowCheckedModeBanner: false,
home: const GetDeviceIdPage(),
);
}
}
class GetDeviceIdPage extends StatefulWidget {
const GetDeviceIdPage({Key? key}) : super(key: key);
@override
State<GetDeviceIdPage> createState() => _GetDeviceIdPageState();
}
class _GetDeviceIdPageState extends State<GetDeviceIdPage> {
String? _deviceId;
void _getDeviceId() async {
//Recieving device id in the result
String? result = await PlatformDeviceId.getDeviceId;
setState(() {
_deviceId = result;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
centerTitle: true,
title: const Text('codewithhussain.com'),
),
body: Padding(
padding: const EdgeInsets.all(20),
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'ID: ${_deviceId ?? 'Press Button'}',
style: const TextStyle(
fontSize: 30,
color: Colors.green,
),
textAlign: TextAlign.center,
),
ElevatedButton(onPressed: _getDeviceId, child: const Text('Get Id'))
],
)),
),
);
}
}
Example 2: Get Device Info using device_info_plus
In this app example, you will get more info about the device in which your flutter app is running.
Preview:
Step 1: Install device_info_plus
flutter pub add device_info_plus
Step 2: Get packages by running
flutter pub get
App Code:
import 'package:device_info_plus/device_info_plus.dart';
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(primarySwatch: Colors.amber),
debugShowCheckedModeBanner: false,
home: const GetDeviceIdPage(),
);
}
}
class GetDeviceIdPage extends StatefulWidget {
const GetDeviceIdPage({Key? key}) : super(key: key);
@override
State<GetDeviceIdPage> createState() => _GetDeviceIdPageState();
}
class _GetDeviceIdPageState extends State<GetDeviceIdPage> {
Map? _deviceInfo;
void _getDeviceInfo() async {
final deviceInfoPlugin = DeviceInfoPlugin();
final result = await deviceInfoPlugin.deviceInfo;
setState(() {
_deviceInfo = result.toMap();
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
centerTitle: true,
title: const Text('codewithhussain.com'),
),
body: (_deviceInfo != null)
? ListView(
padding: const EdgeInsets.all(16),
children: _deviceInfo!.entries
.map((e) => Wrap(
children: [
ListTile(
title: Text(
"${e.key} :",
style: const TextStyle(
fontSize: 18,
color: Colors.green,
fontWeight: FontWeight.bold,
),
),
),
const SizedBox(
width: 15,
),
Text(
e.value.toString(),
style: const TextStyle(
fontSize: 18,
),
)
],
))
.toList(),
)
: Center(
child: ElevatedButton(
onPressed: _getDeviceInfo,
child: const Text('Get Device Info'),
),
),
);
}
}
Conclusion:
You learn how you can find the device id in your flutter app. For that purpose, you learn about the platform_device_id and device_info_plus packages.
You can find the device id for every platform which is supported by flutter without needing any extra permission from the users.
You can also learn
Hope you like this flutter tutorial. Thanks!