冬奥会正在如火如荼的进行，今年冬奥的吉祥物冰墩墩也是成了新网红，不知道你有没有抢到冰墩墩玩偶？没抢到也没关系，前端人前端魂，用canvas给自己画一个！

本篇文章是全部采用的<script setup>这种组合式API写法，相对于选项式来说，组合式API这种写法更加自由，具体可以参考Vue文档对两种方式的描述。

一、背景 1.1、控件效果 要实现的自定义控件效果大致如下，实现过程中用到了比较多的自定义View的API，觉得比较有代表性，就分享出来也当做学习总结 项目代码已上传github :https://g

1. 什么是 Tween Animation? 通过 Animation 对象在图像上执行一系列的变换而形成的动画。 2. Tween Animation 的作用是什么？ Tween Animation 的主要作用是在可视对象上执行一系列的变化操作。 举例来说，就是 Tween…

View树的绘图流程是由核心类：ViewRootImpl 来处理的，ViewRootImpl作为整个控件树的根部，它是控件树正常运作的动力所在，控件的测量、布局、绘制以及输入事件的派发处理都由ViewRootImpl触发。 主要有以下几类：View绘制相关、输入焦点等用户交互相…

又又一次说起贝塞尔曲线（英语：Bézier curve，维基百科详尽中文释义戳这里），我最近在尝试实现复杂的矢量图形动画，发现对贝塞尔曲线的理解馒头那么厚，是完全不能承受富有创意的创作的

说来话长，这一切都得从PhotoShop中的钢笔工具开始说起... 声明：本文不含复杂数学公式，学渣放心阅读吧😂(我仿佛看到了学渣们留下了激动的泪水) 背景 贝塞尔曲线(Bézier curve)是应用于二维图形应用程序的数学曲线，贝塞尔曲线基于多个点构成。它的应用非常广泛，…

GitHub 上好几个做这个效果的项目，但是很少有完全实现的，有的还有 Bug，于是花了 2 天实现了一下。 2. 分析 3. 核心实现 本质是事先产生一定数量叶子，这些叶子的漂动时的振幅、相位、旋转方向等等都是随机的，并且飘动是周期性地即叶子飘动到最左边时，又重新回到最右边。…

2019年了，然而2017计划写的东西还没开始😂，这次的拖延症来的比平常早却去的比平常晚。今天进行分享的是UI中的PathMeasure，同时记录自己在使用过程中的几个疑惑点。话不多说，开始进入正题。 创建一个空的PathMeasure，但是使用之前需要先调用 setPath…