英文:
Why dialog not disappearing when using showDialog?
问题
I am using tabBar.If I click on the first tab and on the second tab many times and very fast then showDialog(loading) not disappearing. It stays on the screen eternally. I tried to fix that for a long time but I can't find a solution
This is the code of the first tab(widget not converted in BlocConsumer):
class FirstWidget extends StatefulWidget {
const FirstWidget({super.key});
@override
State<FirstWidget> createState() => _FirstWidgetState();
}
class _FirstWidgetState extends State<FirstWidget> {
@override
Widget build(BuildContext context) {
return TabBar(
onTap: (index) async {
if (index == 0) {
final connectivityResult = await (Connectivity().checkConnectivity());
if (connectivityResult == ConnectivityResult.wifi ||
connectivityResult == ConnectivityResult.ethernet) {
showWaiting(context); // Here is the loader, if I remove it then loader won't show up when I get data. So I just put it here and because of him my app is freezing
BlocProvider.of<StatisticsCubit>(context).getData();
}
}
},
tabs: [
Tab(
icon: SizedBox(
width: 60.w,
child: Column(
children: [
Text(
"First",
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
height: 1,
color: Colors.white
),
),
],
),
),
),
Tab(
icon: SizedBox(
width: 60.w,
child: Column(
children: [
Text(
"Second",
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
height: 1,
color: Colors.white
),
),
],
),
),
)
],
);
}
}
This is the widget when I press the second tab:
class SecondWidget extends StatefulWidget {
const SecondWidget({super.key});
@override
State<SecondWidget> widget() => _SecondWidgetState();
}
class _SecondWidgetState extends State<SecondWidget> {
@override
Widget build(BuildContext context) {
return BlocConsumer<StCubit, StState>(
listener: (context, state) {
if (state is Waiting) {
showWaiting(context, false);
}
if (state is Success) {
Navigator.of(context, rootNavigator: true).pop();
}
},
builder: (context, state) {
return Container();//content
},
);
}
}
This is a loader:
Future<void> showWaiting(BuildContext context) {
return showDialog(
context: context,
builder: (BuildContext context) => Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
color: Colors.black.withOpacity(0.5),
child: const Center(
child: CircularProgressIndicator(
strokeWidth: 1,
color: Colors.black,
backgroundColor: Colors.white,
),
),
)
);
}
The loader does not disappear when I click many times on the first and the second tab.
英文:
I am using tabBar.If I click on the first tab and on the second tab many times and very fast then showDialog(loading) not disappearing. It stays on the screen eternally. I tried to fix that for a long time but I can't find a solution
This is the code of the first tab(widget not converted in BlocConsumer):
class FirstWidget extends StatefulWidget {
const FirstWidget({super.key});
@override
State<FirstWidget> createState() => _FirstWidgetState();
}
class _FirstWidgetState extends State<FirstWidget> {
@override
Widget build(BuildContext context) {
return TabBar(
onTap: (index) async {
if (index == 0) {
final connectivityResult = await (Connectivity().checkConnectivity());
if (connectivityResult == ConnectivityResult.wifi ||
connectivityResult == ConnectivityResult.ethernet) {
showWaiting(context); // Here is the loader, if I remove it then loader won't show up when I get data. So I just put it here and because of him my app is freezing
BlocProvider.of<StatisticsCubit>(context).getData();
}
}
},
tabs: [
Tab(
icon: SizedBox(
width: 60.w,
child: Column(
children: [
Text(
"First",
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
height: 1,
color: Colors.white
),
),
],
),
),
),
Tab(
icon: SizedBox(
width: 60.w,
child: Column(
children: [
Text(
"Second",
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
height: 1,
color: Colors.white
),
),
],
),
),
)
],
);
}
}
This is the widget when I press seconds tab:
class SecondWidget extends StatefulWidget {
const SecondWidget({super.key});
@override
State<SecondWidget> createState() => _SecondWidgetState();
}
class _SecondWidgetState extends State<SecondWidget> {
@override
Widget build(BuildContext context) {
return BlocConsumer<StCubit, StState>(
listener: (context, state) {
if (state is Waiting) {
showWaiting(context, false);
}
if (state is Success) {
Navigator.of(context, rootNavigator: true).pop();
}
},
builder: (context, state) {
return Container();//content
},
);
}
}
This is a loader:
Future<void> showWaiting(BuildContext context) {
return showDialog(
context: context,
builder: (BuildContext context) => Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
color: Colors.black.withOpacity(0.5),
child: const Center(
child: CircularProgressIndicator(
strokeWidth: 1,
color: Colors.black,
backgroundColor: Colors.white,
),
),
)
);
}
The loader not disappearing when I click many times on the first and the second tab
答案1
得分: 1
因为对话框可能会堆叠,所以在显示新对话框之前,您必须先弹出现有对话框。
尝试更新的代码。
Future<void> showWaiting(BuildContext context) async {
// 弹出任何先前显示的对话框
Navigator.of(context, rootNavigator: true).pop(); // 这可能会修复问题
// 显示新对话框
await showDialog(
context: context,
builder: (BuildContext context) => Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
color: Colors.black.withOpacity(0.5),
child: const Center(
child: CircularProgressIndicator(
strokeWidth: 1,
color: Colors.black,
backgroundColor: Colors.white,
),
),
),
);
}
英文:
It is because there is high possibility that the dialogs are getting stacked up, So you have to first pop the existing dialog before showing the new one.
Try the updated code.
Future<void> showWaiting(BuildContext context) async {
// Dismiss any previously shown dialog
Navigator.of(context, rootNavigator: true).pop(); // This should possibly fix the issue
// Show the new dialog
await showDialog(
context: context,
builder: (BuildContext context) => Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
color: Colors.black.withOpacity(0.5),
child: const Center(
child: CircularProgressIndicator(
strokeWidth: 1,
color: Colors.black,
backgroundColor: Colors.white,
),
),
),
);
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论