SwiftUI中的警报+进度视图(活动指示器)

h4cxqtbf  于 2023-02-28  发布在  Swift
关注(0)|答案(3)|浏览(114)

有没有办法在SwiftUI Alert中添加活动视图(指示器)?我只是好奇,因为我还没有找到任何合适的答案。我需要这样的东西:

我使用的是iOS 14 SwiftUI警报,可选状态符合Identifiable。在UIKit UIAlertController中有一种方法可以将子视图添加到警报视图中。对此有什么想法吗,提前感谢。

fnatzsnv

fnatzsnv1#

我不得不在一个应用程序中使用类似的东西,基本上不可能使用原生SwiftUI .alert API。

  • 使用自定义UIAlertController
  • 制作一个自定义覆盖图来完成您想要的功能

因此,我创建了CustomAlert,这样我就可以轻松地使用自定义内容创建警报。它本质上是在SwiftUI中重新创建警报,并为它公开一个类似的API。

.customAlert(isPresented: $alertShown) {
    HStack(spacing: 16) {
        ProgressView()
            .progressViewStyle(.circular)
            .tint(.blue)
        Text("Processing...")
            .font(.headline)
    }
} actions: {
    Button(role: .cancel) {
        // Cancel Action
    } label: {
        Text("Cancel")
    }
}
cld4siwp

cld4siwp2#

为了最大限度地控制警报弹出窗口的内容和行为,我建议您创建自己的警报弹出窗口

struct ContentView: View {
    var alertShown: Bool = false
    var body: some View {
        ZStack {
            VStack {
                // your main view
            }
            .blur(radius: alertShown ? 15 : 0)
            if alertShown {
                AlertView()
            }
        }
    }
}

struct AlertView: View {
    var body: some View {
        ZStack {
            RoundedRectangle(cornerRadius: 6)
                .foregroundColor(.blue)
            VStack {
                HStack {
                    ProgressView()
                    Text("Processing...")
                }
                Button(action: {
                    // action
                }, label: {
                    Text("Cancel")
                })
                .foregroundColor(.black)
            }
        }
    }
}
jdgnovmf

jdgnovmf3#

为了避免SPM依赖性,我在项目中创建了ProgressAlert,所以正如我在hallo's post的注解中提到的,我想与您分享以下代码:

import SwiftUI

public struct ProgressAlert: View {
    public var closeAction: () -> Void

    public init(closeAction: @escaping () -> Void) {
        self.closeAction = closeAction
    }

    public var body: some View {
        ZStack {
            VStack(spacing: 14) {
                HStack(spacing: 20) {
                    ProgressView()
                        .scaleEffect(1.5)
                        .progressViewStyle(CircularProgressViewStyle(tint: Color(UIColor(red: 0.05, green: 0.64, blue: 0.82, alpha: 1))))
                    Text("Processing...")
                        .font(.system(size: 16, weight: .semibold))
                        .foregroundColor(.black)
                }
                Divider()
                Button(action: closeAction, label: {
                    Text("Cancel")
                        .font(.headline)
                        .foregroundColor(Color(UIColor(red: 0.05, green: 0.64, blue: 0.82, alpha: 1)))
                })
                .foregroundColor(.black)
            }
            .padding(.vertical, 25)
            .frame(maxWidth: 270)
            .background(BlurView(style: .systemMaterial))
            .cornerRadius(20)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(
            Color.primary.opacity(0.35)
        )
        .edgesIgnoringSafeArea(.all)
    }
}

public struct BlurView: UIViewRepresentable {
    public var style: UIBlurEffect.Style

    public func makeUIView(context: Context) -> UIVisualEffectView {
        let view = UIVisualEffectView(effect: UIBlurEffect(style: style))
        return view
    }

    public func updateUIView(_ uiView: UIVisualEffectView, context: Context) {}
}

public struct ProgressAlert_Previews: PreviewProvider {
    static public var previews: some View {
        ProgressAlert(closeAction: {
            print("")
        })
    }
}

下面是它的外观:

相关问题