[BUG] Jumpy header inside CustomScrollView with center key #67
Description
When using StickyHeader inside a CustomScrollView with center key, the header immediately before the center header month jumps around; all the other header months have no problems. A plug and play ready example is found below. If there is an easy way to fix the problem, it would be much appreciated. I have tried countless other options...I am really surprised the sticky header is not included with the flutter CustomScrollView widgets.
import 'package:flutter/material.dart';
import 'package:sticky_headers/sticky_headers.dart';
Map _months = {
1:'January',
2:'February',
3:'March',
4:'April',
5:'May',
6:'June',
7:'July',
8:'August',
9:'September',
10:'October',
11:'November',
12:'December',
};
abstract class BasePage extends StatefulWidget {
BasePage({Key? key}) : super(key: key);
}
abstract class BaseState<Page extends BasePage> extends State<Page> {
String screenName();
}
class CalendarPage extends BasePage {
CalendarPage({Key? key}) : super(key: key);
@override
_CalendarPageState createState() => _CalendarPageState();
}
class _CalendarPageState extends BaseState<CalendarPage>{
_CalendarPageState();
Key centerKey = ValueKey<String>('center');
var date = DateTime.now();
Widget monthBuilder (BuildContext context, int plusMinus){
int count = (date.month - 13) * -1;
if(plusMinus==-1){count=date.month-1;}
return SliverList(
key: plusMinus==1 ? centerKey:null,
delegate: SliverChildBuilderDelegate(
(BuildContext context, int index) {
int month=date.month+index;
if(plusMinus==-1){month=date.month-1+(-1*index);}
return StickyHeader(
header: Container(
color: Colors.brown,
padding: EdgeInsets.symmetric(vertical: 12.0),
alignment: Alignment.center,
child: Text('${_months[month]}',
style: Theme.of(context).textTheme.headline2,
),
),
content: ListView.builder(
shrinkWrap: true,
itemCount: DateTime(date.year,month+1,0).day,//check last day of month for days,
itemBuilder: (context, int index) {
return Column(children: [
Divider(),
TextButton( onPressed: () { },
child: Text('Data'),),
]);
},
),
);
},
childCount: count,
)
);
}
@override
String screenName() => "Calendar ${date.year}";
@override
Widget build(BuildContext context) {
return CustomScrollView(
center: centerKey,
slivers: [
monthBuilder(context, -1),
monthBuilder(context, 1),
],
);
}
}