用 Flutter 的 Canvas 画点风趣的图形

源码 · 2024-9-17 21:57:56

简介

上一篇我们先容了使用 Flutter 的 Canvas 绘制根本图形的示例，简单的示例没什么好玩的，本日这一篇我们来点风趣的，我们会完成如下图形的绘制：

发现数学重复之美：使用等边三角形组合成彩虹伞面。
绘制彩虹。
绘制评分用的五角星。

通过这一篇，我们可以知道自界说形状绘制的根本原理，然后可以在这个底子上绘制你自己想要绘制的图形。
等边三角形构建重复之美

起首我们来绘制等边三角形，着实上一篇我们也有绘制等边三角形，只是那是将三个顶点手动盘算出来的，这一篇我们封装一个绘制等边三角形的通用方法。老例子，先界说方法的输入参数，如下所示：

canvas：Canvas 画布
color：绘制颜色
startVertex：三角形的第一个顶点位置，这里我们其他边都是相对这个点旋转的
length：边长
startAngle：第一条边相对程度方向旋转的夹角，如许我们可以改变夹角来更改三角形的绘制位置。
clockwise：顺时针绘制，如果是顺时针，则绘制的偏移夹角往顺时针方向开始，否则逆时针。
filled：是否添补图形。

用 Flutter 的 Canvas 画点风趣的图形

所属分类: 问答交流

新帖推荐: 30日

推荐作品