小程序canvas弧形进度条

canvas弧形进度条，实现如图。

canvas重绘分数，如rgba底色会覆盖逐渐变白，暂时十六进制。

canvas小程序，如最外view存在 fixed等定位，会飘，激宴截取用替换的图旁正片代替。

起始位置为下图中的0.75-0.25，3/4圆270度。

ps：阻止canvas随页面滚动(已解决明启银，可不看）

https://www.jianshu.com/p/c356ce38fd58

要在小程序中实现滑动展示部分，可以使用小程序自带的swiper组件，具体步骤如下：

1. 在wxml文件中添加swiper组件代码：

```

<swiper class="swiper" indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">卜旁袜让

<swiper-item>

<!-- 第一个滑动页的内容 -->

</swiper-item>

<swiper-item>

<!-- 第二个滑动页的内容 -->

</swiper-item>

<swiper-item>

<!-- 第三个滑动页的内容 -->

</swiper-item>

</swiper>

```

2. 在对应的js文件中设置swiper组件的相关参数，例如：

```

Page({

data: {

indicatorDots: true, // 是否显示指示点

autoplay: true, // 是否自动切换

interval: 5000, // 自动切换时间间隔

duration: 1000 // 滑动动画时长

}

})

```

3. 根据实际需求，设置滑动页的内容样式和布局。

通过以上步骤，就可以在小程序中实现型好橡滑动展示部分了。

项目中，轮播图原本的直角觉得不够美观，于是设置了圆角border-radius: 10rpx，但梁灶是会出现祥简一个bug就是，滑动过程中先显示的直角，等滑动一整张之后才会变成圆角。

这个问题真的是苦恼了半天呢，因为在父级上设置了overflow: hidden然而在iOS真机上并不买账~

1、首先在轮播图的最外层，先设置好圆角，也就是top_img这个view的样式

2、然后在swiper样式上设置ovewflow:hiddenborder-radius:10rpx

很多百度出来的结果都是这样解决的，我不明白橡宴扮，难道只有我的iOS真机上不好用吗？

加上这关键一句之后，问题才得以解决！赶快记录下来，希望可以帮助到跟我遇到相同问题的伙伴们

---