sanzaru/simpletoast

SimpleToast is a simple, lightweight, flexible and easy to use library to show toasts / popup notifications inside iOS or MacOS applications in SwiftUI. Because of the flexibility to show any content it is also possible to use the library for showing simple modals.

SimpleToast for SwiftUI

SimpleToast is a simple, lightweight, flexible and easy to use library to show toasts / popup notifications inside iOS or macOS applications in SwiftUI. Because of the flexibility to show any content it is also possible to use the library for showing simple modals.

You decide the content, the library takes care about the rest.

⚠️ Note: The current version is still in development. There can and will be breaking changes in version updates until version 1.0.

Features:

• Custom toast content support: You can show whatever you want inside the toast.
• Custom positioning: Place the toast where you want it to be.
• Timeout functionality: You decide if and when the toast should disappear.
• Callback functionality: Run code when the toast disappeared.
• Multiple, customizable animations

🚨 Breaking changes:

0.6.0:

• The options struct is modified and the parameters showBackdrop and backdropColor are replaced by a single optional Color definition backdrop. See Options for more information

Demo

Modifier	Demo
.slide
.fade
.scale
.skew

Installation

Swift Package Manager

dependencies: [
    .package(url: "https://github.com/sanzaru/SimpleToast.git", from: "0.0.1")
]

Cocoapods

Add the following line to your Podfile:

pod 'SwiftUI-SimpleToast', :git => 'https://github.com/sanzaru/SimpleToast.git'

and run

pod install

or

pod update

Usage:

There are different ways of attaching a toast notification to your view. The usage is very similar to well know SwiftUI view modifiers (e.g. alert or sheet). If you are familiar with these, using SimpleToast should be quiet easy.

Note: The toast always appears at the edges to the view it is attached to. Make sure the view has enough space to render the toast. Preferably the toast should be attached to the most outer view or the navigation view, if available.

Attach via boolean

You can attach the toast to a view and show it via binding to a boolean:

import SwiftUI
import SimpleToast

struct ToastTestView: View {
    @State var showToast: Bool = false

    private let toastOptions = SimpleToastOptions(
        hideAfter: 5
    )

    VStack(spacing: 20) {
        Button("Show toast") {
            withAnimation {
                showToast.toggle()
            }
        }
    }
    .simpleToast(isPresented: $showToast, options: toastOptions) {
        Label("This is some simple toast message.", systemImage: "exclamationmark.triangle")
        .padding()
        .background(Color.red.opacity(0.8))
        .foregroundColor(Color.white)
        .cornerRadius(10)
        .padding(.top)
    }
}

Attach via optional object

You can trigger the toast via an instance to an optional object, which conforms to the protocol Identifiable. If the value is not nil the toast will be shown.

The following example is based on the previous one and also shows the toast, but this time based on a value on an item.

import SwiftUI
import SimpleToast

struct ToastTestView: View {
    @State var showToast: DummyItem? = nil

    private struct DummyItem: Identifiable {
        var foo: String = "Bar"
    }

    private let toastOptions = SimpleToastOptions(
        hideAfter: 5
    )

    VStack(spacing: 20) {
        Button("Show toast") {
            withAnimation {
                // Toggle the item
                showToast = showToast == nil ? DummyItem() : nil
            }
        }
    }
    .simpleToast(item: $showToast, options: toastOptions) {
        HStack {
            Image(systemName: "exclamationmark.triangle")
            Text("This is some simple toast message.")
        }
        .padding()
        .background(Color.red.opacity(0.8))
        .foregroundColor(Color.white)
        .cornerRadius(10)
    }
}

 
ℹ️ This functionality is similar to the one of the SwiftUI sheet(item:onDismiss:content:)
 

Run code after dismissal

To run custom code after the toast disappeared you just have to pass a function to the onDismiss parameter:

import SwiftUI
import SimpleToast

struct ToastTestView: View {
    @State var showToast: Bool = false

    private let toastOptions = SimpleToastOptions(
        hideAfter: 5
    )

    VStack(spacing: 20) {
        Button("Show toast") {
            withAnimation {
                showToast.toggle()
            }
        }
    }
    .simpleToast(isShowing: $showToast, options: toastOptions, onDismiss: onToastComplete) {
        HStack {
            Image(systemName: "exclamationmark.triangle")
            Text("This is some simple toast message.")
        }
        .padding()
        .background(Color.red.opacity(0.8))
        .foregroundColor(Color.white)
        .cornerRadius(10)
    }

    // This will be called on toast completion
    func onToastComplete() -> Void {
        print("The toast did disappear")
    }
}

Usage with edgesIgnoringSafeArea(:edges:) / ignoresSafeArea(:edges:)

If the view you're attaching the toast to is ignoring a safe area, make sure to apply the SimpleToast modifier after the modifier for ignoring the safe area:

VStack {
    Text("Some view")
}
.ignoresSafeArea(.all)
.simpleToast(
    ...

Options

The toast can be configured via an optional SimpleToastOptions object. You can simply pass an empty object to configure the toast with default values.

 
📌 All parameters inside the options are optional. If not set, the default value will be taken.
 

Option	Type	Description	Default
alignment	Alignment	Defines the alignment of the toast.	.top
hideAfter	TimeInterval?	Defines when the toast disappears. If nil is given the toast won't disappear.	nil
backdrop	Color?	Defines the backdrop color	nil
animation	Animation	Defines the animation type.	.linear
modifierType	ModifierType	Defines the type of toast animation. Possible values: .slide, .fade	.fade
dismissOnTap	Bool?	Defines if the toast closes on tap. Possible values: true, false	true

simpletoast's Issues

Support ignoresSafeArea(_:edges:) modifier

Allow the user to configure if, how and which safe areas to ignore for the toast content.

Support custom views as backdrop

The option backdrop of SimpleToastOptions currently only supports the data type Color. It should be possible to use any type of view as a backdrop, so that a users can create and use their custom views as backdrop.

looks very simple

SimpleToast is blocking tvOS preview

For a multi platform projects, we can conditional link it to exclude tvOS in building and also use #canImport in Swift code.

This works fine for building and archiving. However this will cause an issue when previewing SwiftUI view on tvOS.

== PREVIEW UPDATE ERROR:

    SchemeBuildError: Failed to build the scheme ”Forumate”
    
    'DragGesture' is unavailable in tvOS
    
    Compile SimpleToast.swift (arm64):
    /Users/kyle/Library/Developer/Xcode/DerivedData/Forumate-cfcvrozqvmyfrfcrzfasktaukvys/SourcePackages/checkouts/SimpleToast/Sources/SimpleToast/SimpleToast.swift:30:9: error: 'DragGesture' is unavailable in tvOS
            DragGesture()
            ^~~~~~~~~~~

The pop -up speed is too slow

The pop -up speed is too slow, if it can be configured

Trigger the display before it is about to disappear, hideAfter is invalid, toast will always exist

Trigger the display before it is about to disappear, hideAfter is invalid, toast will always exist

iOS 13: Empty content

Attaching the toast to a view in iOS 13 results in empty content.
Researching the issue showed that wrapping the content inside any kind of stack inside the view modifier sets the content empty.

Can it be pod install？

as title

Toast Message Issue

The message in the toast does not change if we set the global variable for the toast message.

Toast wont disappear

This library used to work for me but ever since I made some slight changes, once the toast appear, it never leaves. These are the options im using:

private let toastOptions = SimpleToastOptions(alignment: .bottom, hideAfter: 4, showBackdrop: false, backdropColor: Color.clear, animation: .easeInOut, modifierType: .slide)

Modifier animation on dismiss not working when not set in options

If no animation is set inside the SImpleToastOptions struct, the toast disappears without any animation at all.

Timer not updated on Toast appear

Setting a timeout of X seconds for the toast and triggering it multiple times inside a timeframe X-n, where n > 0, the timer won't be updated and the toast disappears to early.

Example: Setting the timer to a timeout to hide of 5 seconds and triggering the toast after 2 seconds the second time, the toast will disappear after 3 seconds, instead of 5.

Dismiss action not triggered on tap

Tapping on a toast notification is not triggering the "dismiss" action, although the toast disappears.

Binding to item

It should be possible for the toast to be bound to an optional item, likewise to the sheet inside iOS, instead of just a binding to a boolean.

Dynamic content support

.simpleToast(item: $showToast, options: toastOptions) { HStack { Image(systemName: "exclamationmark.triangle") Text("This is some simple toast message.") } .padding() .background(Color.red.opacity(0.8)) .foregroundColor(Color.white) .cornerRadius(10) }

I need dynamic content support with item in. This doesn't work for me.

.simpleToast(item: $showToast, options: toastOptions) { item in HStack { Image(systemName: "exclamationmark.triangle") Text(item.message) } .padding() .background(Color.red.opacity(0.8)) .foregroundColor(Color.white) .cornerRadius(10) }

Toast not showing asynchronously fetched content

In case the content of the toast is fetched asynchronously, it is not being displayed inside the toast and instead just trigger an empty toast. Debugging the request shows that the content was fetched correctly, but is empty inside the toast view.

Example:

...

@State private var asyncMessage: String = ""

... 

Button("Trigger async action") {
    withAnimation {
        let url = URL(string: "https://jsonplaceholder.typicode.com")!
        URLSession.shared.dataTask(with: url) { data, response, error in
            DispatchQueue.main.async {
                asyncMessage = String(data: data!, encoding: .utf8)!
                print(asyncMessage)
                showToastAsync = !asyncMessage.isEmpty
            }
        }
        .resume()
    }
}

... 

.simpleToast(isShowing: $showToastAsync, options: optionsScale) {
    Text(asyncMessage)
}

Animation duration not working on dismiss

Setting a duration with the animation inside SimpleToast options has no effect on the dismissal of the toast. The duration only works for displaying the toast.