i want to ask how do i navigate tabs inside the DefaultTab, i have DefaultTabController Page that i name it OrderList inside OrderList i have 3 different tab which Progress,Complete and Cancel when i click button i want to navigate it to OrderList that show Cancel page. Below is my code. If i directly navigate to OrderList, it will show the first page which is progress, i wanted it to navigate to the 3rd page which is the cancel page.
class _OrderListState extends State<OrderList> {
@override
Widget build(BuildContext context) {
return DefaultTabController(
length: 3,
child: Container(
decoration: BoxDecoration(
color: Colors.teal[300],
),
child: Scaffold(
bottomNavigationBar: BottomNavigationBarForAppClient(indexNum: 1),
backgroundColor: Colors.transparent,
appBar: AppBar(
title: const Text('Order List'),
centerTitle: true,
flexibleSpace: Container(
decoration: BoxDecoration(
color: Colors.teal[300],
),
),
),
body: Column(
children: [
TabBar(tabs: [
Tab(
text: 'In Progress',
),
Tab(
text: 'Completed',
),
Tab(
text: 'Cancelled',
),
]),
Expanded(
child: TabBarView(children: [
ProgressClient(),
CompletedClient(),
CancelledClient(),
]),
)
],
),
),
),
);
}
}
this is the other page code. As you can see here i navigate it to OrderList() and the default tab inside OrderList ProgressClient , i want it to go to the CancelledClient tab
IconButton(
onPressed: () {
Navigator.pushReplacement(context,
MaterialPageRoute(builder: (context) => OrderList()));
},
icon: Icon(Icons.arrow_back, size: 40, color: Colors.white)),
CodePudding user response:
class _OrderListState extends State<OrderList> with TickerProviderStateMixin {
TabBar(
controller: TabController(initialIndex: 3, vsync: this,length: 3)
..
add controller and set initialInde(index of page which you want)
CodePudding user response:
Try to use route argument like on push
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) => OrderList(),
settings: RouteSettings(arguments: 2)));
And on orderList using TabController.
class OrderList extends StatefulWidget {
const OrderList({super.key});
@override
State<OrderList> createState() => _OrderListState();
}
class _OrderListState extends State<OrderList>
with SingleTickerProviderStateMixin {
late final TabController controller = TabController(length: 3, vsync: this);
@override
Widget build(BuildContext context) {
final int? callBackTabIndex =
ModalRoute.of(context)?.settings.arguments as int?;
if (callBackTabIndex != null && callBackTabIndex == 2) {
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
controller.animateTo(2);
});
}
return Container(
decoration: BoxDecoration(
color: Colors.teal[300],
),
child: Scaffold(
// bottomNavigationBar: BottomNavigationBarForAppClient(indexNum: 1),
backgroundColor: Colors.transparent,
appBar: AppBar(
title: const Text('Order List'),
centerTitle: true,
flexibleSpace: Container(
decoration: BoxDecoration(
color: Colors.teal[300],
),
),
),
body: Column(
children: [
TabBar(
controller: controller,
tabs: [
Tab(
text: 'In Progress',
),
Tab(
text: 'Completed',
),
Tab(
text: 'Cancelled',
),
],
onTap: (value) {},
),
Expanded(
child: TabBarView(controller: controller, children: [
ElevatedButton(
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => AnotherWidget(),
));
},
child: Text("NA")),
Text("CompletedClient"),
Text("CancelledClient"),
]),
)
],
),
),
);
}
}
for test case
class AnotherWidget extends StatelessWidget {
const AnotherWidget({super.key});
@override
Widget build(BuildContext context) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
ElevatedButton(
onPressed: () {
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) => OrderList(),
settings: RouteSettings(arguments: 2)));
},
child: Text("NV"),
),
],
);
}
}