今天折腾这玩意,从复杂到简单,最后发现只要这几行就能解决,效果还十分优雅。
css
.progress-circle {
width: 100px;
height: 100px;
border-radius: 50%;
}
html
const progressStyle = `background: conic-gradient(#fff ${progress}%, rgba(0, 0, 0, 0.3) 0%)`
<View className=”progress-circle” style={progressStyle} />
${progress} 是变量,0 到 100。