How to pop out double alert message - flutter

I am new to Flutter. I made my first pop out confirmation alert dialog (Figure 1) but I want to pop another alert dialog window after.
What I am trying to achieve, it's the following: after I click Yes (Figure 2) the app would lead me to my homescreen and pop out another alert dialog.

You could create a method for the second Alert to show up, and call it when you click "YES" on the first one.
void showSecond(BuildContext context) {
return showDialog(
context: context,
builder: (BuildContext context) => AlertDialog(
title: Text("Thank you for paying with us"),
content: Icon(Icons.check_circle_outline),
actions: [
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: const Text('Okay'),
),
],
),
);
}
and your onPressed() of "YES" in the first alert should look something like:
onPressed: () {
Navigator.push(context, MaterialPageRoute(builder: (context) => const SuccessPay()));
showSecond(context);
},
It was a bit hard to replicate your code from an image, so if something it's not accurate let me now. For the next time, post your code in a code block instead of a picture :)

you can call showAlertDialog to show second popup.(you can create new method to show second popup as content is different)This line can be added after
Navigator.of(context).pop() of first popup

You can use the .then() method. Call it if the user pressed the "YES" button.
Add value when poping your dialog like this Navigator.of(dialogCtx).pop(true);
showDialog(
context: context,
builder: (dialogCtx) => AlertDialog(
// title:
// content:
),
actions: [
TextButton(
onPressed: () {
Navigator.of(dialogCtx).pop(false);
},
child: const Text('CANCEL'),
),
TextButton(
onPressed: () {
Navigator.of(dialogCtx).pop(true);
},
child: const Text('YES'),
),
],
),
).then(
(value) => {
if (value == true)
{
// display the next dialog with the scaffolds context
},
},
);

Related

Returning data from .pop() to use it anywhere

I have written a code that return bool type variables. Whether you like the movie. If you like the movie then it returns true, if you don't like the movie then it returns false. But since the .pop() method works in ElevatedButton, I cannot reach it from another class. How can I reach the value?
ElevatedButton(
child: Text(
"Go to new page"
),
onPressed: () async {
final answer = await Navigator.of(context).push<bool>(
MaterialPageRoute(
builder: (context) {
return VideoScreen("Did you like the video?");
},
)
);
},
),
However, I cannot say like:
ElevatedButton(
child: Text(
"Go to new page"
),
onPressed: () async {
final answer = await Navigator.of(context).push<bool>(
MaterialPageRoute(
builder: (context) {
return VideoScreen("Did you like the video?");
},
)
);
},
),
Text(answer)
],
);
So how can I reach that value? Callback or something? Thanks in advance
Use can pass value to parent route while pop like
Navigator.of(context).pop(YourValue);
While you push make sure to await.
final result = await Navigator.of(context)....;
print(result);

How to Navigate to the next page after closing an interstitial ad in flutter

I want my ad to show every three clicks.
The first click should show an ad.
The next two clicks should not show any ad. and then the fourth should.
This process currently works fine, the only issue is that I want to navigate to the next page after the ad closes but currently, nothing happens when I close the ad. it just remains on the current page
So basically, the first click should show the ad and navigate to the next page when the interstitial ad is closed.
the second click should navigate alone.
the third click should navigate alone.
Then restart the process.
My code is below -
CategoryCardWithImage(
title: "networks",
image: "assets/images/networks.png",
press: () {
clickCount = clickCount + 1;
bool shouldDisplayAd =
clickCount == 1 || clickCount % 3 == 0;
if (shouldDisplayAd) return _showInterstitialAd();
Navigator.push(
context,
MaterialPageRoute(builder: (context) {
return NetworksPage();
}),
);
},
),
Help fix code
I use AlertDialog
to simulate what you would like to achieve.
You could add more if..else condition in the onPressed() function to know which page will be shown after selecting.
void router() {
var aaa = showDialog(
context: context,
builder: (BuildContext context) => AlertDialog(
title: Text('MyTitle'),
content: Text('sdf'),
actions: [
TextButton(
child: Text('ok'),
onPressed: () {
Navigator.pushNamed(context, creationCategory.id);
},),
],
));
}
return Scaffold(
appBar: AppBar(
title: const Text('Record'),
leading: null,
actions: <Widget>[
IconButton(
icon: const Icon(Icons.add),
onPressed: (){
Navigator.pushNamed(context, creationCategory.id);
},
),
IconButton(
icon: const Icon(Icons.settings),
onPressed: () async {
router();
},
),
],
),
Fig1. Pushing that button to invoke void router()
Fig2. Popping Ad
Fig3. To close the Ad and then go to that specific pages.

Flutter: How to update FloatingActionButton color on condition?

I want to update the color of the FloatingActionButton on certain conditions(after the user update his values) I manage to set the color but only if the user click on the button where should I put the setstate or how can I achieve that?
FloatingActionButton.extended(
onPressed: (){
setState(() {
if(departureCity!=null && arrivalCity!=null && bol){
bol2=true;
Navigator.push(
context,
//MaterialPageRoute(builder: (context) => const SeatScreen()),
MaterialPageRoute(builder: (context) => BusSearchResults(departureCity,arrivalCity,_date)),
);
}
});
},
label: const Text('Search'),
backgroundColor: bol2? Color(0xff5348bf):Color(0xffd3d3d3) ,
),
bol2 = !bol2;
just write this instead of (bol2 = true ;) in your setState();
Just change the value of bol2 to the opposite every time on click like given below. And try not to wrap everything in setState() since it's unnecessary.
FloatingActionButton.extended(
onPressed: (){
setState(() {
if(bol2){
bol2=false;
}
else{
bol2=true;
}
});
if(departureCity!=null && arrivalCity!=null){
bol2=true;
Navigator.push(
context,
MaterialPageRoute(builder: (context) =>BusSearchResults(departureCity,arrivalCity,_date)),
);
}
},
label: const Text('Search'),
backgroundColor: bol2? Color(0xff5348bf):Color(0xffd3d3d3),
),

Define navigation route for each element in a String List flutter

I have a list of string which is a Text and each of this List should move me to a specific screen or action, at the momnent I am stuck into this issue, how to assign to each of the list a different route?
this is the code:
List<String> items = [
'Spedizioni',
'I Tuoi ordini',
'Aggiungi un Prodotto',
'Contattaci'
];
child: Row(
children: [
Text(
items[i],
style: TextStyle(
color: _isHovering[i]
? Theme.of(context).primaryTextTheme.button.decorationColor
: Theme.of(context).primaryTextTheme.button.color,
),
),
SizedBox(width: 5,),
Icon(icons[i]),
]
),
);
and until here all ok because it show different item into the list but now I want each of this item in the list navigate to a route as now I defined just one, but I need to define different route for different item in the List
onTap: () {
showDialog(
context: context,
builder: (context) => AddingProductsPopup(),
);
},
Please help me to go out from this stuck
based on your full code https://codeshare.io/an0jpv you can achieve that by like following :
onTap: () {
//here should have the options to call a different route for different List item menu
// call for our alert dialog widget including one more variable which is `items[i]` that has the text that would be passed to the alert
onPressed: () {
//here we show the pop up and pass the variable to it
showAlert(context, items[i]);
setState(() {});
},
now let's define our alert widget
showAlert(BuildContext context, String myItem) {
showDialog(
context: context,
builder: (context) {
return StatefulBuilder(
builder: (context, setState) {
return AlertDialog(
title: Text("this is the clicked item $myItem",);});
});
);
},
now when the popup shows and based on the received text from items[i] the dialog can have deferent titles , and you can add deferent conditions to adjust the content based on the text received from the press item;

Run a function AFTER that the alertbox has been dismissed

I already read countless links like this one but it does not help.
The use case is very simple, I want to run a function AFTER the alert box has been dismissed.
void dummyFunc() {
sleep(Duration(seconds:3));
print("done");
}
Future<bool> displayDialog() async {
return showDialog<bool>(
context: context,
barrierDismissible: false, // user must tap button!
builder: (BuildContext context) {
return AlertDialog(
title: Text('AlertDialog Title'),
content: SingleChildScrollView(
child: ListBody(
children: <Widget>[
Text('This is a demo alert dialog.'),
Text('Would you like to approve of this message?'),
],
),
),
actions: <Widget>[
FlatButton(
child: Text('Decline'),
onPressed: () {
Navigator.of(context).pop(false);
},
),
FlatButton(
child: Text('Approve'),
onPressed: () {
Navigator.of(context).pop(true);
},
),
],
elevation: 24.0,
shape:RoundedRectangleBorder(),
);
},
);
}
var button = AnimatedOpacity(
opacity: 1.0,
duration: Duration(milliseconds: 500),
child: FloatingActionButton(
tooltip: 'Start',
child: Icon(iconShape),
onPressed: () async {
bool shouldUpdate = await displayDialog();
print(shouldUpdate);
if (shouldUpdate)
dummyFunc();
})
);
But the alert dialog is dismissed 3sd after.
Kindly let me know what I am doing wrong, Thank you~
I think this is happening because you are using sleep. Instead of that use Future delay.
void dummyFunc() {
print("done");
}
If you don't want delay, then you can also remove this future, this function will executed after dialog box dismissed.
Sleep will hold the process, that’s why you are facing this error.
Solved it thanks to Viren who gave me a good intuition, Timer works also nicely if you are not using a loop:
void dummyFunc() {
Timer(Duration(seconds: 3), () {
print("done");
});
}
Edit: Actually Viren's answer work better with loops! This can work also. Just avoid sleep. Spent 3h on this, now I hate sleep().