【问题标题】:SliverAppBar and Listview with controllerSliverAppBar 和 Listview 与控制器
【发布时间】:2018-03-30 17:47:52
【问题描述】:

我试图在NestedScrollView 中添加一个ListView 以使SliverAppBar 折叠。但是,如果我将控制器添加到 ListView,它将停止工作(AppBar 不会崩溃)。这是一个例子,左边的ListView 不影响SliverAppBar,但右边的ListView 会。

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  ScrollController scrollController = new ScrollController();
  List<String> entries = ["a", "b", "c", "d", "e", "a", "b", "c", "d", "e"];

  @override
  Widget build(BuildContext context) {
    return new DefaultTabController(
      length: 2,
      child: new Scaffold(
        body: new NestedScrollView(
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            return <Widget>[
              new SliverAppBar(
                  title: new Text("My app"),
                  pinned: true,
                  expandedHeight: 150.0,
                  floating: true,
                  forceElevated: innerBoxIsScrolled,
                  bottom: new TabBar(
                    tabs: <Tab>[
                      new Tab(text: "FIRST"),
                      new Tab(text: "SECOND"),
                    ],
                  )),
            ];
          },
          body: new TabBarView(
            children: <Widget>[
              new ListView.builder(
                itemCount: entries.length,
                controller: scrollController,
                itemExtent: 60.0,
                itemBuilder: (buildContext, index) {
                  return new Text(entries[index]);
                },
              ),
              new ListView.builder(
                itemCount: entries.length,
                itemExtent: 60.0,
                itemBuilder: (buildContext, index) {
                  return new Text(entries[index]);
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}

您知道是否可以将控制器附加到ListView 并仍然通知NestedScrollView

【问题讨论】:

  • 它工作正常,您的滚动焦点仅在提供控制器后转移到孩子身上,尝试在触摸 FIRST 选项卡时滚动以了解我的意思。你为什么不提供控制器为父级独占呢??
  • 哦,你是对的,所以基本上如果我有一个控制器,它需要附加到NestedScrollView而不是ListView。如果我真的想将控制器附加到列表视图而不是滚动视图怎么办?不知道有没有可能?
  • 你想做什么?

标签: dart flutter


【解决方案1】:

如果您使用NestedScrollView,您选择让它管理每个子Scrollable 的滚动位置,就好像它都是一个统一的可滚动。没有办法用控制器驱动单个Scrollable 孩子的位置;这样做会很有挑战性,因为它可能会使NestedScrollView 陷入混乱状态。不过,你也不是完全不走运:

  • 你可以给NestedScrollView一个控制器。
  • 如果您只想在嵌套滚动视图中有滚动事件时收到有关当前滚动位置的通知或更新,您可以将Scrollable 包裹在NotificationListener 中以侦听ScrollNotification
  • 如果您想让子 Scrollable“重置”到零初始滚动位置,您可以更改其 key 以消除其状态。

【讨论】:

  • 是的,根据@aziza 的回答,我将控制器移到了 NestedScrollView
  • 是的,我正在回答您的后续问题。我已经编辑了我的答案以提及这一点。
猜你喜欢
  • 1970-01-01
  • 2021-09-01
  • 2018-10-30
  • 2012-11-01
  • 1970-01-01
  • 2021-09-29
  • 1970-01-01
  • 2019-05-11
  • 1970-01-01
相关资源
最近更新 更多