I want to show 2 diiferent dialog box at some interval but it gives me error.
First I want to show circular loading dialog and after some interval I want to show the another one. But I didn’t know where I’m wrong. Please help me to solve this
Here is the code that I’m working on……
import 'dart:async';
import 'package:whatsapp/exports.dart';
class DialogWidgets extends StatefulWidget {
const DialogWidgets({super.key});
@override
State<DialogWidgets> createState() => _DialogWidgetsState();
}
class _DialogWidgetsState extends State<DialogWidgets> {
bool showLoadingWidget = true;
dynamic assignWidget;
Future<Widget> updateWidget() async {
await Timer.periodic(Duration(seconds: 10), (timer) {
setState(() {
assignWidget = editNumberDialogBox();
});
});
return assignWidget;
}
@override
Widget build(BuildContext context) {
updateWidget();
return Scaffold(
body: Center(
child: assignWidget == null ? circularDialogBox() : assignWidget,
),
);
}
editNumberDialogBox() {
return showDialog(
context: context,
builder: (context) {
return Dialog(
child: Container(
height: 220,
width: 320,
color: Colors.white,
padding: EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"You entered the phone number",
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w400,
),
),
SizedBox(height: 20),
Text(
"+91 88665 77577",
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
SizedBox(height: 20),
Text(
"Is this OK, or would you like to edit the number?",
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w400,
),
),
Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
TextButton(
onPressed: () {
Navigator.pop(context);
},
child: Text(
"EDIT",
style: TextStyle(
color: green,
fontSize: 16,
fontWeight: FontWeight.w500,
),
),
),
TextButton(
onPressed: () {
Navigator.pop(context);
},
child: Text(
"OK",
style: TextStyle(
color: green,
fontSize: 16,
fontWeight: FontWeight.w500,
),
),
),
],
)
],
),
),
);
},
);
}
circularDialogBox() {
return showDialog(
context: context,
builder: (context) {
return Dialog(
child: Container(
height: 85,
width: 380,
color: Colors.white,
padding: EdgeInsets.symmetric(horizontal: 20),
child: Row(
children: [
CircularProgressIndicator(color: green),
SizedBox(width: 20),
Text(
"Connecting...",
style: TextStyle(
fontSize: 16,
color: Colors.black45,
fontWeight: FontWeight.w500,
),
),
],
),
),
);
},
);
}
}
And this code only loads circular dialog box and give error like this….
Help me to solve this 🙂
2
Answers
Try this,
and renove updateWidget() function from build.
Your code is bad, first of all, you are putting as a Widget class a Dialog, that you use as a function, in your child you will only have an empty Container() because you will not show anything in the build.
You need to put the function initState, this is called and executed when the Stateful loads, so first you call your Loading and then you call the function with your Timer.
Try like this :