Create Apple-like alerts & toasts using SwiftUI
Currently in SwiftUI, the only way to inform the user about some process that finished for example, is by using Alert
. Sometimes, you just want to display a message that tells the user that something has completed or that their message was sent. Apple doesn’t provide any method other than using Alert, even though they use various types of pop-ups. This results in poor UX, as the user must tap ‘OK’ or ‘Dismiss’ for every piece of information they should be notified about
Alert Toast is an open-source library in Github to use with SwiftUI. It allows you to present popups that don’t need any user action to dismiss or to validate. Some great usage examples: Message Sent
, Poor Network Connection
, Profile Updated
, Logged In/Out
, Favorited
, Loading
and so on…
Alert
(pop at the center), HUD
(drop from the top) and Banner
(pop/slide from the bottom).Complete
, Error
SystemImage
, Image
, Loading
, and Regular
(Only Text).put star 🌟
.₿ Bitcoin donation address:
0xec48bfa813a773fa2394aec23f97da5cb4d5ff02
CocoaPods is a dependency manager for Cocoa projects. For usage and installation instructions, visit their website. To integrate AlertToast
into your Xcode project using CocoaPods, specify it in your Podfile:
pod 'AlertToast'
The Swift Package Manager is a tool for managing the distribution of Swift code. It’s integrated with the Swift build system to automate the process of downloading, compiling, and linking dependencies.
To integrate AlertToast
into your Xcode project using Xcode 12, specify it in File > Swift Packages > Add Package Dependency...
:
https://github.com/elai950/AlertToast.git, :branch="master"
For Xcode 13, please refer this article to install AlertToast
If you prefer not to use any of dependency managers, you can integrate AlertToast
into your project manually. Put Sources/AlertToast
folder in your Xcode project. Make sure to enable Copy items if needed
and Create groups
.
First, add import AlertToast
on every swift
file you would like to use AlertToast
.
Then, use the .toast
view modifier:
Parameters:
isPresenting
: (MUST) assign a Binding<Bool>
to show or dismiss alert.duration
: default is 2, set 0 to disable auto dismiss.tapToDismiss
: default is true
, set false
to disable.alert
: (MUST) expects AlertToast
.import AlertToast
import SwiftUI
struct ContentView: View{
@State private var showToast = false
var body: some View{
VStack{
Button("Show Toast"){
showToast.toggle()
}
}
.toast(isPresenting: $showToast){
// `.alert` is the default displayMode
AlertToast(type: .regular, title: "Message Sent!")
//Choose .hud to toast alert from the top of the screen
//AlertToast(displayMode: .hud, type: .regular, title: "Message Sent!")
//Choose .banner to slide/pop alert from the bottom of the screen
//AlertToast(displayMode: .banner(.slide), type: .regular, title: "Message Sent!")
}
}
}
.toast(isPresenting: $showAlert, duration: 2, tapToDismiss: true, alert: {
//AlertToast goes here
}, onTap: {
//onTap would call either if `tapToDismis` is true/false
//If tapToDismiss is true, onTap would call and then dismis the alert
}, completion: {
//Completion block after dismiss
})
AlertToast(displayMode: DisplayMode,
type: AlertType,
title: Optional(String),
subTitle: Optional(String),
style: Optional(AlertStyle))
//This is the available customizations parameters:
AlertStyle(backgroundColor: Color?,
titleColor: Color?,
subTitleColor: Color?,
titleFont: Font?,
subTitleFont: Font?)
SFSymbols
..toast(isPresenting: Binding<Bool>, duration: Double = 2, tapToDismiss: true, alert: () -> AlertToast , onTap: () -> (), completion: () -> () )
AlertToast(type: .regular, title: Optional(String), subTitle: Optional(String))
AlertToast(type: .complete(Color)/.error(Color), title: Optional(String), subTitle: Optional(String))
AlertToast(type: .systemImage(String, Color), title: Optional(String), subTitle: Optional(String))
AlertToast(type: .image(String), title: Optional(String), subTitle: Optional(String))
//When using loading, duration won't auto dismiss and tapToDismiss is set to false
AlertToast(type: .loading, title: Optional(String), subTitle: Optional(String))
You can add many .toast
on a single view.
I wrote an article that contains more usage examples.
Medium - How to toast an alert in SwiftUI
All issue reports, feature requests, pull requests and GitHub stars are welcomed and much appreciated.
Elai Zuberman
AlertToast
is available under the MIT license. See the LICENSE file for more info.