It was very difficult and time consuming to detect, why my most important toast did not close by clicking the x button. For months I used auto hide with a delay of 3 sec as a workaround. For some people 3 sec was too long. Other users did not get the meaning of the toast text within 3 sec. Today I found what was causing the problem. There are 5 toasts existing. Because these toasts are hidden initially they could invisibly cover important buttons so that these buttons could not be used. So I had to position the toasts within the small space - when using small devices - between the buttons. Today I put autohide to false. The x button of the first appearing toast did not work. With the brilliant Chrome debugger I found that 3 other hidden toasts covered the x of the visible toast. The next workaround was to reduce the width of the curerntly covering toasts so that the x of the visible toast was no more covered by any other toast.
Toasts do look a bit nicer than alerts, but I had to pay for this with many hours of search and tests.
Any idea how AppStudio could handle toasts a bit easier? Possibility to set z-index?
Good suggestion - I have opened an issue.
If you either disable and/or move the toasts off screen when you hide them maybe that’d solve the issue in the meantime. I find Selects have a habbit of “working” behind the scenes.
We’re getting around to doing this one. Unfortunately, I’m unable to construct an example to reproduce the problem.
@bsommer, any chance you can make a small project showing the problem?
(@lotsofcows, same with Select)
I sent mail and zip @Leader / gh
Toasts and datetimepicker, the latter not working with iOS, made me do a lot of research and experiments with z-Index and positioning. It is only a few days now that I detected another toast, provided for rather rare occasions, overlapping and blocking a button in FristPick. The toast got a new size and position and I did experiments with z-index, parents and children, so that it finally did not interfere with the button even when I tried strange responsive screen sizes. I imagine that datepickers and select have it common that they initially are hidden in the background as well as the Toasts and that this causes the problems.
I finally got all things working, except with iOS. Only “datepicker not working with iOS” makes me still think it over what is going on.
Update:
Re: toasts prevent using a button if and when toast size overlaps a button.
Today I found a solution: “toast has class toast-container which has z-index 999999”. So the overlapped button (toast partly underneath button) stays functioning when style of button is set to z-index 1000000.