canvas画圆角矩形

2019-03-10  本文已影响0人  yuanlu954

创建一个画圆角矩形的函数

    // 画圆角矩形
    function roundedRect(ctx, x, y, width, height, radius) {
        ctx.strokeStyle = "#fffbff";
        ctx.beginPath();
        ctx.moveTo(x, y + radius);
        ctx.lineTo(x, y + height - radius);
        ctx.quadraticCurveTo(x, y + height, x + radius, y + height);
        ctx.lineTo(x + width - radius, y + height);
        ctx.quadraticCurveTo(x + width, y + height, x + width, y + height - radius);
        ctx.lineTo(x + width, y + radius);
        ctx.quadraticCurveTo(x + width, y, x + width - radius, y);
        ctx.lineTo(x + radius, y);
        ctx.quadraticCurveTo(x, y, x, y + radius);
        ctx.stroke();
    }

上一篇下一篇

猜你喜欢

热点阅读