Connect to Bluetooth devices with StreamProvider and Flutter Reactive BLE Part 2
Apr, 08 2022
This is the next article in the series about how to combine Flutter Provider with Reactive BLE for Bluetooth devices.
The previous article discussed how to scan and connect to Bluetooth devices using a Consumer widget.
Let’s work on interacting with the device after we’ve connected to it. We are looking to do things such as: read, write, and subscribe to our peripheral’s characteristics.
I’ll be assuming your code is up to date with the previous post. Take a look at this branch if you want to start fresh.
Consumer Widget with Reactive BLE Connection State
Let’s take a look at what happens after we tap the ListTile, connecting to the device we’re observing. It should be around line 62, the onTap call back.
Add a route builder to navigate to a new screen so we can interact with our device.
Create a new file in the
lib/src/ui directory named
device_interactor_screen.dart. Put the following code in.
Then, update the onTap callback with a Navigator.push call so that we can get to our new screen.
In our device_interactor_screen.dart we’ll need to add some imports so we can observe the connection state of our device. Up top add the following:
Next, in the Scaffold widget, let’s replace our empty container with a Consumer2 widget from the Provider package. We’ll then check the connection states and conditionally return a Text widget, like so:
For now we’re just observing the connection state. Let’s subscribe to a characteristic from our peripheral device.
Consumer Widget with Reactive BLE Device Interactor
Underneath our DeviceInteractorScreen widget, let’s add a new stateful widget in the same file.
There’s a lot to unpack here. We are building a column that contains a few main components. Our ‘connected’ Text widget is still the first thing.
Next, we have a row containing an ElevatedButton which will subscribe to our characteristic.
This button checks the nullable
subscriptionStream we defined at the top of the widget. If it is empty (i.e. we haven’t subscribed yet) provide the
onTap callback. If it is NOT empty (we’re listening to our characteristic), then just
null out the button.
onTap callback which subscribes to the characteristic uses the
deviceInteractor that we passed the widget.
deviceInteractor has a method
subscribeToCharacteristic. We pass that method a
QualifiedCharacteristic and we assign the result to our nullable
subscriptionStream and call for a rebuild with
In that same Row we have a disconnect button which just navigates back to the
Navigator.pop is called, the following code in the
onTap callback executes which terminates the connection and resumes scanning:
Finally, we check if the
subscriptionStream is not null and return our
StreamBuilder widget. Here we just output the characteristic data into a Text widget. This is the meat of the program and is where most of the utility of Bluetooth comes in.
And that’s it, that’s how you subscribe to a Bluetooth characteristic with Flutter Reactive BLE. Check out the Github repo for this project.