IndexedStack is a Stack. A Stack that shows a single child from a list of children.
Properties
- alignment
- children
- clipBehavior
- fit
- index
- textDirection
Example:
import 'package:flutter/material.dart';
void main() => DemoApp();
class DemoApp extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return DemoAppState();
}
}
class DemoAppState extends State<DemoApp> {
int index = 0;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text("Demo App"),
),
body: Center(
child: IndexedStack(
index: index,
children: [
Container(
padding: EdgeInsets.all(50),
child: const Text(
'0',
style: TextStyle(fontSize: 80),
),
color: Colors.redAccent,
),
Container(
padding: EdgeInsets.all(50),
child: const Text(
'1',
style: TextStyle(fontSize: 80),
),
color: Colors.blueAccent,
),
Container(
padding: EdgeInsets.all(50),
child: const Text(
'2',
style: TextStyle(fontSize: 80),
),
color: Colors.cyanAccent,
),
Container(
padding: EdgeInsets.all(50),
child: const Text(
'3',
style: TextStyle(fontSize: 80),
),
color: Colors.limeAccent,
),
],
),
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.change_circle),
onPressed: () {
setState(
() {
if (index == 3) {
index = 0;
} else {
index = index + 1;
}
},
);
},
),
),
);
}
}
Video Link: