圆环进度条的实现，估计在很多应用中都有需要的地方，但是真要自己实现的时候，还是有点棘手的，不过通过资料搜索，自己写了一个
现在记录下，供大家参考使用

<view style="width:429rpx;height:429rpx;position:relative;border-radius:50%;border:14rpx solid #eaeaea;">
	<view style="width:457rpx;height:457rpx;position:absolute;left:-14rpx;top:-14rpx;border:0;">
	   
	  <view style="width:228.5rpx;height:457rpx;overflow:hidden;display:inline-block;position:relative;">
	    <view style="width:429rpx;height:429rpx;border:14rpx solid transparent;border-radius:50%;position:absolute;top:0;border-bottom:14rpx solid green;border-left:14rpx solid green;left:0rpx;transform :rotate({{leftDeg}}deg)"></view>
	  </view>

	  <view style="width:228.5rpx;height:457rpx;overflow:hidden;display:inline-block;position:relative;">
	    <view style="width:429rpx;height:429rpx;border:14rpx solid transparent;border-radius:50%;position:absolute;top:0;border-top:14rpx solid green;border-right:14rpx solid green;right:0rpx;transform :rotate({{rightDeg}}deg)"></view>
	  </view>

	</view>
</view>

数值解释：

429 - 矩形的实际宽度和高度值
457 - 矩形的使用宽度和高度值，加上了矩形的边框值，记住是上下两个边的，所以乘以2 - 429 + （2 * 14）
228.5 - 矩形的使用宽度值一半 457 / 2
14 - 矩形的边的宽度值

这些值可以根据自己的实际使用进行替换

这里比较关键的是如果计算这个角度的问题，网上看了很多的教程，也没有太理解，经过自己的摸索，写了一个函数，只要调用传值就好了。函数如下

function updateCircleDeg(percent) {
  // const percent = 60; // 百分比值
  let rightDeg = 45; // 默认值 - 可以根据需求进行修改
  let leftDeg = 45; // 默认值 - 可以根据需求进行修改

  if (percent < 50) {
    rightDeg = -135 - 180 * ((50 - percent)/50);
  } else if (percent >= 50 && percent <= 100) {
    rightDeg = -135
    leftDeg = -135 - 180 * ((percent) / -50);
  }

  this.setData({
    leftDeg,
    rightDeg,
  });
},

上面的公式很简单，也许有更简单的，一般一个进度条是满格的情况是100%，于是我用100作为参考值，因为这个进度条是分为左边一半，右边一半，所以100被分成了50，其实这个50是左边一个50，右边一个50。我们知道一个圆是360度，一半的话就是180度，于是就有了180的取值，然后180是度数值，50是我们的百分比值，根据需要展示的百分比就能换算出对应的度数了，于是就有了这个公式。应该还好理解。

同理这个50跟100 也可以算成类比其他之类的东东，可以改造为自己需要的
这里的-135是干嘛的，我也不知道，我知道这个是个参考点，当为-135的时候就是左半边跟右半边吻合的时候，有时候不需要了解这个值，你较真你去了解吧。OK

当然也可以做成动画效果。通过下面的方式执行上面的函数就可以了

const percent = 20; // 百分比值
let timer = .1; // 时间刻度值
const time = (50 - percent) / 50 * 1; // 1 表示基础时间值

const intervalTimer = setInterval(() => {
  this.updateCircleDeg(timer);
  
  if (percent <= timer) {
    clearInterval(intervalTimer);
  }

  console.log(timer);

  timer = parseFloat(parseFloat(timer + .1).toFixed(1));
}, time);