写项目时候遇到SliverAppBar顶部隐藏,有两种写法,

1,

2,

结果两种都可以实现,效果差不多,但是NestedScrollView的body中设置ScrollController(设置了会跟内部Controller冲突)来完成下拉刷新,增量加载,滚动到顶部。

https://github.com/fluttercandies/extended_nested_scroll_view/blob/master/README-ZH.md

这个网址里有多重解决办法,但是我都没用,我最后还是用了两个ScrollController来控制。一个是NestedScrollView的Controller

一个是listview的Controller,多个tabview里面的listview的Controller其实可以提出来成为一个。

_scrollConstruct.scrollController.addListener(() {
  var innerPos = _scrollConstruct.scrollController.position.pixels;
  var maxOuterPos = _nestedScrollViewController.position.maxScrollExtent;
  var currentOutPos = _nestedScrollViewController.position.pixels;

  if (innerPos >= 0 && currentOutPos < maxOuterPos) {
    _nestedScrollViewController.position.animateTo(innerPos + currentOutPos,
        curve: Curves.linear, duration: Duration(microseconds: 100));
  } else {
    var currenParentPos = innerPos + currentOutPos;
    _nestedScrollViewController.position
        .animateTo(currenParentPos, curve: Curves.linear, duration: Duration(microseconds: 100));
  }
});
_nestedScrollViewController.addListener(() {
  var currentOutPos = _nestedScrollViewController.position.pixels;
  if (currentOutPos <= 0) {
    _scrollConstruct.scrollController.position
        .animateTo(0, curve: Curves.linear, duration: Duration(microseconds: 100));
  }
});

之前的代码补充,listview的Controller如果有,就需要做滑动处理的联动,如果没有,就不需要,

有个第三方的expan_nestedScrollView,那个可以解决很多问题,SliverAppBar的bottom距离,滑动冲突,滑动联动效果。每个tabview的保持页面效果。例子里是在 StatefulWidget 使用,配合tabcontrol来使用,在 StatelessWidget 里也可以用,把key放对就行。

注意 :expan_nestedScrollView的 headerSliverBuilder 的高度必须大于0,不然tabview的高度就会出错误一直双倍高度。导致tabbarview嵌套listview 然后 listview高度不够双倍屏幕高不能滑动!不知道作者怎么写的,但是这个bug很坑爹。

 

sliverAppBar里面bottom加tabBar,有两种:

1:https://blog.csdn.net/yechaoa/article/details/90701321 是官方例子,但是繁琐,只是避免了滑动高度和屏幕适配横屏和高度

2:https://blog.csdn.net/u011272795/article/details/82740389  这个方便,但是写法太局限,可以自己写在steless里也一样好用。

sliverAppBar的tabBar报错  Controller's length  does not match the number of present in TabBar's tabs property.

就是因为没有按照这两种写法中的写。

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐