Flutter进阶—实现动画效果(六)

Flutter进阶—实现动画效果(六),第1张

概述在上一篇文章中,我们之前对BarChart.lerp的定义并不是高效的,我们正在创建的Bar实例,仅作为Bar.lerp的参数给出,并且针对动画参数t的每个值重复出现。每秒60帧,这意味着可能很多Bar实例被送到垃圾收集器,即使是相对较短的动画。 我们可以采用以下三种解决方案: Bar实例可以通过在Bar类中仅创建一次而不是每次调用collapsed来重复使用,但这种方法不适合我们的应用程序。 重

在上一篇文章中,我们之前对barChart.lerp的定义并不是高效的,我们正在创建的bar实例,仅作为bar.lerp的参数给出,并且针对动画参数t的每个值重复出现。每秒60帧,这意味着可能很多bar实例被送到垃圾收集器,即使是相对较短的动画。

我们可以采用以下三种解决方案:

bar实例可以通过在bar类中仅创建一次而不是每次调用collapsed来重复使用,但这种方法不适合我们的应用程序。

重用可以通过barChartTween来处理,通过使其构造函数创建一个列表_tween的barTween实例,在创建补间条形图时使用(i) => _tweens[i].lerp(t)。这种方法破坏了使用静态方法lerp的惯例,静态barChart.lerp中没有涉及到任何对象,用于在动画持续时间内存储补间列表。相反,barChartTween对象完全适合这一点。

假设bar.lerp中有合适的条件逻辑,可以使用null来表示折叠条,这种方法是非常高效的,但是需要注意避免引用或误解null。null常用在Flutter SDK中,其中静态方法lerp会将null视为动画终点,通常将其解释为某种不可见元素,比如完全透明的颜色或零尺寸的图形元素。在我们的代码中,lerpDouble将null视为零,除非两个动画结束点都为null。

综合考虑之下,我们使用最后一种解决方案,首先我们需要更新barChart的部分代码。

class barChart {  // ...  static barChart lerp(barChart begin,barChart end,double t) {    final barCount = max(begin.bars.length,end.bars.length);    final bars = new List.generate(      barCount,(i) => bar.lerp(begin._barOrNull(i),end._barOrNull(i),t)    );    return new barChart(bars);  }  // ...}

然后我们还需要更新一下bar的条件逻辑。

class bar {  bar(this.x,this.wIDth,this.height,this.color);  final double x;  final double wIDth;  final double height;  final color color;  static bar lerp(bar begin,bar end,double t) {    if(begin == null && end == null)      return null;    return new bar(        lerpDouble((begin??end).x,(end??begin).x,t),// ?:变量可以为null        lerpDouble(begin?.wIDth,end?.wIDth,lerpDouble(begin?.height,end?.height,color.lerp((begin??end).color,(end??begin).color,t)    );  }}

现在我们的应用程序里,如何将使用折叠的条形作为不可见元素的判断,写在bar.lerp的条件逻辑中,实现我们想要的高效率。换一个角度来看,不知道大家有没有发现,现在代码的可维护性已经不如上一个版本了。这就是为什么之前选择看起来效率较低的解决方案。在性能与可维护性之间选择,需要通过衡量之后再作出决定。

未完待续~~~

总结

以上是内存溢出为你收集整理的Flutter进阶—实现动画效果(六)全部内容,希望文章能够帮你解决Flutter进阶—实现动画效果(六)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1002626.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-22
下一篇 2022-05-22

发表评论

登录后才能评论

评论列表(0条)

保存