html5Canvas画图教程(10)—把面拆成线条模拟出圆角矩形_html5教程技巧

上一篇文章我讲了画矩形和圆形的方法，他们都有原生的canvas绘图函数可完成。而本文讲的圆角矩形则只有通过其他方法模拟出来。
一个正常的圆角矩形，我们先假设他四个角的圆角弧度一致——因为这样比较好画。我们动用把面拆成线条的能力，很容易就能发现圆角矩形其实是由4条钩子般的曲线组成。

提到钩子，如果你看过我介绍arcTo的文章，那么可能你一下就明白了这种图形就可以用arcTo画出来。
我讲arcTo的时候提过，arcTo有个特性就是，他的第2条切线延长也并不会对他画出的线条造成影响（在上文的最后部分），这也为我们画圆角矩形提供了方便，不用担心变形。
下面放出我在国外网站上发现的canvas画圆角矩形的方法，应该是效率最高的了。

查看更多关于html5Canvas画图教程(10)—把面拆成线条模拟出圆角矩形_html5教程技巧的详细内容...