Skottie
● layer的渲染顺序是,靠后的先渲染,有点像[0]是最外层。
● 当有effect时,effect的优先级最高。顺序依次是。effect>layers>assets
● assets内comp_0时,绘制的优先级同layer一直。从外向内看。[0]是最外层。
● 特效分为纹理特效和转场特效。
新增支持表达式的能力
表达式执行由sksl执行器完成。先编译sksl为二进制,再执行,常用数学公式均支持。
● 修改animator的插值器构造流程、执行流程。插值器。入参是t,输出是当前t下的value。
如果需要时间维度,则对t做重映射,比如无限循环播放对应的mapping公式为 frame = frame%35。
"ef"内是根据array的角标作为 kReds_Index。而不是"ty"字段。绑定value的地址到animator中。animator什么时候更新value呢?更新后何时通知重绘呢?onSync
依赖关系是啥呢?在涉及上。
● 问题是
○ 帧率是有谁主动触发的呢?上屏的vsync普通手机最高是60fps。animator的触发帧率控制是怎么实现的?
○ 有没有要重置的场景呢?有没有暂存的value。需要触发更新的? 推和拉
降低内存
能绘制到压缩纹理上么?不能
CompressedBackendAllocationTest这个是只绘制到压缩纹理上么?
CreateCompressedBackendTexture
这次压缩纹理作为backend么?onCreateCompressedBackendTexture
性能分析
C++性能分析工具
https://developer.android.com/topic/performance/tracing/custom-events
https://github.com/yse/easy_profiler#android 在上家公司用过这个分析c++性能,不过得自己编译
Lottie稳定性
普通lottie - 参数化lottie(参数化类型)—> 扩展新能力(text、effect、AE表达式)
从千人1面到千人千面到能力集更丰富的千人前面
引入三方
横向
降级
内存降级
CPU降级
稳定性降级
稳定性
兼容性Crash。比如Android7硬加速、不同厂商
必现Crash。
白屏或者绘制错误。
内存
OOM
泄漏
纵向
组件内部问题
接入组件和外部环境产生的问题
代码
时机
工具链
工具估算内存
隐式内存
矢量蒙版造成的内存
显式内存
image资源
投放配合离屏灰度
运行时动态降级
AEbodymovin和生成参数化json模板。还有生产端和消费端version不一致的问题。
json格式一致么?
lottie切skottie。新增扩展能力不可用。
内存问题
iOS内存、Android内存评估
GPU内存问题
和bitmap的size有关系。 可以关闭mipmap
surfaceview 在 textureview 内存上是否有差异。
fMipmapLevelControlSupport
问题
全屏氛围
GPU的 看下内存到底大在哪里?
多了将近1倍?是否可以关闭
Skottie在做验证
多端一致。android、ios、web
工具侧。
内存问题。TextureView
32 76
100
Skottie用于做转场动画可能存在的问题
lottie嵌套lottie遇到的问题
- 如果作为一层layer的话。 首先layer不能嵌套layer
- 如果要求内层layer无限循环播放呢?目前是不支持的。需要支持expression
- 内层layer相关单位和parent的关系?
a. 比如layer的size 和 position 。是用绝对位置还是用相对位置呢?如果是绝对位置的话,复用内层layer时,就要重新根据整体的size来调整position了。比如永远居中时? 是不是也要表达式来支持。 支持layout_centerInParent \ layout_centerVertical \ layout_alignParentBottom 等。
b. 比如 ip和op。 假如layer有自己的ip和op。嵌入不同的父layer时。ip和op要相对的调整。目前是否支持呢?
源码记录
markers的用途
motion blur params
过程
先构建
EffectBinder(jprops, abuilder, this)
.bind( kReds_Index, fCoeffs[0])
Animator依赖各个Effect(BlackAndWhiteAdapter)提供的 keyframe插值规则生成参数,onSeek触发更新value值。在什么是否走draw逻辑呢?
GPU上draw对应op。op对应shader + Pipeline。啥时候上屏呢?flush时才会遍历op并执行。执行过程中不会触发上屏么?swap时才触发上屏的。
由ui vsync驱动 刷新帧率。
Choreographer.getInstance().postFrameCallback(this); -> Choreographer.FrameCallback.doFrame(long frameTimeNanos) -> nDrawFrame -> render构建op列表 -> canvas.flush -> GrDirectContext::flush执行op列表 -> eglSwapBuffers -> updateTexture -> 去上屏。
● op是怎么执行的。
○ GPU op
○ CPU 也是op么
● skottie的effect是怎么执行的
○ 转场动画的原理。
○ 纹理动画的原理。
● 时间轴 + layer分布(每张照片一个layer) + 上下layer交错分布 + 交错区域为layer1的出场 和 layer2的入场转场动画 + 展示纹理动画。
相框、装饰widget、
本地的编辑器 可以用 Flow
支持的 After Effects 动画类型
https://www.premiumbeat.com/blog/create-solid-color-layer-in-after-effects/
译者注: Lottie 目前不支持的 AE 动效类型很多,例如常用的 3D 图层变换、几乎所有效果器[effects]、图层样式[layer styles]、叠加模式[blending mode]、渐变[gradient ramp/gradient fill...](好像正在加入支持,期待更新)、任意表达式[expressions]、径向擦除[radius wipe]等。。。
在用 AE 制作动画的时候一定要看清楚能否拆解为以下支持的类型。
预合成[Pre-composition]
关键帧插值[Keyframe Interpolation]
- 线性插值[Linear Interpolation]
- 贝塞尔曲线插值[Bezier Interpolation]
- 定格插值[Hold Interpolation]
- 漂浮穿梭时间[Rove Across Time]
- 空间贝塞尔曲线[Spatial Bezier]
固态层[Solids]
-
锚点变换[Transform Anchor Point]
-
图层的锚点才是它的本体
-
“锚点”属性指的是“锚点与图形的距离”,而不是锚点位置 。 是给内部看的。
-
“位置”属性指的是”锚点位置”,而不是图形位置。 是给外部看的。
-
在shape中锚点的含义 https://juliannakunstler.com/acgr_ae_solids.html
-
位置变换[Transform Position]
-
缩放变换[Transform Scale]
-
旋转变换[Transform Rotation]
-
不透明度变换[Transform Opacity]
-
transform包含了translate(平移)、scale(缩放)、rotate(旋转)、skew(倾斜)等几种
蒙版[Masks]
- 蒙版路径[Path]
- 蒙版不透明度[Opacity]
- 多蒙版混合模式(相加、相减、反转)[Multiple Masks (additive, subtractive, inverted)]
轨道遮罩[Track Mattes]
- Alpha 遮罩[Alpha Matte]
父级[Parenting]
- 多个父级[Multiple Parenting]
- 空对象[Nulls]
形状图层[Shape Layers]
-
矩形(所有属性)[Rectangle (All properties)]
-
在shape中锚点的含义 https://juliannakunstler.com/acgr_ae_solids.html
-
椭圆(所有属性)[Ellipse (All properties)]
-
多边星形(所有属性)[Polystar (All properties)]
-
多边形(所有属性。点个数必须为整数。)[Polygon (All properties. Integer point values only.)]
-
路径变换(所有属性)[Path (All properties)]
-
锚点变换[Anchor Point]
-
位置变换[Position]
-
缩放变换[Scale]
-
旋转变换[Rotation]
-
不透明度[Opacity]
-
形状组变换(锚点、位置、缩放……)[Group Transforms (Anchor point, position, scale etc)]
-
一个形状组可包含多个形状 [Multiple paths in one group]
-
合并路径(默认是关闭的,必须用enableMergePathsForKitKatAndAbove方法专门开启)[Merge paths (off by default and must be explicitly enabled with enableMergePathsForKitKatAndAbove)]
形状图层描边 [Stroke (shape layer)]
- 描边颜色[Stroke Color]
- 描边不透明度[Stroke Opacity]
- 描边宽度[Stroke Width]
- 描边端点[Line Cap]
- 虚线[Dashes]
形状图层填充[Fill (shape layer)]
- 填充颜色[Fill Color]
- 填充不透明度[Fill Opacity]
修剪路径[Trim Paths (shape layer)]
- 修剪路径开始[Trim Paths Start]
- 修剪路径结束[Trim Paths End]
- 修剪路径偏移[Trim Paths Offset]
网友评论