【问题标题】:SliverAppBar flexibleSpace shouldn't show in scroll back upSliverAppBar flexibleSpace 不应该在滚动备份中显示
【发布时间】:2021-02-05 01:29:30
【问题描述】:

我在 SliverAppBar 中使用灵活空间,浮动:真,固定:假,捕捉:真:当我向上滚动时。它显示 AppBar 和 flexibleSpace 空间https://flutter.github.io/assets-for-api-docs/assets/material/app_bar_floating_snap.mp4。但我想要的是当用户滚动底部时,它应该隐藏应用栏和灵活空间,当用户向上滚动时,它应该只显示 appBar。直到滚动到达页面的第一页,它也应该显示flexibleSpace。

【问题讨论】:

  • SliverAppBar 具有固定的、有限的功能,如果您想要一些更复杂的东西,请改用SliverPersistentHeader

标签: flutter dart flutter-sliver sliverappbar


【解决方案1】:

据我所知,SilverAppBar 中没有您想要的便利设置。

这可能不是最好的解决方案。但它适用于某些情况:

  1. 在SliverAppBar()中设置floating: true,pinned: false(默认为false)

  2. 使用滚动位置控制expandedHeight

.

ScrollController _scrollController;
bool _top;
double _expandH;
double _collapseH;

@override
void initState() {
  _collapseH = 50;
  _expandH = 150;
  _top = false;
  _scrollController = ScrollController()..addListener(() {
    if(_scrollController.offset == 0 && !_top) {
      setState(() {
        _top = true;
        _scrollController.position.correctPixels(_expandH-_collapseH);
      });
    }else if(_top && _scrollController.offset > _expandH-_collapseH) {
      setState(() {
        _top = false;
        _scrollController.position.correctPixels(0);
      });
    }
  });
  super.initState();
}

...

CustomScrollView(
  controller: _scrollController,
  slivers: [
    SliverAppBar(
      floating: true,
      // pinned: false,
      expandedHeight:_top ? _expandH: _collapseH,
      ...

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-03-13
    • 1970-01-01
    • 2019-05-26
    • 2020-11-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多