iOS的ProgressBar 13

debugcn 发表于 Dev

布拉姆

我尝试创建自己的设备ProgressView来支持iOS 13，但是由于某种原因，它似乎无法正常工作。我试过@State，@Binding和平原var progress: Progress，但它并没有在所有的更新。

struct ProgressBar: View {
    @Binding var progress: Progress

    var body: some View {
        VStack(alignment: .leading) {
            Text("\(Int(progress.fractionCompleted))% completed")
            ZStack {
                RoundedRectangle(cornerRadius: 2)
                    .foregroundColor(Color(UIColor.systemGray5))
                    .frame(height: 4)
                GeometryReader { metrics in
                    RoundedRectangle(cornerRadius: 2)
                        .foregroundColor(.blue)
                        .frame(width: metrics.size.width * CGFloat(progress.fractionCompleted))
                }
            }.frame(height: 4)
            Text("\(progress.completedUnitCount) of \(progress.totalUnitCount)")
                .font(.footnote)
                .foregroundColor(.gray)
        }
    }
}

在内容视图中，我添加了支持iOS 14的iOS 14版本和支持iOS 13的iOS 13版本。它们看起来相同，但iOS 13变体没有任何改变。

struct ContentView: View {
    @State private var progress = Progress(totalUnitCount: 10)
    let timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect()

    var body: some View {
        VStack {
            ProgressBar(progress: $progress)
                .padding()
                .onReceive(timer) { timer in
                    progress.completedUnitCount += 1
                    if progress.isFinished {
                        self.timer.upstream.connect().cancel()
                        progress.totalUnitCount = 500
                    }
                }
            if #available(iOS 14, *) {
                ProgressView(progress)
                    .padding()
                    .onReceive(timer) { timer in
                        progress.completedUnitCount += 1
                        if progress.isFinished {
                            self.timer.upstream.connect().cancel()
                            progress.totalUnitCount = 500
                        }
                    }
            }
        }
    }
}

iOS 14变体有效，但是我的iOS 13实现失败。有人可以帮我吗？

他的脾气

进度是-NSObject，它不是结构，因此状态对其不起作用。您必须使用KVO来观察Progress中的更改，然后重定向到SwiftUI视图的真实来源。

这是可能解决方案的简化演示。经过Xcode 12.1 / iOS 14.1测试

class ProgressBarViewModel: ObservableObject {
    @Published var fractionCompleted: Double
    let progress: Progress
    private var observer: NSKeyValueObservation!
    
    init(_ progress: Progress) {
        self.progress = progress
        self.fractionCompleted = progress.fractionCompleted
        observer = progress.observe(\.completedUnitCount) { [weak self] (sender, _) in
            self?.fractionCompleted = sender.fractionCompleted
        }
    }
}

struct ProgressBar: View {
    @ObservedObject private var vm: ProgressBarViewModel
    
    init(_ progress: Progress) {
        self.vm = ProgressBarViewModel(progress)
    }
    
    var body: some View {
        VStack(alignment: .leading) {
            Text("\(Int(vm.fractionCompleted * 100))% completed")
            ZStack {
                RoundedRectangle(cornerRadius: 2)
                    .foregroundColor(Color(UIColor.systemGray5))
                    .frame(height: 4)
                GeometryReader { metrics in
                    RoundedRectangle(cornerRadius: 2)
                        .foregroundColor(.blue)
                        .frame(width: metrics.size.width * CGFloat(vm.fractionCompleted))
                }
            }.frame(height: 4)
            Text("\(vm.progress.completedUnitCount) of \(vm.progress.totalUnitCount)")
                .font(.footnote)
                .foregroundColor(.gray)
        }
    }
}

和更新的呼叫位置以使用相同的构造函数

struct ContentView: View {
    @State private var progress = Progress(totalUnitCount: 10)
    let timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect()

    var body: some View {
        VStack {
            ProgressBar(progress)      // << here !!

// ... other code

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。