2

我有一个 SliverAppBar(浮动:真,固定:假)。

我想实现用户必须在 SliverAppBar 开始压缩/向上滑动之前滚动 200 像素(或其他数量)。

4

1 回答 1

3

这里的问题pinned是不应该改变值。如果您在滚动 200 像素后尝试更改它,SliverAppBar则会突然缩小。

您可以通过运行以下代码来检查这一点:

class Buster extends StatefulWidget {
  @override
  _BusterState createState() => _BusterState();
}

class _BusterState extends State<Buster> {
  ScrollController controller;
  bool isAppBarPinned;

  @override
  void initState() {
    super.initState();
    controller = ScrollController()..addListener(onScroll);
    isAppBarPinned = true;
  }

  void onScroll() {
    if (controller.position.pixels > 200) {
      if (isAppBarPinned) {
        setState(() => isAppBarPinned = false);
      }
    } else {
      if (!isAppBarPinned) {
        setState(() => isAppBarPinned = true);
      }
    }
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        controller: controller,
        slivers: [
          SliverAppBar(
            title: Text('Buster'),
            floating: true,
            pinned: isAppBarPinned,
          ),
          SliverFixedExtentList(
            itemExtent: 150,
            delegate: SliverChildListDelegate(
              [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
                  .map((int index) => Center(child: Text('Item #$index')))
                  .toList(),
            ),
          )
        ],
      ),
    );
  }
}

因此,我认为您在这里获得的最佳选择是使用常规AppBar并使用.Transform

于 2019-05-27T15:31:03.907 回答