progress class="progress" percent="{{percent}}" show-info="{{isSi}}" stroke-width="{{sw}}" activeColor="{{pc}}" backgroundColor="{{pbc}}" active="{{isActive}}" active-mode="forwards"/progressview class="section" input placeholder="设置进度" type="number" bindinput="progressInput" confirm-type="done" focus//viewview class="section" input placeholder="设置宽度" type="number" bindinput="swInput" confirm-type="done" focus//viewview view class='text'设置进度条颜色(请使用十六进制颜色值,例如：#ff00ff)/view input class="section" placeholder="" value="#" bindinput="pcInput" confirm-type="done" focus//viewview view class='text'未选择的进度条的颜色(请使用十六进制颜色值,例如：#ff00ff)/view input class="section" placeholder="" value="#" bindinput="pbcInput" confirm-type="done" focus//viewbutton class='btn' bindtap="bindButton"设置/取消进度条从左往右的动画/buttonbutton class='btn' bindtap="bindButton1"设置/取消进度条右侧显示百分比/button//获取应用实例const app = getApp()var isFirst = true;var isSiFirst = true;Page({ data: { percent: "20", // 初始进度条百分数 sw: 6, // 初始进度条宽度 pc: '#00ff00', pbc: '#cccccc', isActive: true, isSi: true, }, onLoad: function () { }, //进度条输入事件 progressInput: function (e) { this.setData({ percent: e.detail.value }) }, //设置宽度事件 swInput: function (e) { this.setData({ sw: e.detail.value }) }, //设置进度条颜色事件 pcInput: function (e) { this.setData({ pc: e.detail.value }) }, //未选择的进度条的颜色事件 pbcInput: function (e) { this.setData({ pbc: e.detail.value }) }, //设置进度条从左往右的动画 bindButton: function (e) { console.log(isFirst); if (isFirst == true) { isFirst = false; this.setData({ isActive: false, }) } else { isFirst = true; this.setData({ isActive: true, }) } }, //设置进度条右侧显示百分比 bindButton1: function (e) { if (isSiFirst == true) { isSiFirst = false; this.setData({ isSi: false, }) } else { isSiFirst = true; this.setData({ isSi: true, }) } },}).progress { width: 95%; margin: 20rpx;}.section { width: 93%; margin: 20rpx; background-color: #ccc; padding: 10rpx; font-size: 30rpx;}.btn { width: 95%; margin-top: 10rpx;}.text { width: 100%; font-size: 30rpx;}参考：https://blog.csdn.net/Afanbaby/article/details/78779805
