请查看:https://im.ge/i/gif.1sFufF
我正在尝试禁用FlexibleSpaceBar标题的收缩效果
这是代码:
return Scaffold(
backgroundColor: Colors.white,
body: DefaultTabController(
length: 3,
child: NestedScrollView(
//physics: const BouncingScrollPhysics(),
controller: _scrollController,
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return <Widget>[
SliverAppBar(
elevation: 0,
backgroundColor: Colors.white,
expandedHeight: maxExtent,
centerTitle: false,
leading: addLeadingIcon(),
title: _isSliverAppBarExpanded
? Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'BMW i8',
style: TextStyle(color: _textColor),
),
Text(
'BMW i8',
style: TextStyle(color: _textColor, fontSize: 12),
),
],
)
: null,
floating: true,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
centerTitle: true,
titlePadding: EdgeInsets.zero,
background: Image.network(
"https://images.pexels.com/photos/396547/pexels-photo-396547.jpeg?auto=compress&cs=tinysrgb&h=350",
fit: BoxFit.cover,
),
title: !_isSliverAppBarExpanded ? _floatingCard() : null,
),
),
SliverPersistentHeader(
delegate: _SliverAppBarDelegate(
TabBar(
padding: EdgeInsets.symmetric(horizontal: 20),
labelColor: Colors.black87,
unselectedLabelColor: Colors.grey,
labelPadding: EdgeInsets.zero,
tabs: [
Tab(text: "Overview"),
Tab(text: "Photos"),
Tab(text: "Review"),
],
),
),
pinned: true,
),
];
},
body: Center(
child: Text("Sample text"),
),
),
),
);
}
_floatingCard() {
return Stack(
children: [
Align(
alignment: Alignment(0, 1.2),
child: Container(
height: 115,
color: Colors.white,
),
),
Align(
alignment: Alignment(0, 0.85),
child: Container(
width: MediaQuery.of(context).size.width * 0.6,
height: 115,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
blurRadius: 2,
offset: Offset(0, 3),
),
],
),
child: Padding(
padding: const EdgeInsets.all(10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Some car",
style: TextStyle(color: Colors.black),
),
Row(
children: [
Icon(Icons.star),
Text(
"4.7",
style: TextStyle(color: Colors.black),
)
],
)
],
),
Padding(
padding: const EdgeInsets.only(bottom: 10.0),
child: Text(
"Some seat, some bags",
style: TextStyle(color: Colors.black, fontSize: 10),
),
),
Row(
children: [
Expanded(
child: _item(isLastItem: false),
),
Expanded(
child: _item(isLastItem: false),
),
Expanded(
child: _item(isLastItem: true),
),
],
)
],
),
),
),
),
],
);
}
我尝试过 FittedBox 解决方案(防止 SliverAppBar 标题在 Flutter 中收缩时换行),但没有成功。
有没有人能解决这个问题?
谢谢!!!
您可以在FlexibleSpaceBar中使用“expandedTitleScale: 1”