在我看来,并没有现成的包可以做到这一点。你必须编写自己的类来实现,而且相当容易。下面是示例代码,完整代码在此。
只需调用下面的类作为ScreenProgress(ticks:2),它将返回与您问题中的图像类似的内容。
注意:请将以下代码用作示例(而不是最终实现)。
class ScreenProgress extends StatelessWidget {
final int ticks;
ScreenProgress({@required this.ticks});
@override
Widget build(BuildContext context) {
return Row(
children: <Widget>[
tick1(),
spacer(),
line(),
spacer(),
tick2(),
spacer(),
line(),
spacer(),
tick3(),
spacer(),
line(),
spacer(),
tick4(),
],
);
}
Widget tick(bool isChecked){
return isChecked?Icon(Icons.check_circle,color: Colors.blue,):Icon(Icons.radio_button_unchecked, color: Colors.blue,);
}
Widget tick1() {
return this.ticks>0?tick(true):tick(false);
}
Widget tick2() {
return this.ticks>1?tick(true):tick(false);
}
Widget tick3() {
return this.ticks>2?tick(true):tick(false);
}
Widget tick4() {
return this.ticks>3?tick(true):tick(false);
}
Widget spacer() {
return Container(
width: 5.0,
);
}
Widget line() {
return Container(
color: Colors.blue,
height: 5.0,
width: 50.0,
);
}
}
在 pub.dev 上有一些你想要的包,你可以尝试这两个包: