[Initial Postion][1]
[Scrolling from SliverList side][2]
[Scrolling from SliverAppBar side][3]
class ProductScreen extends StatelessWidget {
static const routeName = "/product-screen";
@override
Widget build(BuildContext context) {
final _subCategory = Provider.of<SubCategoryProvider>(
context,
listen: false,
);
final _mediaQuery = MediaQuery.of(context);
return Scaffold(
body: SafeArea(
bottom: true,
top: true,
left: true,
right: true,
child: CustomScrollView(
slivers: <Widget>[
SliverAppBar(
expandedHeight: 200.0,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
title: Text("${_subCategory.currentSubCategoryName()}"),
background: Container(
margin: const EdgeInsets.only(
top: 4,
bottom: 50.0,
),
child: Image.asset(
'asset/images/grocery.jpeg',
),
),
),
),
SliverList(
delegate: SliverChildListDelegate(
[
Column(
children: <Widget>[
Container(
height: _mediaQuery.size.height - kToolbarHeight,
color: Color.fromARGB(0xff, 0xff, 0xcd, 0x3c),
child: ListView.builder(
physics: BouncingScrollPhysics(),
itemCount: _subCategory.differentProductCount(),
itemBuilder: (ctx, pdIndex) {
return Column(
children: <Widget>[
Container(
height: 30.0,
margin:
const EdgeInsets.symmetric(vertical: 5.0),
decoration: BoxDecoration(
border: Border.all(
width: 1.0,
color: Colors.black,
),
borderRadius: BorderRadius.circular(20.0),
),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: <Widget>[
Padding(
padding:
const EdgeInsets.only(left: 8.0),
child: Text(
"${_subCategory.currentProductName(pdIndex)}",
style: TextStyle(
fontSize: 18.0,
fontWeight: FontWeight.bold,
),
),
),
Icon(Icons.arrow_drop_down, size: 30.0),
],
),
),
Container(
height: 270.0 *
_subCategory
.differentCompanyCount(pdIndex),
child: ListView.builder(
physics: ClampingScrollPhysics(),
itemCount: _subCategory
.differentCompanyCount(pdIndex),
itemBuilder: (ctx, cyIndex) {
return Column(
children: <Widget>[
Container(
height: 250.0,
margin: const EdgeInsets.only(
bottom: 20.0),
color: cyIndex.isEven
? Colors.green
: Colors.pink),
],
);
},
)),
],
);
},
),
),
],
),
],
),
),
],
),
),
);
}
}
Sliver AppBar には別のスクロールがあり、SliverList には独自のスクロールがあります。
sliver appbar からスクロールしようとすると、両方のスクロールのみが行われますが、sliver リストからスクロールすると、sliver リストのみがスクロールされ、sliver appbar の高さが完全に拡張されます。
内部スクロールを削除するために物理演算を設定しようとしましたが、それでも2つの異なるスクロールがあります