sticky_header_list
sticky_header_list copied to clipboard
Using StickyList.builder inside a NestedScrollView causes problems
The issue is that the wrong number of items get built. The headers scroll up at the wrong time. And then i get an out of range exception. I changed the StickyList to a standard Listview and the problems went away.
The StickyList.builder is in a StreamBuilder and this is in a TabBarView. The TabBarView is apart of a NestedScrollView. Here is an example of my code...
Widget build(BuildContext context) {
this.context = context;
return Container(
child: DefaultTabController(
length: 3,
child: NestedScrollView(
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
innerBoxIsScrolled = false;
return <Widget>[
SliverAppBar(
expandedHeight: 125.0,
floating: false,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
centerTitle: true,
title: Text("${widget.locationName} Schedule",
style: TextStyle(
color: Colors.white,
fontSize: 16.0,
)),
background: Image.asset(
"assets/member-benefits.jpg",
fit: BoxFit.cover,
color: Color(0xff3e4b60),
colorBlendMode: BlendMode.hardLight,
),
),
),
SliverPersistentHeader(
delegate: _SliverAppBarDelegate(
TabBar(
indicatorColor: Colors.black,
labelColor: Colors.white,
unselectedLabelColor: Colors.white30,
tabs: [
Tab(text: "BY DATE"),
Tab(text: "BY INSTRUCTOR"),
Tab(text: "BY CLASS"),
],
),
),
pinned: true,
)
];
},
body: TabBarView(
children: <Widget>[
StreamBuilder<QuerySnapshot>(
stream: Firestore.instance
.collection("schedule")
.document(widget.locationName.toLowerCase())
.collection("by_date")
.orderBy("day")
.orderBy("time")
.snapshots(),
builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
if (!snapshot.hasData) return Center(child: CircularProgressIndicator(),);
final int documentCount = snapshot.data.documents.length;
return Material(
child: StickyList.builder(
builder: (BuildContext context, int index) {
print(index);
final DocumentSnapshot doc = snapshot.data.documents[index];
final ListItem item = !doc.data.containsKey("className") ?
HeadingItem.fromSnapshot(doc) :
ScheduleItem.fromSnapshot(doc);
if (item is HeadingItem) {
HeaderRow header = HeaderRow(
child: Container(
color: Colors.blue,
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Text(
item.day.toString(),
style: TextStyle(color: Colors.white, fontSize: 18.0),
),
)
),
height: 40.0
);
return header;
} else if (item is ScheduleItem) {
RegularRow row = RegularRow(
height: 20.0,
child: ListTile(
leading: new CircleAvatar(
child: new Text(item.time.toString()),
radius: 27.0,
),
title: new Text(item.className),
subtitle: Text(item.leadBy)));
return row;
}
},
itemCount: documentCount,
),
);
},
),
Material(child: buildByDateTab()),
Material(child: buildByDateTab())
],
)),
),
);
}
I think i've boiled it down to it now working at all (using the builder or the constructor) inside a StreamBuilder