Nestedscrollview 每隔一个标签滚动一次答案

【问题标题】：Nestedscrollview scroll every other tabsNestedscrollview 每隔一个标签滚动一次
【发布时间】：2021-12-02 08:10:52
【问题描述】：

我在我的应用程序中使用了具有多个选项卡的 Nestedscrollview，

现在的问题是：每当我在其中一个选项卡上向下或向上滚动时，其他选项卡也会向下或向上滚动，有没有办法避免这种行为？

谢谢

这是我的代码

return Scaffold(
  body: DefaultTabController(
    length: 5,
    child: NestedScrollView(
      headerSliverBuilder: (context, value) {
        return [
          SliverAppBar(
            floating: true,
            snap: true,
            pinned: true,
            title: Text(
              'MyApp',
              style: GoogleFonts.cookie(
                textStyle: TextStyle(
                  fontSize: 35.0,
                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                ),
              ),
            ),
            actions: <Widget>[
              Search(),
              IconButton(
                icon: Icon(Icons.home_rounded),
                iconSize: 25,
                onPressed: () {
                  Navigator.of(context).pushNamed(FeedScreen.routeName);
                },
                color: Colors.white,
              ),
            ],
            backgroundColor: Theme.of(context).colorScheme.secondary,
            bottom: TabBar(
              labelColor: Colors.amber,
              labelStyle: TextStyle(
                fontSize: 17.0,
                fontWeight: FontWeight.bold,
              ),
              
              isScrollable: true,
              tabs: myTabs,
            ),
          ),
        ];
      },
      body: TabBarView(
        children: [
          
          EducationScreen(),
          FamilleScreen(),
          SportsScreen(),
          InfosScreen(),
          PolitiqueScreen(),
        ],
      ),
    ),
  ),
);

【问题讨论】：

你能包含你的代码-sn-p吗？
我按照你的要求添加了我的代码 sn-p @YeasinSheikh

标签： flutter tabs nestedscrollview

【解决方案1】：

NestedScrollView 是孩子，TabBarView 在它下面。意味着每个孩子都受到相同的NestedScrollView 的影响，这就是为什么您在每个选项卡上都获得相同的滚动位置，您需要在TabBarView 的children 上应用可滚动功能。

您可以简单地关注这个小部件。

return DefaultTabController(
      length: 5,
      child: Scaffold(
        appBar: AppBar(
          title: Text(
            'MyApp',
            style: GoogleFonts.cookie(
              textStyle: TextStyle(
                fontSize: 35.0,
                fontWeight: FontWeight.bold,
                color: Colors.white,
              ),
            ),
          ),
          actions: <Widget>[
            IconButton(
              icon: Icon(Icons.home_rounded),
              iconSize: 25,
              onPressed: () {},
              color: Colors.white,
            ),
          ],
          backgroundColor: Theme.of(context).colorScheme.secondary,
          bottom: TabBar(
            labelColor: Colors.amber,
            labelStyle: TextStyle(
              fontSize: 17.0,
              fontWeight: FontWeight.bold,
            ),
            isScrollable: true,
            tabs: List.generate(5, (index) => Text("tab $index")),
          ),
        ),
        body: TabBarView(
          children: [
            ...List.generate(
              5,
              (index) => SingleChildScrollView( // you can choose `CustomScrollView` for better 
                child: Container(
                  color: index.isEven ? Colors.green : Colors.cyanAccent,
                  child: Column(
                    children: [
                      ...List.generate(
                          44,
                          (y) => Container(
                                height: 100,
                                child: Text("tab $index item $y"),
                              ))
                    ],
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

【讨论】：