Flutter StreamController returning duplicate data - flutter

Question

I have my widgets setup in the following hierarchy to pass data between the two tabs
DataShareWidget
TabBarView
InputManagment
InfiniteListView
The DataShareWidget extends InheritedWidget and contains the ShareData class which has a StreamController to send and receive data.
but on the receive side (InfiniteListView tab) am getting duplicate data.
I've printing out the raw data from InputManagment before entering the stream, but there does not appear to be any duplicate data, so it must be something with the stream.
Here the relevant code from the main file
class ShareData {
final StreamController _streamController = StreamController.broadcast();
Stream get stream => _streamController.stream;
Sink get sink => _streamController.sink;
}
class DataShareWidget extends InheritedWidget {
final ShareData data;
DataShareWidget({
Key key,
#required Widget child,
}) :assert(child != null),
data = ShareData(),
super(key: key, child: child);
static ShareData of (BuildContext context) => (context.inheritFromWidgetOfExactType(DataShareWidget) as DataShareWidget).data;
#override
bool updateShouldNotify(DataShareWidget old) => false;
}
#override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("MyApp"),
bottom: TabBar(
tabs: Tabs,
controller: _tabController,
),
),
body: DataShareWidget(
child: TabBarView(
controller: _tabController,
children: [
InputManagment(),
InfiniteListView(),
],
),
),
);
}
In the data management file i have this line of code to add data
DataShareWidget.of(context).sink.add(inputData);
And here is the code for InfiniteListView
class _InfiniteScrollListViewState extends State<InfiniteScrollListView> with AutomaticKeepAliveClientMixin<InfiniteScrollListView>{
#override
bool get wantKeepAlive => true;
ScrollController _scrollController = ScrollController();
#override
void dispose() {
_scrollController.dispose();
super.dispose();
}
var _listViewData = new List();
_dataFormat(data){
var time = DateFormat('kk:mm:ss').format(DateTime.now());
var timeStampedData = time.toString() + "| " + data;
setState(() {_listViewData.add(timeStampedData); });
}
#override
Widget build(BuildContext context) {
DataShareWidget.of(context).stream.listen((data) => _dataFormat(data));
return ListView.builder(
itemCount: _listViewData.length,
controller: _scrollController,
itemBuilder: (context, index) {
return ListTile(
title: AutoSizeText(_listViewData[index], maxLines: 2),
dense: true,
);
},
);
}
}
EDIT: As per #jamesdlin suggestion i've refactored the code using StreamBuilder, and that appears to have solved the issue, here is the updated code below.
_dataFormat(data){
var time = DateFormat('kk:mm:ss').format(DateTime.now());
var timeStampedData = time.toString() + "| " + data;
_listViewData.add(timeStampedData);
}
#override
Widget build(BuildContext context) {
//_scrollToBottom();
return StreamBuilder(
stream: DataShareWidget.of(context).stream,
builder: (BuildContext context, AsyncSnapshot snapshot){
if(snapshot.hasError){ return Text(snapshot.error);}
if(snapshot.hasData){
_dataFormat(snapshot.data);
return ListView.builder(
itemCount: _listViewData.length,
controller: _scrollController,
itemBuilder: (context, index) {
return ListTile(
title: AutoSizeText(_listViewData[index], maxLines: 2),
dense: true,
);
},
);
}
}
);

Answer 1

You call listen on the Stream every time _InfiniteScrollListViewState.build is called. That will result in your callback being invoked multiple times. You should listen to the Stream only once.
You also perhaps should consider using a StreamBuilder widget instead.