binding - 如何在 View 中翻译绑定(bind)？

Question

我已经创建了一个用于设置时间(分钟和秒)的 View 。它使用绑定(bind)到两个状态变量的两个轮式选择器。

现在我想在应用程序的不同位置使用该 View ，但当时我不喜欢带有两个单独变量的界面。相反，我希望只有一个绑定(bind)变量以秒为单位保存时间(因此 time = 185 将转换为 3 分 5 秒)。

是否可以在绑定(bind)之间使用某种“适配器”？

这是 View :

import SwiftUI

struct TimePicker: View {
    var minutes: Binding<Int>
    var seconds: Binding<Int>

    var body: some View {
        HStack() {
            Spacer()
            Picker(selection: minutes, label: EmptyView()) {
                ForEach((0...9), id: \.self) { ix in
                    Text("\(ix)").tag(ix)
                }
                }.pickerStyle(WheelPickerStyle()).frame(width: 50).clipped()
            Text("Min.")
            Picker(selection: seconds, label: EmptyView()) {
                ForEach((0...59), id: \.self) { ix in
                    Text("\(ix)").tag(ix)
                }
                }.pickerStyle(WheelPickerStyle()).frame(width: 50).clipped()
            Text("Sec.")
            Spacer()
        }
    }
}

Answer 1

这是基于 Binding(get:set:)

的方法

struct TimePicker: View {
    @Binding var total: Int
    
    var minutes: Binding<Int> {
        Binding<Int>(get: { self._total.wrappedValue / 60 },
                     set: { self._total.wrappedValue = self._total.wrappedValue % 60 + $0 * 60 })
    }

    var seconds: Binding<Int> {
        Binding<Int>(get: { self._total.wrappedValue % 60 },
                     set: { self._total.wrappedValue = (self._total.wrappedValue / 60) * 60 + $0 })
    }
    
    var body: some View {
        HStack() {
            Spacer()
            Picker(selection: minutes, label: EmptyView()) {
                ForEach((0...9), id: \.self) { ix in
                    Text("\(ix)").tag(ix)
                }
            }.pickerStyle(WheelPickerStyle()).frame(width: 50).clipped()
            Text("Min.")
            Picker(selection: seconds, label: EmptyView()) {
                ForEach((0...59), id: \.self) { ix in
                    Text("\(ix)").tag(ix)
                }
                }.pickerStyle(WheelPickerStyle()).frame(width: 50).clipped()
            Text("Sec.")
            Spacer()
        }.frame(height: 200)
    }
}

struct TestTimePicker: View {
    
    @State var seconds = 185
    var body: some View {
        VStack {
            Text("Current: \(seconds)")
            TimePicker(total: $seconds)
        }
    }
    
}