简介
显示一个子项列表的单个子项。
- 只显示指定位置的widget,其他的位置的widget不会显示,所以indexedStack的尺寸永远和最大的子节点一样。
- 显示的子项widget是给到了具体的索引选择出来的widget
- 如果value 为null,将不显示任何内容
基本用法
index → int
- 控制显示child的索引
- ex:可以通过多个图片转化表示状态(正确,错误,警告等)。
实例演示
class StackDefault extends StatelessWidget {
final int currIndex;
const StackDefault(this.currIndex) : super();
@override
Widget build(BuildContext context) {
return IndexedStack(
index: currIndex,
children: [
// CircleAvatar(
// backgroundImage: AssetImage('images/timg.jpeg'),
// radius: 100.0,
// ),
// Image.asset(
// 'images/timg.jpeg',
// width: 600.0,
// height: 240.0,
// fit: BoxFit.cover,
// ),
CircleAvatar(
backgroundColor: Color(0xfff48fb1),
radius: 40.0,
),
Container(
decoration: BoxDecoration(
color: Colors.black45,
),
child: Text(
'IndexedStack',
style: TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
],
);
}
}
class StackIndex extends StatelessWidget {
final int currIndex;
const StackIndex(this.currIndex) : super();
@override
Widget build(BuildContext context) {
return IndexedStack(
index: currIndex,
children: [
Icon(
Icons.update,
size: 40.0,
color: Color(0xffe91e63),
),
Icon(
Icons.access_alarm,
size: 40.0,
color: Color(0xffe91e63),
),
Icon(
Icons.add_alarm,
size: 40.0,
color: Color(0xffe91e63),
),
Icon(
Icons.access_time,
size: 40.0,
color: Color(0xffe91e63),
),
Icon(
Icons.alarm_off,
size: 40.0,
color: Color(0xffe91e63),
),
],
);
}
}