如何去掉Flutter中tabbarview的blue/grey滚动动画?
How to remove blue/grey scroll animation of tabbarview in Flutter?
当从一页滑动到另一页时,我有一个 TabBarview 出现在页面的最边上。
我不希望飞溅高光出现在两侧。
虽然 tabbarview 有物理特性并且当设置为 bouncingscrollphysics() 时这个形状不应该出现,就像在列表视图中出现的那样,但没有任何改变。
尝试了另一种解决方案:我用主题包装了 tabbarview,并将突出显示颜色和启动颜色更改为 colors.transparent,但这也不起作用。这是我的 TabBarview 的代码。
这是 ui,以及它的外观。
Theme(
data: new ThemeData(
splashColor: Colors.transparent,
highlightColor: Colors.transparent),
child: TabBarView(
physics: BouncingScrollPhysics(),
controller: _controller,
children: model.types.map((String type) {
List<Subscription> subssOfThisType =
model.historySubscription.where((Subscription sub) {
return sub.package.name == type;
}).toList();
final cards = subssOfThisType.map(
(s) {
return HistoryCard(
sub: s,
);
},
).toList();
return ListView(
physics: BouncingScrollPhysics(),
padding:
EdgeInsets.symmetric(horizontal: 14, vertical: 8),
children: cards ?? Container(),
);
}).toList(),
),
)
如果您不想对 TabBar 的原始代码进行一些重大更改,请使用以下包
https://pub.dev/packages/flutter_tab_bar_no_ripple
=== 对于您的用例 ===
为了简单起见...将物理更改为 BouncingScrollPhysics()
如果您不想要那种弹性效果,请检查下面的 link
将物理更改为 BouncingScrollPhysics()
你想试试 ScrollConfiguration 吗?
它工作正常。
body: ScrollConfiguration(
behavior: MyBehavior(),
child: const TabBarView(
children: [
TabPage(icon: Icons.directions_car),
TabPage(icon: Icons.directions_bike),
],
),
),
class MyBehavior extends ScrollBehavior {
@override
Widget buildViewportChrome(
BuildContext context, Widget child, AxisDirection axisDirection) {
return child;
}
}
当从一页滑动到另一页时,我有一个 TabBarview 出现在页面的最边上。 我不希望飞溅高光出现在两侧。
虽然 tabbarview 有物理特性并且当设置为 bouncingscrollphysics() 时这个形状不应该出现,就像在列表视图中出现的那样,但没有任何改变。
尝试了另一种解决方案:我用主题包装了 tabbarview,并将突出显示颜色和启动颜色更改为 colors.transparent,但这也不起作用。这是我的 TabBarview 的代码。 这是 ui,以及它的外观。
Theme(
data: new ThemeData(
splashColor: Colors.transparent,
highlightColor: Colors.transparent),
child: TabBarView(
physics: BouncingScrollPhysics(),
controller: _controller,
children: model.types.map((String type) {
List<Subscription> subssOfThisType =
model.historySubscription.where((Subscription sub) {
return sub.package.name == type;
}).toList();
final cards = subssOfThisType.map(
(s) {
return HistoryCard(
sub: s,
);
},
).toList();
return ListView(
physics: BouncingScrollPhysics(),
padding:
EdgeInsets.symmetric(horizontal: 14, vertical: 8),
children: cards ?? Container(),
);
}).toList(),
),
)
如果您不想对 TabBar 的原始代码进行一些重大更改,请使用以下包
https://pub.dev/packages/flutter_tab_bar_no_ripple
=== 对于您的用例 ===
为了简单起见...将物理更改为 BouncingScrollPhysics()
如果您不想要那种弹性效果,请检查下面的 link
将物理更改为 BouncingScrollPhysics()
你想试试 ScrollConfiguration 吗?
它工作正常。
body: ScrollConfiguration(
behavior: MyBehavior(),
child: const TabBarView(
children: [
TabPage(icon: Icons.directions_car),
TabPage(icon: Icons.directions_bike),
],
),
),
class MyBehavior extends ScrollBehavior {
@override
Widget buildViewportChrome(
BuildContext context, Widget child, AxisDirection axisDirection) {
return child;
}
}