![](https://img-blog.csdnimg.cn/direct/b9cc32872afe45769d07aef8c40befa7.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
Flutter技术笔记
文章平均质量分 67
系统梳理Flutter相关知识点,尽量将复杂的技术转换为最通熟易懂的语言记录下来,可以将其视作Flutter学习的技术笔记。
猴叻鳢
海阔凭鱼跃,天高任鸟飞
展开
-
Flutter中动画的实现
动画三要素控制动画的三要素:Animation、Tween、和AnmaitionControllerAnimation: 产生的值的序列,有CurveAnimation等子类,, 可以将值赋值给Widget的宽高或其他属性,进而控制widget发生变化Tween:可以定义值的变化范围, 继承自,每个类都有begin和end两个属性,同时有CurveTween等子类,可以定义值在begin和end间的变化方式。原创 2024-03-08 09:48:01 · 1104 阅读 · 0 评论 -
Flutter性能优化
(1)图片等资源访问使用内存缓存及本地文件缓存。Flutter对GlobayKey组件有缓存,对构建复杂,并且复用率比较高的组件,合理使用GlobayKey可以提升性能。但需注意, 使用GlobayKey查找组件state是全局查找,有较大性能开销,查找不能滥用。原创 2024-03-06 10:58:28 · 1892 阅读 · 0 评论 -
Flutter图片内存占用过大问题
根据Image创建实例时调用的工厂方法的不同(Image.network或者Image.assetImage,使用ImageProvider的不同子类,如NetworkImage、AssetImage分别通过网络或本地获取图⽚字节数据(load)并进行解码,创建 ImageStream⽤于监听结果。Flutter内存占用较大,还可能是因为另外一种原因:Native侧和Flutter侧都使用大量相同的图片,图片在两种环境中均被加载到内存。), 以避免缓存过大的图片原图,造成不必要的内存及磁盘消耗。原创 2024-03-05 17:30:52 · 985 阅读 · 0 评论 -
Flutter App代码混淆
flutter build apk –obfuscate --split-debug-info 命令需要指定输出调试文件的位置,该命令会生成一个符号映射表。相关命令的其他信息,可以运行 flutter build apk -h 查看,如果不支持该命令,核实 Flutter 版本,执行 flutter upgrade 更新。Flutter 应用的混淆非常简单,只需要在构建 release 版应用时结合使用 --obfuscate 和 --split-debug-info 这两个参数即可。原创 2024-03-05 18:02:30 · 920 阅读 · 0 评论 -
Flutter整体框架
Flutter整体框架由三部分组成:Framework、Engine和Embedder。Framework是纯Dart语言实现的一个响应式框架,由许多抽象的层级组成。Framework最顶端是各种Widgets。包括我们经常用到的 Material 和 Cupertino两种风格的Widget以及下面的不带明确风格的Widgets。比如:UI/文本/图片/按钮等基础 Widgets。在 Widget 层下面,你会发现 Rendering 层。再往下是RenderObject。原创 2024-03-04 12:31:06 · 604 阅读 · 0 评论 -
Flutter的线程模型
GPU Task Runner运行的线程对应平台的子线程,并且和UI Task Runner运行在不同的线程上。而执行大量高CPU的运算类耗时任务,如耗时计算,编解码等,即便代码是异步执行,由于所有代码都运行在Root Isolate中,所以仍然会导致Root Isolate没法及时处理其他异步任务,从而导致UI卡顿。当运行到系统IO接口时,会将IO任务交给系统线程处理,并将异步任务加入到事件队列,然后Root Isolate回到事件循环,获取事件队列中的下一个任务进行处理。平台对线程的实现方案。原创 2024-03-04 11:08:39 · 635 阅读 · 0 评论 -
Dart中的事件队列与微任务
Future中的任务会加入下一轮的任务队列,then中的任务则是也会加入同样的任务队列。Future中的任务和then后的任务可以理解为同步任务,因此,若Future嵌套微任务,会优先执行then中的代码, 然后分别是微任务队列中的代码、事件队列中的代码。注意: 8先于7执行,因为已经调度到了当前队列中,8在6之后是立刻执行的,而7是异步执行的。注意: 9不是在10之后执行,因为9是在嵌套中下一层的队列中,因此需要等下一个消息循环才会执行。执行顺序为12,1,11,3,4,6,5,7,9,10,8,2。原创 2024-03-02 19:47:21 · 390 阅读 · 0 评论 -
Platformview在iOS与Android上的实现方式对比
具体做法是,重写PlatformViewWrapper的draw方法,通过surface.lockHardwareCanvas()获得canvas画板,然后 将native组件直接绘制到该画板上,换言之,上述过程将Native组件的canvas替换为TextureWidget的对应的canvas,进而实现Native组件在Flutter的显示。该方案优点是可以完整捕获Platformview上的点击、滑动等事件,但由于每添加一个Platformview,额外会在其上新增一个全屏的。通过textureId。原创 2024-03-04 09:39:56 · 876 阅读 · 0 评论 -
Flutter混合栈管理方案对比
flutter_thiro是哈喽单车团队提供的一个解决方案,其与flutter_boost的主要不同是,flutter_boost的导航切换都是由native侧驱动,每次页面切换native侧都会创建一新的页面放到导航栈中,而flutter_thrio在native之间及native和flutter之间的页面切换同样由native侧驱动,但flutter页面内部的切换由flutter自带的Navigator来管理,native侧导航栈不创建对应的页面容器。,并且由于pop出的页面就会销毁,原创 2024-03-03 17:49:03 · 1888 阅读 · 0 评论 -
Flutter异常上报及性能监控实现
页面PV监测核心是检测到页面栈的变化,以便统计出页面曝光次数。如果应用采用自定义导航框架,只需在导航框架正确位置添加埋点即可。若采用的是系统默认的导航框架,则可通过继承NavigatorObserver,捕获Navigator的didPush和didPop回调。在Flutter中,通常用FlutterError监测Flutter框架抛出的异常,用runZonedGuarded监测应用中用户代码异常。通常需要保留最近若干个FrameTiming的总耗时,计算其平均值,以消除不必要数据波动。原创 2024-03-02 09:22:42 · 983 阅读 · 0 评论 -
Flutter中Future和Stream关系
其类似于一个异步的 Iterable,不同的是,当你向 Iterable 获取下一个事件时它会立即给你,但是 Stream 则不会立即给你而是在它准备好时告诉你。一个Stream可以通过Stream.fromFuture方法将一个Future转换为Stream, 也可以通过Stream.fromFutures将多个Future添加到Stream中。,Future中的任务会加入下一轮事件循环,而Stream中的任务则是加入微任务队列。Future和Stream类是Dart异步编程的核心。原创 2024-03-01 16:57:56 · 731 阅读 · 0 评论 -
Flutter中的三棵树
当Widget发生变化时,对比Element tree上对应位置上新旧Widget是否一致,只有不一致时才会重建Element并重建并重新进行RenderObject实例化。即RenderObject Tree只需进行增量的重建即可,这就大大提升了渲染效率。,创建出renderObject,并关联到element.renderobject属性上,最后完成RenderObject Tree的创建。, 页面的更新,可以根据Element变化的内容,只修改对应的RenderObject Tree,即进行。原创 2024-03-01 17:45:11 · 664 阅读 · 0 评论 -
Flutter中Widget的生命周期
StatelessWidget创建后不能改变,StatefulWidget可以改变,但其实也是通过重建的方式进行改变,因此代价较大,要避免滥用,防止整个UI全部重建。:包含此 State 对象的 Widget 被移除之后调用,若此 Widget 被移除之后未被添加到其他 Widget 树结构中,则会继续调用 dispose 方法;:initState 调用之后调用,或者使用了 InheritedWidget 组件会被调用,其中 InheritedWidget 可用于Flutter 状态管理;原创 2024-03-01 17:17:21 · 765 阅读 · 0 评论