視圖比較粗糙，湊合看
需要引入依賴(lài)： percent_indicator: ^2.1.1+1
Pasted Graphic.jpg
import 'package:percent_indicator/percent_indicator.dart';
//圓形進(jìn)度條&&動(dòng)畫(huà)&&漸變色
CircularPercentIndicator(
radius: 190.0,
lineWidth: 13.0,
animation: true,
animationDuration: 1000,//動(dòng)畫(huà)時(shí)長(zhǎng)
percent: 0.5,//設(shè)置比例
center: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
//自定義 view
],
),
circularStrokeCap: CircularStrokeCap.round,
backgroundColor: Color.fromRGBO(39, 153, 93, 0.2),
linearGradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Color.fromRGBO(39, 153, 93, 0.1),
Color.fromRGBO(39, 153, 93, 1)
],
)),
pEt VEnon.jpg
//線形進(jìn)度條&&動(dòng)畫(huà)&&漸變色
LinearPercentIndicator(
width: MediaQuery.of(context).size.width -
46,
lineHeight: 8.0,
percent: 0.3,//設(shè)置比例
animation: true,
animationDuration: 1000,//動(dòng)畫(huà)時(shí)長(zhǎng)
backgroundColor:
Color.fromRGBO(238, 238, 238, 1),
linearGradient: LinearGradient(
begin: Alignment.centerLeft,
end: Alignment.centerRight,
colors: [
Color.fromRGBO(39, 153, 93, 0.1),
Color.fromRGBO(39, 153, 93, 1)
],
),
),
整理不易，給個(gè)贊謝謝！
