Sometimes you just want to show the user that some process is loading, or completed without the need to “Dismiss” the alert. Using the built-in alert when a user favorited a song or add it to a library is not a good UX.
We all familiar with Apple’s Music alerts popups when we like/add a song to our library. This is a great way presenting simple and beautiful information to the user.
So I thought why not making an open-source library and recreating Apple’s alerts appearance and behavior as much as possible for SwiftUI.
How it’s going to look like:
First, install this repo:
Alert Toast is an open-source library in Github using SwiftUI. It allows you to present popups like Apple Music &…
After the installation, Just add the
.toast view modifier on any view builer that you would like to present an alert, assign a
Binding<Bool> and if you want, you can also add duration.
.toast view modifier function expects to receive an
AlertToast just like the built-in alert system in SwiftUI.
The final code with a simple text alert should look like this:
AlertToast, you must have
type:, any other parameter can be removed or assigned
Alert Types and Parameters
The default alert duration is 2 seconds, you can add
duration: to the
.toast view modifier to change the time duration for the presented alert, OR you can set duration to 0 to disable auto dismiss.
Currently, there’s 6 alert types I created for you to use:
- Regular: Alert with only text.
- Complete/Done: Alert with built-in checkmark animation.
- Error: Alert with built-in xmark animation.
- System Image: Alert with SFSymbols images.
- Image: Alert with a named image from Assets.
- Loading: Activity Indicator (Spinner).
Every type has its associated values to assign like Color & Image names. I will pass here the whole Alert Types with associated types that they require.
Oh, one more thing, you can add to a single view as many alerts as you like!
What if you want to present alert after successful login, other network action or some kind of process? and you don’t want to create a bunch of
Bool for each kind of alert. One alert, and one toggle.
You can create an
ObservableObject and implement an
EnvironmentObject to use it from anywhere in the project without calling again and again
The important thing here is to apply the view modifier to your first View in the hierarchy, and init a new AlertToast from other views on the same ObservableObject.
This method will automatically present the alert upon init:
Thank you very much for reading this article! This is the very first article that I’m writing so I’ll appreciate any comment from you guys so I could do better :)