这是我个人的项目结构，仅供参考。有些与官方的 example 不太一样。例如官方 todoList 的 demo 中是把 connector 与 state 写在一块的，我这里将 connector 单独抽出了一个文件。 里面定义了 homePage 页面，HomePageCo…

相信你已经掌握了 Flutter 中绘制基础图形的操作，本篇将会讲解 Canvas 的变换操作。 在开始了解 Canvas 的变换操作时，先看看 Canvas 的 save()、saveLayer() 和 restore()。 在进行变换操作时，你经常会需要用到它们。 save…

绘制图片。 ⚠️ 需要注意的是，Offset 被用来设置图片的 左上角 相对于绘制区域的 左上角 的偏移量。 你从上面的效果图中也能看到它的作用。 该绘制函数，可以把图片上的一个矩形部分，以填充至满的形式绘制到另一个矩形中。 看个例子也许就清晰了。 在这个例子中，将图片的左上角…

接着上一篇 《Flutter：成为Canvas绘制大师(一)》，本篇继续讲解 Canvas 中的常用绘制操作。 绘制圆形。 🌰 e.g.: 🖼 效果： image 设置空心效果 paint..style=PaintingStyle.stroke 。 🖼 效果： image…

插值器的作用主要是为动画提供每一帧的数值，通过将该数值设置给相应的视图（Widget）元素，从而实现动画效果。 Tween：线性插值器，能够自由设置起始值和结束值。 Curve：非线性插值器，默认情况下，起始值为 0.0，结束值为 1.0。 一个 Tween 插值器通过调用 a…

本篇会介绍一些 Flutter 中 Canvas 的常用绘制操作。 上图是 Canvas 绘制区域内的坐标系。 原点在左上角，水平向右为 x 轴正方向，垂直向下为 y 轴正方向。 绘制线段。 线段的宽度通过 Paint.strokeWidth 属性可以设置线段的宽度。 绘制一系…