在学习flutter的过程中,遇到了几个对我来说难度有点大的问题,比如swiper、弹出菜单(含子菜单)等。所幸都一一实现了。
swiper的实现相对比较简单,其实就相当于是两个模块:1、pagination 2、实际滚动内容
1的话其实相对简单,只是一个listview.generate就完事了,不过因为我们中间用了连接字符串,所以当屏幕大小可变时,这个连接字符串的长度就要可控。所以我用了 '--' * 100,然后限制maxLine=1,overflow =clip,就处理完了
2、最早没有采用滚动的时候,是使用了图片切换,这时候无论怎么做动画效果都没用,比如AnimatedContainer,无效;AnimatedController也没用。毕竟只是换了一个图片地址,容器大小都没变。所以最后还是尝试采用了SingleChildScrollView,然后复杂的就是做联动了。
做联动经历了3个小阶段
a. 点击pagination,采用_controller.animateTo,这样还有动画跳转,跳转到指定page页面。
b. 滑动图片时的手势操作,这个相对比较简单,我用了genstureDetector,只判断了横向的手指更新和滑动结束。更新的时候,只计算 delta.dx,即横向移动的距离,负值则页数减1,正值加1,这样一页页的跳转就完成了。
c.最复杂的就来了:因为我用的是macos的代码,前面是鼠标手势,如果用触摸板,那么刚才的手势就完全无效了,而且触摸板滚动的距离非常长可能一下子会有5~6页,整个下午就卡在这里。
第一次尝试,是用_controller.addListener(),确实可以看到 _controller.offset在移动,但addListener只能看到数值在变化,却无法判断停下来。
第二次尝试,是用_controller.position.isScrollingNotifier.addListener,这时候可以判断 !_controller.position.isScrollingNotifier.value,如果无值代表停下来。刚开始还OK,但如果一更新代码,再滚动,立即 报错,说_controller.positions.isNotEmpty 不正常。而且这个listener,是要放在:WidgetsBinding.instance?.addPostFrameCallback中的。所以暂时放弃
至此,全部完成。做个笔记~~~
出现标题的错误的原因,极大的可能是,页面中有多个ScrollView的组件,如:ListView,SingleChildScrollView,CustomScrollView,有同样的滚动方向,但是又没有ScrollController。
这时候只要在除了第一个出现的scrollview外的scrollview中,加入:primary:false,即可
参考:The provided ScrollController is currently attached to more than one ScrollPosition · Issue #93862 · flutter/flutter (github.com)
我在遇到这个问题的情况就是:
1、页面中有弹出菜单和子菜单,高度超过了1屏
2、点击子菜单出现详情的时候,也需要滚屏(部分内容)
因此,相当于一个页面出现了3个ScrollView,在没有加primary:false前,只要子菜单一弹出,就开始报错。在子菜单中加入:primary:false后,不再出错,但点击子菜单显示详情的时候,又出现了这个错误。
将子菜单和详情对应的scrollview中都加入primary:false后,问题 解决。
在使用flutter的http库请求API时,发现返回的数据均为乱码,例如这样:ä¸æµ·å¸é¿å®åºé¿å®è·¯1189å·æ¥ç¦å£«å¹¿åºä¸åº401-402
原来使用的是:json.decode(response.body),看来不能直接对字符串进行处理。所以还是安稳的改用:json.decode(utf8.decode(response.bodyBytes))
至此问题解决。
如题。实在买不到酒喝了,,把20年买的这两瓶酒也干掉了。心碎
以后也买不到了。所幸,它进了我的肠胃,也算是有一个好归宿了。。。
Flutter默认的APP是直接包含状态栏的,当然如果你使用Scaffold,并且设置了appBar,那就不用纠结,他能够管理沉浸式的顶部。
如果由自己控制,会发现statusBar,被APP的主要内容压着,所以必须要整体高度去掉statusBar(电池条)的高度
1、data:ui的方法:MediaQueryData.fromWindow(window).padding.top ,这个要import data:ui
2、context方法: MediaQuery.of(context).padding.top
方法2会有个小问题,如果你使用了SafeArea来进行包含项目,并设置top:true,你获取到的 top 就是 EdgeInsets.zero。即为0,看了下源码才发现,SafeArea其实就是Padding,根据你设置的参数设置好Padding后。同时remove了原来的padding。所以导致获取到的值就是0了。。。。因此使用方法2的时候。要先将top值存为全局变量才OK。