fikyair / miniProgress

小程序 自定义 半圆环进度条 canvas绘制

miniProgress (本项目是一个使用了自定义组件的代码片段)

自定义 半圆进环度条 canvas绘制

效果

体验代码片段

半圆环进度条

使用

直接将 <miniprogress />组件，引入要使用的页面

<view class='progress'>
    <miniprogress score="60" />
</view>

progress.wxss

.progress {
    padding: 0 10%;
    background: #5182e9;
    height: 320rpx;
}

并在该页面的json文件中将 <miniprogress /> 关联

"usingComponents": {
      "miniprogress": "../common/miniprogress/miniprogress"
}

注：自定义组件即为common文件夹下的文件