如何在 Flutter 中使用 ListView 处理 TabBar？

Question

我花了几个小时才找到如何在滚动 listView 时更改选项卡的色调，直到 (x) item/header、

我开始学习 flutter 从 here

UI 看起来像：

我想知道如何处理 ListView 和 tabBar 以防万一我滚动直到 Flutter 很棒 51 tabBar指标应该向右改变，同样的事情应该与 tabBar 一起工作，当我按下 tabBar 索引 51 时 ListView 应该滚动到 Flutter 很棒 51,

任何人都可以指导我如何实现这一点？

Answer 1

你需要使用

TabController

_tabController.animateTo((index))

结合

ScrollController

final _position = ... // half or top depending on tab selection itemsize and count 
_scrollController.animateTo(_position,
        curve: Curves.linear, duration: Duration(milliseconds: 500));

如果您的列表项具有相同的高度，您可以依靠滚动的偏移量和位置来检测它何时达到一半。

Here is an implementation of the ScrollController that will aid you.

如何在 Flutter 中使用 ListView 处理 TabBar？

How to handle TabBar with ListView in Flutter?

listview

tabbar

dart

flutter