我正在尝试制作一个颤动的 UI,其中我正在使用 SliverAppBar(我提到这一点是因为我需要使用 CustomScrollView 或 NestedScrollView),现在在正文中,我要让前两个元素在到达时不滚动屏幕顶部,而底部列表。使用 CustomScrollView,它要么作为一个整体滚动,要么根本不滚动(包括 Appbar)。在 NestedScrollView 中,如果我使用 NeverScrollableScrollPhysics,则应用栏会滚动,而正文则不会。现在我可以让整个身体可滚动,或者我得到一个像素错误。请帮我。
我在下面添加了 NestedScrollView 代码。一旦条子栏消失,我需要将搜索栏和转到购物车容器固定在顶部。
NestedScrollView(
physics: NeverScrollableScrollPhysics(),
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return <Widget>[
SliverAppBar(
backgroundColor: Color(0xffececec),
shadowColor: Colors.transparent,
iconTheme: IconThemeData(color: Colors.black),
pinned: false,
centerTitle: true,
expandedHeight: 200.0,
floating: false,
forceElevated: innerBoxIsScrolled,
// snap: true,
flexibleSpace: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Container(
padding: EdgeInsets.only(top: 80),
child: Row(
children: [
banner(
image),
banner(
image),
banner(
image),
],
),
)),
actions: [
InkWell(
onTap: () {
Navigator.push(
context, MaterialPageRoute(builder: (_) => Cart()));
},
child: Icon(
Icons.shopping_cart,
color: Colors.black,
),
),
SizedBox(width: Units.width(context) * 0.03),
],
)
];
},
body: SingleChildScrollView(
physics: NeverScrollableScrollPhysics(),
child: Column(
children: [
Row(
children: [
Text('Search'),
Icon(
FontAwesomeIcons.search,
color: Colors.white,
),
],
),
Container(
height: Units.height(context) * 0.1,
width: Units.height(context) * 0.17,
child: Text(
"Go to cart",
style: TextStyle(
fontSize: Units.regularText(context) * 0.9,
fontWeight: FontWeight.bold),
),
),
ListView(
shrinkWrap: true,
physics: AlwaysScrollableScrollPhysics(),
children: [
Center(
child: Wrap(
children: [
lappyCard(context),
lappyCard(context),
lappyCard(context),
lappyCard(context),
lappyCard(context),
lappyCard(context),
lappyCard(context),
lappyCard(context),
lappyCard(context),
],
),
),
],
),
],
),
),
),