\u6587\u7ae0\u4e3b\u8981\u4ecb\u7ecd\u4e86\u8be6\u89e3\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u2014\u2014\u81ea\u5b9a\u4e49\u5706\u5f62\uff0c\u5177\u6709\u4e00\u5b9a\u7684\u53c2\u8003\u4ef7\u503c\uff0c\u5b9e\u73b0\u601d\u8def\uff0c\u5148\u7ed8\u5236\u5e95\u5c42\u7684\u7070\u8272\u5706\u5708\u80cc\u666f\uff0c\u518d\u7ed8\u5236\u4e0a\u5c42\u7684\u84dd\u8272\u8fdb\u5ea6\u6761\u3002<\/p>\n
\u4ee3\u7801\uff1a<\/p>\n
Page({\r\n data: {},\r\n onLoad: function (options) {\r\n \/\/ \u9875\u9762\u521d\u59cb\u5316 options\u4e3a\u9875\u9762\u8df3\u8f6c\u6240\u5e26\u6765\u7684\u53c2\u6570\r\n },\r\n onReady: function () {\r\n \r\n \/\/ \u9875\u9762\u6e32\u67d3\u5b8c\u6210\r\n var cxt_arc = wx.createCanvasContext('canvasArc');\/\/\u521b\u5efa\u5e76\u8fd4\u56de\u7ed8\u56fe\u4e0a\u4e0b\u6587context\u5bf9\u8c61\u3002\r\n cxt_arc.setLineWidth(6);\r\n cxt_arc.setStrokeStyle('#d2d2d2');\r\n cxt_arc.setLineCap('round')\r\n cxt_arc.beginPath();\/\/\u5f00\u59cb\u4e00\u4e2a\u65b0\u7684\u8def\u5f84\r\n cxt_arc.arc(106, 106, 100, 0, 2*Math.PI, false);\/\/\u8bbe\u7f6e\u4e00\u4e2a\u539f\u70b9(106,106)\uff0c\u534a\u5f84\u4e3a100\u7684\u5706\u7684\u8def\u5f84\u5230\u5f53\u524d\u8def\u5f84\r\n cxt_arc.stroke();\/\/\u5bf9\u5f53\u524d\u8def\u5f84\u8fdb\u884c\u63cf\u8fb9\r\n \r\n cxt_arc.setLineWidth(6);\r\n cxt_arc.setStrokeStyle('#3ea6ff');\r\n cxt_arc.setLineCap('round')\r\n cxt_arc.beginPath();\/\/\u5f00\u59cb\u4e00\u4e2a\u65b0\u7684\u8def\u5f84\r\n cxt_arc.arc(106, 106, 100, -Math.PI * 1 \/ 2, Math.PI*6\/5, false);\r\n cxt_arc.stroke();\/\/\u5bf9\u5f53\u524d\u8def\u5f84\u8fdb\u884c\u63cf\u8fb9\r\n \r\n cxt_arc.draw();\r\n \r\n },\r\n onShow: function () {\r\n \/\/ \u9875\u9762\u663e\u793a\r\n },\r\n onHide: function () {\r\n \/\/ \u9875\u9762\u9690\u85cf\r\n },\r\n onUnload: function () {\r\n \/\/ \u9875\u9762\u5173\u95ed\r\n }\r\n})<\/pre>\n \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\uff1a<\/p>\n
<view>\r\n <view>\r\n <canvas>\r\n <\/canvas>\r\n \r\n <view>\u4e2d\u95f4<\/view>\r\n \r\n <\/view><\/view><\/pre>\n \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
CSS\u6837\u5f0f\uff1a<\/p>\n
.cir{\r\n display: inline-block;\r\n margin-top: 20rpx;\r\n \r\n}\r\n \r\n.top{\r\n text-align: center\r\n}\r\n \r\n.cc{\r\n \r\n margin-top: -120px;\r\n \r\n}<\/pre>\n \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u4ee5\u4e0a\u5c31\u662f\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u4e4b\u5236\u4f5c\u81ea\u5b9a\u4e49\u5706\u5f62\u8fdb\u5ea6\u6761\u7684\u8be6\u7ec6\u5185\u5bb9\uff0c\u66f4\u591a\u8bf7\u5173\u6ce8\u7c73\u4e91\u5176\u5b83\u76f8\u5173\u6587\u7ae0\uff01<\/p>\n","protected":false},"excerpt":{"rendered":"
\u6587\u7ae0\u4e3b\u8981\u4ecb\u7ecd\u4e86\u8be6\u89e3\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u2014\u2014\u81ea\u5b9a\u4e49\u5706\u5f62\uff0c\u5177\u6709\u4e00\u5b9a\u7684\u53c2\u8003\u4ef7\u503c\uff0c\u5b9e\u73b0\u601d\u8def\uff0c\u5148\u7ed8\u5236\u5e95\u5c42\u7684\u7070\u8272\u5706\u5708\u80cc\u666f\uff0c\u518d\u7ed8\u5236\u4e0a\u5c42\u7684\u84dd\u8272\u8fdb\u5ea6\u6761\u3002 \u4ee3\u7801\uff1a Page({ data: {}, onLoad: function (options) { \/\/ \u9875\u9762\u521d\u59cb\u5316 options\u4e3a\u9875\u9762\u8df3\u8f6c\u6240\u5e26\u6765\u7684\u53c2\u6570 }, onReady: function () { \/\/ \u9875\u9762\u6e32\u67d3\u5b8c\u6210 var cxt_arc = wx.createCanvasContext(‘canvasArc’);\/\/\u521b\u5efa\u5e76\u8fd4\u56de\u7ed8\u56fe\u4e0a\u4e0b\u6587context\u5bf9\u8c61\u3002 cxt_arc.setLineWidth(6); cxt_arc.setStrokeStyle(‘#d2d2d2′); cxt_arc.setLineCap(’round’) cxt_arc.beginPath();\/\/\u5f00\u59cb\u4e00\u4e2a\u65b0\u7684\u8def\u5f84 cxt_arc.arc(106, 106, 100, 0, 2*Math.PI, false);\/\/\u8bbe\u7f6e\u4e00\u4e2a\u539f\u70b9(106,106)\uff0c\u534a\u5f84\u4e3a100\u7684\u5706\u7684\u8def\u5f84\u5230\u5f53\u524d\u8def\u5f84 cxt_arc.stroke();\/\/\u5bf9\u5f53\u524d\u8def\u5f84\u8fdb\u884c\u63cf\u8fb9 cxt_arc.setLineWidth(6); cxt_arc.setStrokeStyle(‘#3ea6ff’); cxt_arc.setLineCap(’round’) cxt_arc.beginPath();\/\/\u5f00\u59cb\u4e00\u4e2a\u65b0\u7684\u8def\u5f84 cxt_arc.arc(106, 106, 100, -Math.PI * 1 \/ 2, Math.PI*6\/5, false); cxt_arc.stroke();\/\/\u5bf9\u5f53\u524d\u8def\u5f84\u8fdb\u884c\u63cf\u8fb9 cxt_arc.draw(); }, onShow: function () { \/\/ \u9875\u9762\u663e\u793a }, onHide: function () { \/\/ \u9875\u9762\u9690\u85cf }, onUnload: function () { \/\/ \u9875\u9762\u5173\u95ed } }) \u767b\u5f55\u540e\u590d\u5236 \uff1a <view> <view> <canvas> <\/canvas> <view>\u4e2d\u95f4<\/view> <\/view><\/view> \u767b\u5f55\u540e\u590d\u5236 CSS\u6837\u5f0f\uff1a .cir{ display: inline-block; margin-top: 20rpx; } […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19],"tags":[],"class_list":["post-29603","post","type-post","status-publish","format-standard","hentry","category-19"],"_links":{"self":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/29603","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/comments?post=29603"}],"version-history":[{"count":0,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/29603\/revisions"}],"wp:attachment":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/media?parent=29603"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/categories?post=29603"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/tags?post=29603"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}