监听一个可下拉区域的滚动监听_Flutter 实现一个悬浮的效果

知乎视频www.zhihu.com

在原来的基础布局下修改

江景：Flutter 实现钉钉侧边栏zhuanlan.zhihu.com

修改 DTMessageScreen

使用 Stack 作为容器
且套 SingleChildScrollView ，监听 controller 滚动事件
再 Stack 容器中多添加一个DTMessageTopQuick，使用 Positioned 包裹
通过监听 controller 控制 AnimatedOpacity 透明度显示和隐藏

@overrideWidget build(BuildContext context) {return Scaffold(backgroundColor: Colors.white,appBar: buildAppBar(context),body: Stack(children: <Widget>[SingleChildScrollView(controller: _scrollController,child: Column(children: <Widget>[DTMessageSearchDecoration(),DTMessageTopQuick(),DTMessageTopMask(),DTMessageListView(),],),),Positioned(top: 0,left: 0,right: 0,child: AnimatedOpacity(opacity: topQuickOpacity,duration: Duration.zero,child:Container(color: Colors.white, child: DTMessageTopQuick())),),],),);}

添加滚动监听

ScrollController _scrollController;double topQuickOpacity = 0.0;@overridevoid initState() {_scrollController = ScrollController();_scrollController..addListener(() {int offset = _scrollController.offset.ceil();this.setState(() {topQuickOpacity = offset > kSize70 ? 1.0 : 0.0;});});super.initState();}

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/543350.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！