私は羽ばたきが初めてで、誰かがスクロールの仕組みを手伝ってくれるかどうか疑問に思っています。SliverAppBar
初めて試してみましたが、バー自体の動きで正しく機能しています。ただし、ListView.builder
sliverfillremaining 内に配置したウィジェットを作成する があり、リストの動きを検出していません。どんな助けでも大歓迎です。
return Scaffold(
body: CustomScrollView(
slivers: <Widget>[
SliverAppBar(
title: Row(
children: <Widget>[
Text('appName')],),
expandedHeight: 110,
floating: true,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
background: Container(
child: Padding(
padding: const EdgeInsets.all(20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Text('my text 1', style: TextStyle(
fontFamily: 'OpenSans',
),
softWrap: true,),
Text('my Text', style: TextStyle(
fontFamily: 'OpenSans',
),),],),),),),),
SliverFillRemaining(
hasScrollBody: true,
child: Container(
child: NoteList(
items: items,
),
),
)
],
),
ノートリスト
class NoteList extends StatelessWidget {
const NoteList({
@required this.items,
});
final List<Note> items;
Future _navigateToNote(BuildContext context, Note note) => Navigator.push(
context,
MaterialPageRoute(builder: (context) => NoteScreen(note)),
);
Widget _itemBuilder(BuildContext context, int position) {
final cardShape = const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(0)),
);
return Padding(
padding: const EdgeInsets.only(top:0, bottom: 0),
child: Card(
shape: cardShape,
child: InkWell(
onTap: () => _navigateToNote(context, items[position]),
customBorder: cardShape,
child: Padding(
padding: const EdgeInsets.all(2.0),
child: Column(
children: <Widget>[
ListTile(
title: Text('${items[position].theItem}',
),
),
],
),
),
),
),
);
}
@override
Widget build(BuildContext context) {
return Scrollbar(
child: ListView.builder(
itemCount: items.length,
padding: const EdgeInsets.only(left: 2, right: 2),
itemBuilder: _itemBuilder,
),
);
}
}