免费下载案例集|20+数字化领先企业人才培养实践经验 了解详情
写点什么

RTC Dev Meetup:Flutter 开发实战与前景展望(三)

  • 2019-11-30
  • 本文字数:1575 字

    阅读完需:约 5 分钟

RTC Dev Meetup:Flutter 开发实战与前景展望(三)

4、手势

Flutter 在手势中引入了竞技的概念, Down 事件在 Flutter 中尤为重要。



  • PointerDownEvent 是一切的起源,在 Down 事件中一般不会决出胜利者。

  • 在 MOVE 和 UP 的时候才竞争得到响应。

  • 以点击为例子: Down 时添加进去参与竞争, UP 的时候才决定谁胜利,胜利条件是:


I、 UP 的时候如果只有一个,那么就是它了。


II、 UP 的时候如果有多个,那么强制队列里第一个直接胜利。


  • 这里包含了有趣的点就是,都在 UP 的时候才响应,那么 Down 事件怎么先传递出去了?


FLutter 在这里做了一个 didExceedDeadline 机制 ,事实上在上面的 addPointer 的时候,会启动了一个定时器,默认 100 ms,如果超过指定时间没 UP ,那就先执行这个 didExceedDeadline 响应 Down 事件。


  • 那问题又来了,如果这时候队列里两个呢?


它们的 onTapDown 都会被触发,但是 onTap 只有一个获得。


  • 如果有两个滑动 ScrollView 嵌套呢?


举个简单的例子,两个 SingleChildScrollView 的嵌套时,在布局会经历:


performLayout -> applyContentDimensions -> applyNewDimensions -> context.setCanDrag(physics.shouldAcceptUserOffset(this));


只有 shouldAcceptUserOffset 为 ture 时,才会添加 VerticalDragGestureRecognizer 去处理手势。


而判断条件主要是 returnmath.max(0.0,child.size.height-size.height); ,也就是如果 child Scroll 的 height 小于父控件 Scroll 的时候,就会出现 child 不添加 VerticalDragGestureRecognizer 的情况,这时候根本就没有竞争了。

5、动画

Flutter 中的动画是怎么执行的呢?


我们先看一段代码,然后这段代码执行的效果如下图 2 所示。


那既然 Widget 都是一帧,那么动画肯定有 setState 的地方了。


首先这里有个地方可以看下,这时候 200 这个数值执行后是会报错的,因为白框内可见 Tween 中的 T 在这时候会出现既有 int 又有 double ,无法判断的问题,所以真实应该是 200.0 。




同时你发现没有,代码中 parent 的 Container 在 只有 100 的情况下,它的 child 可以正常的画 200,这是因为我们的 paint 没有跟着 RenerObjcet 的大小走, 所以一般情况下,整个屏幕都是我们的画版,Canvas 绘制与父控件大小可以没关系。


同时动画是通过 vsync 同步信号去触发的,就是我们 mixin 的 SingleTickerProviderStateMixin,它内部的 Ticker 会通过 SchedulerBinding 的 scheduleFrameCallback 同步信号触发重绘 。


动画后的控件的点击区域,和你的动画数据改变的是 paint 还是 layout 有关 。

6、状态管理

scope_model 、 flutter_redux、 fish_redux 、甚至还有有 dva_flutter 等等,可以看出状态管理在 flutter 中和前端十分相近。


这里简单说说 scope_model ,它只有一个文件,但是很巧妙,它利用的就是 AnimationBuilder 的特性。


如下图是使用代码,在前面我们知道,状态管理使用的是 InheritedWidget 实现共享的,而当我们对 Model 进行数据改变时,通过调用 notifyListeners 通知页面更新了。



这里的原理是什么呢?


  • 其实 scope_model 内部利用了 AnimationBuilder ,而 Model 实现了 Listenable 接口。

  • 当 Model 设置给了 AnimationBuilder 时, AnimationBuilder 会执行 addListener 添加监听,而监听方法里会执行 setState。

  • 所以我们改变 set 方法时调用 notifyListeners 就触发了 setState 去更新了,这样体现出了前面说的 FLutter 常见的开发模式。


三、混合开发

以 Android 的角度来说,从方便调试和解耦集成上,我们一般会以 aar 的形式集成混合开发,这里就会涉及到 gradle 打包的一个概念。


1、如下代码所示,在项目中进行 gradle 脚本修改,组件化开发模式,用 apk 开发,用 aar 提供集成,正常修改 gradle 代码即可快速打包。



那如果 Flutter 的项目插件带有本地代码呢?


如果开发过 ReactNative 的应该知道,在原生插件安装时会需要执行 react-nativelink ,而这时候会修改项目的 gradle 和 java 代码。


2019-11-30 16:53663

评论

发布
暂无评论
发现更多内容

2024 中国开发者调查报告出炉:通义灵码是开发者最常用的 AI 编码辅助工具

阿里云云效

阿里云 云原生 通义灵码

Python数据分析:数据可视化(Matplotlib、Seaborn)

我再BUG界嘎嘎乱杀

Python 编程 数据分析 后端 数据可视化

代理IP在跨境出海业务中的应用

IPIDEA全球HTTP

代理IP 跨境电商 出海

中大型集团数字化转型常用软件,电子签章领域契约锁领先行业

Geek_2a38d5

AI 机器人对家长培育孩子好性格有帮助吗?——数业智能心大陆给出答案

心大陆多智能体

育儿 智能体 AI大模型 心理健康 数字心理

云原生监控的未来:观测云与 Prometheus 的融合

可观测技术

Promethues 云原生监控

科大讯飞学习机c10s和p30怎么选

妙龙

科大讯飞 学习机

3D 粒子系统插件Trapcode Particular for Mac激活版

Mac相关知识分享

2024 中国开发者调查报告出炉:通义灵码是开发者最常用的 AI 编码辅助工具

阿里巴巴云原生

阿里云 云原生 通义灵码

五大联赛在即,能否用贝叶斯来预测足球比赛

Geek_a17c4b

AI 数据集 足球 贝叶斯算法

强大的工具箱软件Parallels Toolbox for mac激活版

Mac相关知识分享

DBeaver 24.1.4版本发布,原生支持GaussDB!

华为云开发者联盟

数据库 企业号 8 月 PK 榜 企业号2024年8月PK榜

淘宝商品描述API:深度解析HTML格式内容的策略与技巧

代码忍者

API 接口 API 测试

元宇宙Gamefi链游系统开发实现技术原理介绍

V\TG【ch3nguang】

元宇宙Gamefi链游系统开发

Python使用asyncio包实现异步编程方式

我再BUG界嘎嘎乱杀

Python 编程 后端 异步编程 开发语言

技术架构革新:观测云的 Agent 模型解析

可观测技术

架构设计 数据采集

跨部门协作:观测云在促进业务与技术团队合作中的作用

可观测技术

团队协作

百万级超长序列大模型训练如何加速,硬核解读MindSpeed方案

华为云开发者联盟

大模型 #人工智能 企业号 8 月 PK 榜 企业号2024年8月PK榜

实用的英语学习工具Eudic欧路词典 for Mac激活版

Mac相关知识分享

Mac软件 英语学习工具

Mac专用解压缩软件Keka for Mac

Mac相关知识分享

压缩软件

三维构建软件Rhino 8 for Mac 中文激活版

Mac相关知识分享

三维 Mac软件 软件下载

静态IP和动态IP哪个好?怎么选择?

Ogcloud

IP 静态IP 动态IP 海外原生IP 海外IP

GitHub星标68K!Python数据分析入门手册带你从数据获取到可视化

我再BUG界嘎嘎乱杀

Python 编程 数据分析 后端 开发语言

通义灵码:AI 研发趋势与效果提升实践丨SDCon 全球软件技术大会演讲全文整理

阿里云云效

阿里云 云原生 通义灵码

团队协作的秘密武器:2024年顶级7款工具

爱吃小舅的鱼

团队协作工具

IM即时通讯系统开发规则详细/案例设计/功能需求/源码步骤

V\TG【ch3nguang】

EZ先享官奔赴海外 见证马自达百年造车基因传承

Geek_2d6073

重塑精准营销新纪元:深度解析拍立淘API与用户画像构建的融合之道

代码忍者

API Explorer API 接口 API 测试

通义灵码:AI 研发趋势与效果提升实践丨SDCon 全球软件技术大会演讲全文整理

阿里巴巴云原生

阿里云 AI 云原生 通义灵码

观测云的自动化监控:CRD 资源与自动发现

可观测技术

自动化运维

业务流程的数字化转型:观测云的实践与挑战

可观测技术

业务监控

RTC Dev Meetup:Flutter 开发实战与前景展望(三)_文化 & 方法_声网_InfoQ精选文章