Working with Bluetooth and NFC Capabilities in Flutter

Flutter has become a go-to framework for developing cross-platform applications due to its versatility, performance, and rich set of features. Incorporating device capabilities such as Bluetooth and Near Field Communication (NFC) can greatly enhance the user experience and functionality of Flutter apps. This blog post provides a detailed guide on how to work with Bluetooth and NFC capabilities in Flutter.

Why Use Bluetooth and NFC in Flutter?

• Bluetooth: Allows your app to communicate with other Bluetooth-enabled devices, enabling functionalities such as data transfer, audio streaming, and device control.
• NFC: Enables short-range wireless communication between devices, facilitating contactless payments, data exchange, and quick authentication processes.

Prerequisites

Before diving into the implementation, ensure you have the following:

• Flutter SDK installed and configured
• Android Studio or Xcode for platform-specific configurations
• Basic knowledge of Dart and Flutter

Working with Bluetooth in Flutter

Step 1: Add Dependencies

To work with Bluetooth in Flutter, you’ll need to add the flutter_blue_plus package to your pubspec.yaml file. This package provides comprehensive Bluetooth functionality for Flutter apps.

dependencies:
  flutter_blue_plus: ^1.16.0

Run flutter pub get to install the dependencies.

Step 2: Configure Platform-Specific Settings

Android Configuration

In your AndroidManifest.xml file (located in android/app/src/main), add the necessary permissions:

Also, ensure that your build.gradle file (android/app/build.gradle) has the correct minSdkVersion:

android {
    defaultConfig {
        minSdkVersion 21 // Bluetooth requires at least API level 21
    }
}

iOS Configuration

In your Info.plist file (located in ios/Runner), add the necessary descriptions for Bluetooth usage:

NSBluetoothAlwaysUsageDescription
This app needs Bluetooth to connect to devices.
NSBluetoothPeripheralUsageDescription
This app needs Bluetooth to connect to peripherals.

Step 3: Implement Bluetooth Functionality

Here’s how to implement basic Bluetooth functionalities in Flutter:

Initialize Bluetooth

import 'package:flutter_blue_plus/flutter_blue_plus.dart';

class BluetoothService {
  final FlutterBluePlus flutterBlue = FlutterBluePlus.instance;

  Future initBluetooth() async {
    if (await flutterBlue.isAvailable == false) {
      print("Bluetooth is not available on this device");
      return;
    }
    if (Platform.isAndroid) {
      await flutterBlue.turnOn(); // Android-specific turn-on
    }
  }
}

Scan for Bluetooth Devices

  Future scanForDevices() async {
    flutterBlue.scan(timeout: const Duration(seconds: 4)).listen((scanResult) {
      print('Found device: ${scanResult.device.name} (${scanResult.device.id})');
    }, onDone: () {
      print('Scan complete');
    });
  }

Connect to a Bluetooth Device

  Future connectToDevice(BluetoothDevice device) async {
    try {
      await device.connect();
      print('Connected to ${device.name}');
    } catch (e) {
      if (e is FlutterBluePlusException && e.code == "already_connected") {
        print("Device already connected");
      } else {
        print('Failed to connect: $e');
      }
    }
  }

Discover Services and Characteristics

  Future discoverServices(BluetoothDevice device) async {
    List services = await device.discoverServices();
    services.forEach((service) {
      print('Service UUID: ${service.uuid}');
      service.characteristics.forEach((characteristic) {
        print('  Characteristic UUID: ${characteristic.uuid}');
      });
    });
  }

Read and Write Characteristics

  Future readCharacteristic(BluetoothCharacteristic characteristic) async {
    List value = await characteristic.read();
    print('Characteristic value: $value');
  }

  Future writeCharacteristic(BluetoothCharacteristic characteristic, List data) async {
    await characteristic.write(data, withoutResponse: true);
    print('Wrote value to characteristic');
  }

Example Usage in Flutter UI

import 'package:flutter/material.dart';

class BluetoothExample extends StatefulWidget {
  @override
  _BluetoothExampleState createState() => _BluetoothExampleState();
}

class _BluetoothExampleState extends State {
  final BluetoothService bluetoothService = BluetoothService();
  List scanResults = [];

  @override
  void initState() {
    super.initState();
    bluetoothService.initBluetooth();
  }

  void startScan() async {
    scanResults.clear();
    bluetoothService.flutterBlue.scanResults.listen((results) {
      setState(() {
        scanResults = results;
      });
    });
    await bluetoothService.scanForDevices();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Bluetooth Example'),
      ),
      body: ListView.builder(
        itemCount: scanResults.length,
        itemBuilder: (context, index) {
          final result = scanResults[index];
          return ListTile(
            title: Text(result.device.name ?? 'Unknown Device'),
            subtitle: Text(result.device.id.toString()),
            onTap: () async {
              await bluetoothService.connectToDevice(result.device);
              await bluetoothService.discoverServices(result.device);
            },
          );
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: startScan,
        tooltip: 'Scan',
        child: Icon(Icons.bluetooth_searching),
      ),
    );
  }
}

Working with NFC in Flutter

Step 1: Add Dependencies

To work with NFC in Flutter, use the flutter_nfc_kit package. Add it to your pubspec.yaml file:

dependencies:
  flutter_nfc_kit: ^2.2.0

Run flutter pub get to install the dependencies.

Step 2: Configure Platform-Specific Settings

Android Configuration

In your AndroidManifest.xml file, add the necessary permissions and features:

Create a file named nfc_tech_filter.xml in the android/app/src/main/res/xml directory:

    
        android.nfc.tech.IsoDep
        android.nfc.tech.NfcA
        android.nfc.tech.NfcB
        android.nfc.tech.NfcF
        android.nfc.tech.NfcV
    

iOS Configuration

In your Info.plist file, add the NFC usage description:

NFCReaderUsageDescription
This app uses NFC to read NFC tags.

Step 3: Implement NFC Functionality

Here’s how to implement basic NFC functionalities in Flutter:

Check NFC Availability

import 'package:flutter_nfc_kit/flutter_nfc_kit.dart';

Future checkNFCAvailability() async {
  bool isAvailable = false;
  try {
    isAvailable = await FlutterNfcKit.isAvailable();
    print('NFC is available: $isAvailable');
  } catch (e) {
    print('Error checking NFC availability: $e');
  }
  return isAvailable;
}

Read NFC Tag

Future readNFCTag() async {
  try {
    NFCTag tag = await FlutterNfcKit.readNfc(
      alertMessage: "Scan your NFC tag",
    );
    print('NFC Tag: ${tag.id}');
    return tag;
  } catch (e) {
    print('Error reading NFC tag: $e');
    return null;
  }
}

Write Data to NFC Tag

Future writeDataToTag(String text) async {
  try {
    await FlutterNfcKit.writeNdefRecords([
      NDEFRecord.createText(text),
    ]);
    print('Data written to NFC tag');
  } catch (e) {
    print('Error writing to NFC tag: $e');
  }
}

Example Usage in Flutter UI

import 'package:flutter/material.dart';

class NFCExample extends StatefulWidget {
  @override
  _NFCExampleState createState() => _NFCExampleState();
}

class _NFCExampleState extends State {
  String _nfcData = 'No NFC data yet.';

  Future _readNFC() async {
    if (await checkNFCAvailability()) {
      final tag = await readNFCTag();
      if (tag != null) {
        setState(() {
          _nfcData = tag.toString();
        });
      }
    } else {
      setState(() {
        _nfcData = 'NFC is not available on this device.';
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('NFC Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              _nfcData,
              style: TextStyle(fontSize: 16),
            ),
            ElevatedButton(
              onPressed: _readNFC,
              child: Text('Read NFC Tag'),
            ),
          ],
        ),
      ),
    );
  }
}

Conclusion

Integrating Bluetooth and NFC capabilities into your Flutter applications can significantly enhance their functionality and user experience. This comprehensive guide provides step-by-step instructions, code samples, and best practices to effectively work with these technologies in Flutter. By leveraging these features, you can create innovative and engaging mobile applications that interact with the physical world seamlessly.