i have 2 screens. on the first screen i am calling the second screen inside a list view builder. the second screen have 3 inkwells and on the press of each inkwell i am calling a callback function to open the endDrawer, which is present on the first screen. this endDrawer will render different CustomScreens based on the inkwell pressed.
on second screen, i have a function:
final Function(int) onTap;
on this second screen i have an inkwell and on its press button i am calling this function as:
InkWell(
onTap:(){
widget.onTap(2);
},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"Zee Lounge",
style: TextStyle(
fontSize: 18,
color: Color(0xff0101AA),
decoration: TextDecoration.underline,
),
),
),
),
now on the first screen i want to save this value to an int variable and on based of that i will open different Drawers. how can i save the int value from second screen on first screen.
the first screen i have is:
import 'package:feyst_fe_operations/widgets/custom_app_bar.dart';
import 'package:feyst_fe_operations/widgets/custom_container.dart';
import 'package:feyst_fe_operations/screens/experience_custom_screen.dart';
import 'package:feyst_fe_operations/widgets/custom_drop_down_button.dart';
import 'package:feyst_fe_operations/widgets/custom_table_header.dart';
import 'package:feyst_fe_operations/widgets/custom_table_row.dart';
import 'package:flutter/material.dart';
class HomeScreen extends StatefulWidget {
const HomeScreen({super.key});
static List<Color> customContainerColor = const [
Color(0xffFBECCB),
Color(0xffB0C18B),
Color(0xffD1D1D1),
Color(0xffF1C452),
Color(0xffF89F84),
];
@override
State<HomeScreen> createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
int savedValue = 0;
void updateValue(int newValue) {
setState(() {
savedValue = newValue;
});
print("saved value is $savedValue");
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: SingleChildScrollView(
child: Column(
children: [
const CustomAppBar(),
Padding(
padding: const EdgeInsets.all(10),
child:
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
for(int i=0; i<HomeScreen.customContainerColor.length; i++)
CustomContainer(containerColor: HomeScreen.customContainerColor[i],),
],
),
),
const SizedBox(
width:20,
),
const CustomTableHeader(),
ListView.builder(
itemCount: 50,
shrinkWrap: true,
//scrollDirection: Axis.horizontal,
itemBuilder: (context, index) {
return CustomTableRow(
onTap: (int buttonPressed){
Scaffold.of(context).openEndDrawer();
}
);
},
)
],
),
),
endDrawer: ExperienceCustomDrawer(),
);
}
}
the second screen i have is:
import 'package:feyst_fe_operations/screens/experience_custom_screen.dart';
import 'package:feyst_fe_operations/widgets/my_custom_bottom_sheet_content.dart';
import 'package:flutter/material.dart';
class CustomTableRow extends StatefulWidget {
CustomTableRow({super.key, required this.onTap});
//final VoidCallback onTap;
final Function(int) onTap;
@override
State<CustomTableRow> createState() => _CustomTableRowState();
}
class _CustomTableRowState extends State<CustomTableRow> {
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
padding: const EdgeInsets.symmetric(vertical: 8.0),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
flex: 1,
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"0160",
style: TextStyle(
color: Color(0xff393C46),
fontSize: 16,
),
),
),
),
Expanded(
flex: 3,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Flexible(
flex: 1,
child: Container(
padding: EdgeInsets.all(8.0),
decoration: BoxDecoration(
color: Color(0xffFFEEE8),
borderRadius: BorderRadius.circular(5),
),
child: SizedBox(
child: Image(
image:
AssetImage("assets/images/dinnerTable.png"),
),
),
),
),
Flexible(
flex: 4,
child: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
InkWell(
onTap: (){
widget.onTap(1);
},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"Sea Food Experience",
style: TextStyle(
fontSize: 18,
color: Color(0xff0101AA),
decoration: TextDecoration.underline,
),
),
),
),
FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"Rawat, Islamabad",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 16,
//fontWeight: FontWeight.bold,
),
),
),
],
),
),
),
],
),
),
Expanded(
flex: 2,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
InkWell(
onTap:(){
widget.onTap(2);
},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"Zee Lounge",
style: TextStyle(
fontSize: 18,
color: Color(0xff0101AA),
decoration: TextDecoration.underline,
),
),
),
),
FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"0300 500 9000",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 16,
//fontWeight: FontWeight.bold,
),
),
),
],
),
),
Expanded(
flex: 2,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
//crossAxisAlignment: CrossAxisAlignment.start,
children: [
InkWell(
onTap: () {
print("Foodie clicked");
},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"Umer Mehmood",
style: TextStyle(
fontSize: 18,
color: Color(0xff0101AA),
decoration: TextDecoration.underline,
),
),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
flex: 1,
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"persons:",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 16,
//fontWeight: FontWeight.bold,
),
),
),
),
Expanded(
flex: 1,
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"04",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 12,
fontWeight: FontWeight.bold,
),
),
),
),
],
),
],
),
),
Expanded(
flex: 2,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
//crossAxisAlignment: CrossAxisAlignment.start,
children: [
InkWell(
onTap: () {},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"Jazz Cash",
style: TextStyle(
fontSize: 16,
color: Color(0xff393C46),
//decoration: TextDecoration.underline,
),
),
),
),
FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"3000",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 16,
//fontWeight: FontWeight.bold,
),
),
),
],
),
),
Expanded(
flex: 2,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
//crossAxisAlignment: CrossAxisAlignment.start,
children: [
InkWell(
onTap: () {},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"Jazz Cash",
style: TextStyle(
fontSize: 16,
color: Color(0xff393C46),
//decoration: TextDecoration.underline,
),
),
),
),
FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"3000",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 16,
//fontWeight: FontWeight.bold,
),
),
),
],
),
),
Expanded(
flex: 2,
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"6000",
style: TextStyle(
color: Color(0xff393C46),
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
),
),
Expanded(
flex: 2,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
InkWell(
onTap: () {},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"28-01-23",
style: TextStyle(
fontSize: 16,
color: Color(0xff393C46),
//decoration: TextDecoration.underline,
),
),
),
),
FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"02:30 PM",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 16,
//fontWeight: FontWeight.bold,
),
),
),
],
),
),
Expanded(
flex: 2,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
InkWell(
onTap: () {},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"28-01-23",
style: TextStyle(
fontSize: 16,
color: Color(0xff393C46),
//decoration: TextDecoration.underline,
),
),
),
),
FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"02:30 PM",
style: TextStyle(
color: Color(0xff797E90),
fontSize: 16,
//fontWeight: FontWeight.bold,
),
),
),
],
),
),
Expanded(
flex: 2,
child: InkWell(
onTap: () {},
child: Container(
// height: 100,
padding: const EdgeInsets.symmetric(
horizontal: 12, vertical: 8),
decoration: BoxDecoration(
color: Color(0xffD1D1D1),
borderRadius: BorderRadius.circular(10),
),
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
"DECLINED",
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
),
),
),
],
),
),
const Divider(
color: Color(0xff707070),
thickness: 0.5,
),
],
),
);
}
}
2
Answers
Below is the simplest way to get index from Second screen to First screen.
You already have access to the index from the second screen on
onTapis the callback function that your are passing to second screen. On theonTap,buttonPressed is the index provided by thewidget.onTap(2);you called on second screen. You are passing constant value 2 here tobuttonPressed.Based on the value of
buttonPressedyou can open your drawer or do anything you want with the value you obtained. Whenever you callwidget.onTapon the second screen, the function onTap you defined in the first screen is called. I don’t think there is any other problem if I understood the question correctly.I think you should invest some time in mastering the callback function as they are pretty cool.