flutter原理知识面试整理_flutter面试

1.在移动端，一次完整的事件分为：按下、移动、抬起。
当指针按下时，Flutter会对应用程序执行命中测试，以确定指针与屏幕接触的位置存在哪些组件，指针按下事件，被分发到由命中测试发现的最内部的组件，然后从那里开始，事件会在组件树中向上冒泡，这些事件会从最内部的组件被分发到组件树根的路径上的所有组件，只有通过命中测试的组件才能出发事件。Flutter中可以使用listener来监听原始触摸事件。

2.Flutter 事件处理流程主要分为3步，首先是命中测试，当手指按下时会触发pointerDownEvent事件，按照深度优先递归遍历当前渲染树（RenderObject ），对每一个渲染对象进行命中测试，当父组件中有多个子节点，则会使用倒序的方式对子节点进行遍历，进行命中测试，如果某个子节点判定通过，则不会再遍历之前的子节点，判断事件的触发位置是否位于组件的范围内，如果命中测试通过，则该渲染对象会被添加到一个hitTestResult列表中，当子节点通过了命中测试，那么它的父节点也会通过命中测试。命中测试完毕后，会遍历HitTestResult列表，调用每一个渲染对象的事件处理方法handleEvent来处理PinerDownEvent事件，当手指移动时，便会分发PointerMoveEvent事件。当手指抬起或事件取消时，会对相应的事件进行分发，分发完毕后会清空HitTestResult列表。如果父子组件都监听了同一事件，则子组件会比父组件先响应事件，这是因为命中测试过程是按照深度优先遍历规则遍历，所以子渲染对象比父渲染对象先加入HitTestResult列表，又因为在事件分发时是从前到后遍历HitTestResult列表，所以子组件会比父组件更先被调用handleEvent.

3.手势冲突：手势是对原始指针的语义化识别，手势冲突只是手势级别的，也就是说只会在组件树中的多个GestureDetector 之间才有冲突的场景，如果没有使用GestureDetector ，则不存在冲突，因为每一个节点都能收到事件，解决手势冲突有2种办法，第一种是使用listener组件监听原始指针事件，跳出手势识别规则，第二是通过自定义手势识别器来完成，重写acceptGesture方法。

4.Flutter 动画：
在flutter中，要完成一组动画主要涉及Animation、Curve、Controller、Tween这四个角色，它们一起配合来完成一个完整动画。Animation是一个抽象类，它本身和UI渲染没有任何关系，它主要的功能时保存动画的插值和状态，是一个在一段时间内依次生成一个区间之间值得类。，在动画的每一帧中，我们可以通过Animation对象的value属性获取动画的当前状态值。我们可以通过它的addListener方法添加帧监听器，也可以通过addStatusListener添加动画状态监听器，curve来描述动画过程，是匀速还是曲线等。Controller用于控制动画，包括启动，停止，时长等。Tween添加动画范围或数据类型的映射值。

5.Flutter 从上到下分为框架层、引擎层、嵌入层三层,
框架层基于dart实现，主要包含了，适配于IOS与Google平台得两种风格得widgets,文本、图片、按钮等widgets，渲染/动画/绘制/手势 等 Widgets，核心基础类/方法，主要指 Flutter 仓库下的 Flutter package，以及 sky_engine 仓库下的 io、async、ui（dart:ui 库提供了 Flutter 框架和引擎之间的接口） 等 package
引擎层基于C++实现，主要包含Skia 开源的二维图形库，提供了适用于多种软硬件平台的通用 API，Dart 主要包含 Dart Runtime，Garbage Collection（GC），如果是 Debug 模式的话，还包括 JIT （ Just In Time ）支持。Release 和 Profile 模式下，是 AOT（Ahead Of Time）编译成了原生的 arm 代码，并不存在 JIT 部分。
Text 文本渲染，其渲染层次如下：衍生自 minikin 的 libtxt 库（用于字体选择，分隔行）；HartBuzz 用于字形选择和成型；Skia 作为渲染 / GPU 后端，在 Android 和 Fuchsia 上使用 FreeType 渲染，在 iOS 上使用 CoreGraphics 来渲染字体。
嵌入层：
嵌入层，即把flutter嵌入到各个平台上去，这里做的主要工作包括渲染Surface 设置,线程设置，以及插件等。从这里可以看出，Flutter 的平台相关层很低，平台（如 iOS）只是提供一个画布，剩余的所有渲染相关的逻辑都在 Flutter 内部，这就使得它具有了很好的跨端一致性.
事实上flutter下的iOS/Android工程本质上依然是一个标准的iOS/Android的工程，flutter只是通过在构建阶段在原生的framework层添加壳，来将flutter代码嵌入到原生中去。
6.什么是UI框架，UI框架指，基于一个平台，在此平台上实现一个能快速开发GUI，图形用户接口的框架，这里得平台指IOS、android等，平台一般只会提供基础的绘制接口。所以UI框架解决的是，高效创建UI。

7.硬件绘图基本原理，提到原理，我们要从屏幕显示图像的基本原理谈起，显示器是由一个个物理显示单元组成，每一个单元可以成为一个物理像素点，每一个像素点可以发出多种颜色，显示器成像的原理就是在不同的物理像素点上显示不同的颜色，最终构成完整的图像。
为了更新显示画面，显示器是以固定的频率刷新，从GPU取数据，当一帧的图像绘制完毕后准备绘制下一帧时，显示器会发出一个垂直同步信号，60HZ的屏幕就会一秒内发出60次这样的信号，这个信号主要用于同步CPU、GPU和显示器的，CPU将计算好的显示内容提交给GPU，GPU渲染后放入帧缓冲区，然后视频控制器按照同步信号从帧缓冲区取帧数据传递给显示器显示。

8.操作系统绘制API的封装，由于最终的图形计算和绘制都是由相应的硬件来完成，直接操作硬件的指令通常会有操作系统屏蔽，操作系统会向上提供一些封装后的api供应用调用，直接使用系统提供的api比较复杂和低效，所以用于开发GUI程序的编程语言都会在操作系统之上再封装一层，将操作系统原生提供的api封装在编程框架和模型，然后定义一种简单的开发规则来开发GUI应用程序，这就是UI框架。

9.flutter框架，使用同一种编程语言开发，然后针对不同操作系统api抽象一个对上接口一致，对下适配不同操作系统的中间层，然后再打包编译时再使用相应的中间层代码，它提供了一套dart api ，然后再底层通过 openGL跨平台绘制库，内部会调用操作系统api，实现了一套代码跨多端，OpenGL是操作系统api的一个封装库，不需要像webView需要JS运行环境和CSS渲染器，所以不会有性能损失。

10.Element、BuildContext和RenderObject,在flutter 中会根据widget生成element,然后创建相应的renderobject并关联到element.renderobject属性上，最后再通过renderobject来完成布局排列和绘制。Element就是widget在UI树具体位置的一个实例化对象，大多数element 只有唯一的renderobject，但还有一些element会有多个子节点。最终所有element的renderobject构成一棵树，一般称之为渲染树，所以可以认定为flutter的UI系统包含