dos

Public/static/js/common.js

@@ -158,20 +158,25 @@ function createPoster() {
         headimg.src = window.getImageUrl + '?url=' + encodeURI(user_header_url);
         headimg.onload = function () {
             // posterCtx.drawImage(headimg, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52));
-            circleImg(posterCtx, headimg, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), 10);
+            drawRoundRect(posterCtx, 10, designPxToRealPx(canvasArr[resultType - 1][5]), designPxToRealPx(canvasArr[resultType - 1][4]), designPxToRealPx(52), designPxToRealPx(52), headimg);
         }
     }
 }
 
-function circleImg(ctx, img, x, y, r) {
-    ctx.save();
-    var d = 2 * r;
-    var cx = x + r;
-    var cy = y + r;
-    ctx.arc(cx, cy, r, 0, 2 * Math.PI);
-    ctx.clip();
-    ctx.drawImage(img, x, y, d, d);
-    ctx.restore();
+function drawRoundRect(ctx, r, x, y, w, h, img) {
+    ctx.save()
+    if (w < 2 * r) r = w / 2
+    if (h < 2 * r) r = h / 2
+    ctx.beginPath()
+    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.closePath();
+    ctx.clip()
+    ctx.drawImage(img, x, y, w, h)
+    ctx.restore() // 返回上一状态
 }
 
 function submitAnswer() {