ToastSwiftUI 0.3.6

ToastSwiftUI 0.3.6

Nguyen Cong Huy 维护。



ToastSwiftUI

在 SwiftUI 中显示 toast 或弹窗的简单方式

关于

SwiftUI 是 Apple 在 2019 年为 iOS 开发者带来的伟大事物。但它仍然没有提供一种显示 toast,即短时间消息的方式。Toast 消息在 iOS 应用程序中非常流行,即使它不是一个原生视图。这个 ToastSwiftUI 开源项目可以帮助您轻易地做到这一点。

显示弹窗的方式相同,不难,但没有相关的原生 API。这个开源项目也帮助了您。

Demo ToastSwiftUI

示例

要运行示例项目,请克隆仓库,然后首先从示例目录中运行 pod install

要求

  • Swift 5.0 或更高版本
  • iOS 13 或更高版本

安装

Cocoapod

ToastSwiftUI 通过 CocoaPods 提供使用。要安装它,只需将以下行添加到您的 Podfile 中:

pod 'ToastSwiftUI'

然后在命令行中运行 pod install

Swift Package Manager

在 Xcode 中,选择菜单文件 -> Swift Packages -> 添加包依赖项。选择一个目标,然后向输入字段添加此链接::https://github.com/huynguyencong/ToastSwiftUI.git

手册

有时您不想使用 Cocoapod 进行安装。在这种情况下,您需要手动添加它。这很简单,只需将 ToastSwiftUI/Classes 中的 Swift 文件添加到您的项目中。

使用

显示一个弹出窗口

  • 第一步:添加一个 @State 变量来控制何时显示弹出窗口。
@State private var isPresentingPopup = false
  • 第二步:将 popup 修饰符添加到带有步骤 1 中绑定变量的视图中。 MyPopup 是您想要显示为弹出窗口的视图。如果您对弹出窗口视图的内建大小满意,则无需设置框架。
.popup(isPresenting: $isPresentingPopup, overlayColor: Color.black.opacity(0.4)) {
    MyPopup(isPresenting: $isPresentingPopup)
        .frame(width: 300, height: 500)         // it is not required
}
  • 第3步:通过在步骤1中设置变量为true来显示toast。您也可以将其设置为false来关闭它
self.isPresentingPopup = true

显示一个toast

  • 第1步:添加一个@State变量以控制何时显示toast。
@State private var isPresentingToast = false
  • 第2步:将toast修饰符添加到具有步骤1中绑定变量的视图。
.toast(isPresenting: $isPresentingToast, message: "Success", icon: .success)
  • 第3步:通过在步骤1中设置变量为true来显示toast。您也可以将其设置为false来关闭它
self.isPresentingPopup = true

带有消息状态变量的显示toast

  • 第1步:添加一个可选的String @State变量。当此可选变量具有值时,将触发toast。
@State private var toastMessage: String?
  • 第2步:添加toast修饰符,将上述消息变量的Binding ($)作为第一个参数传递。
.toast($toastMessage)
  • 第3步:通过将步骤1中的变量设置为String来显示toast。您也可以将其设置为nil来关闭它
toastMessage = "Hello world!"

请查看下面的完成代码,其中包含3个示例,以显示以不同方式显示toast和弹出窗口

import SwiftUI
import ToastSwiftUI

struct ContentView: View {
    // 1.1. Example 1: Add @State variables to control when showing the popup
    @State private var isPresentingPopup = false
    
    // 1.2. Example 2: First way to show a toast. Add @State variables to control when showing the toast
    @State private var isPresentingToast = false
    
    // 1.3. Example 3: Second way to show a toast. Add an optional String @State variables to control when showing the toast
    @State private var toastMessage: String?
    
    @State private var count = 0
    
    var body: some View {
        VStack(spacing: 20) {
            Button("Show a success toast with a boolean variable") {
                // 3.2.1. Set state variable to true if you want to show the toast
                self.isPresentingToast = true
            }
            
            Button("Dismiss the success toast") {
                // 3.2.2. Set state variable to false if you want to hide the toast
                self.isPresentingToast = false
            }
            
            Divider()
            
            Button("Show toast with a text binding") {
                // 3.3.1. Set text variable you want to show
                toastMessage = "Toast number \(count)"
                
                count += 1
            }
            
            Button("Dismiss toast") {
                // 3.3.2. Set text variable to nil
                self.toastMessage = nil
            }
            
            Divider()
            
            Button("Show popup") {
                // 3.1.1. Set state variable to true if you want to show the popup
                self.isPresentingPopup = true
            }
            
            Button("Dismiss popup") {
                // 3.1.2. Set state variable to true if you want to hide the popup
                self.isPresentingPopup = false
            }
            
            Spacer()
        }
        .padding()
        
        // 2.1. Add a `popup` modifier to your view with the binding variable in step 1
        .popup(isPresenting: $isPresentingPopup, popup:
            MyPopup(isPresenting: $isPresentingPopup)
                .background(Color(.systemBackground))
        )
        
        // 2.2. Add a `toast` modifier to your view with the binding variable in step 1
        .toast(isPresenting: $isPresentingToast, message: "Success", icon: .success)
        
        // 2.3. Add a `toast` modifier to your view with the binding variable in step 1
        .toast($toastMessage)
    }
}

自定义

popup修饰符参数

  • autoDismiss

    • none:不自动关闭,您需要手动关闭。
    • after(时间间隔):您传递的时间长度后自动关闭。
    • auto(字符串):根据显示的文本计算持续时间后自动关闭。
  • hasShadow

  • cornerRadius

  • overlayColor

  • isTapOutsideToDismiss

toast修饰符参数

  • autoDismiss

    • none:不自动关闭,您需要手动关闭。
    • after(时间间隔):您传递的时间长度后自动关闭。
    • auto:根据显示的文本计算时间后自动关闭。
  • icon

    • info
    • error
    • success
    • custom(图像):显示作为您提供的图像的图标。
    • loading:显示旋转加载指示器作为图标。
  • 背景颜色

  • 文本颜色

UIKit 版本

EzPopup for UIKit

作者

Huy Nguyen, [email protected]

许可协议

ToaSwiftUI 允许使用 MIT 许可协议。有关更多信息,请参阅 LICENSE 文件。