canvas绘制圆角矩形

1、需求：需要用画布画一个消息气泡

2、思路：用ctx.arcTo画圆角，填充，封装成方法方便调用

3、解决

            function roundRect(x, y, w, h, r) {
                if (w < 2 * r) {
                    r = w / 2;
                }
                if (h < 2 * r) {
                    r = h / 2;
                }
                ctx.beginPath();
                ctx.fillStyle = "#fff";
                ctx.strokeStyle = "#fff";
                ctx.moveTo(x + r, y);
                ctx.arcTo(x + w, y, x + w, y + h, r);
                ctx.arcTo(x + w, y + h, x, y + h, r);
                ctx.arcTo(x, y + h, x, y, r);
                ctx.arcTo(x, y, x + w, y, r);
                ctx.stroke();
                ctx.fill();
                ctx.closePath();
                ctx.beginPath();
            }