New App - Toasts

When starting a new app, I like to have a toast displaying mechanism in-place.

In this post, I will share how easy it is to display toasts in SwiftUI, and I will link to some code to have configurable toasts/snackbars ready to use in your SwiftUI apps.

struct SimpleToastModifier: ViewModifier {
    @Binding var isShowing: Bool

    func body(content: Content) -> some View {
        ZStack(alignment: .top) {
            content

            Text("I'm a toast")
                .foregroundColor(.white)
                .padding()
                .background(Color.gray)
                .cornerRadius(8)
                .onTapGesture {
                    isShowing = false
                }
        }
    }
}

This simple modifier is enough to display a Toast in SwiftUI. However, there are no configuration options, and everything is hardcoded.

You can take a look at the code here, where I have a ToastModifier that is very customizable.

With that code, you can specify different parameters:

• Type (Toast, SnackBar, or a custom view)
  • Both Toast and SnackBar have their own customization options (colors, texts, paddings, corner radius, etc)
• Transition Options (including duration)
• Positioning Options
• An optional action for the tapGesture

Demo

The app used for this video can be downloaded from this repository.

Custom Snack Bar

Let’s say we want a snack bar to be displayed at the bottom of the screen, we can achieve that with these lines of code:

@State private var displayToast: Bool = false

...

YourView
    .toast(
        isShowing: $displayToast,
        type: .snackBar(options: .init(message: .init(text: "Hey There"))),
        transitionOptions: .init(transition: .move(edge: .bottom).combined(with: .opacity)),
        positionOptions: .init(position: .bottom)
    )

Are you using any type of toast/snack bar in your applications?