微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

SwiftUI 中是否支持 TimePicker小时、分钟、秒之类的东西?

如何解决SwiftUI 中是否支持 TimePicker小时、分钟、秒之类的东西?

我正在尝试实现类似 iOS Timer App 时间选择器控件的功能

enter image description here

我已经研究过 DatePicker,但它没有秒视图。

解决方法

经过一段时间的调查,结果证明唯一的解决方案是从头开始编写。我把它贴在这里给有同样问题的人:

import SwiftUI

struct MultiComponentPicker<Tag: Hashable>: View  {
    let columns: [Column]
    var selections: [Binding<Tag>]
    
    init?(columns: [Column],selections: [Binding<Tag>]) {
        guard !columns.isEmpty && columns.count == selections.count else {
            return nil
        }
        
        self.columns = columns
        self.selections = selections
    }
    
    var body: some View {
        GeometryReader { geometry in
            HStack(spacing: 0) {
                ForEach(0 ..< columns.count) { index in
                    let column = columns[index]
                    ZStack(alignment: Alignment.init(horizontal: .customCenter,vertical: .center)) {
                        if (!column.label.isEmpty && !column.options.isEmpty) {
                            HStack {
                                Text(verbatim: column.options.last!.text)
                                    .foregroundColor(.clear)
                                    .alignmentGuide(.customCenter) { $0[HorizontalAlignment.center] }
                                Text(column.label)
                            }
                        }
                        Picker(column.label,selection: selections[index]) {
                            ForEach(column.options,id: \.tag) { option in
                                Text(verbatim: option.text).tag(option.tag)
                            }
                        }
                        .pickerStyle(WheelPickerStyle())
                        .frame(width: geometry.size.width / CGFloat(columns.count),height: geometry.size.height)
                        .clipped()
                    }
                    
                }
            }
        }
    }
}

extension MultiComponentPicker {
    struct Column {
        struct Option {
            var text: String
            var tag: Tag
        }
        
        var label: String
        var options: [Option]
    }
}

private extension HorizontalAlignment {
    enum CustomCenter: AlignmentID {
        static func defaultValue(in context: ViewDimensions) -> CGFloat { context[HorizontalAlignment.center] }
    }
    
    static let customCenter = Self(CustomCenter.self)
}

// MARK: - Demo preview
struct MultiComponentPicker_Previews: PreviewProvider {
    static var columns = [
        MultiComponentPicker.Column(label: "h",options: Array(0...23).map { MultiComponentPicker.Column.Option(text: "\($0)",tag: $0) }),MultiComponentPicker.Column(label: "min",options: Array(0...59).map { MultiComponentPicker.Column.Option(text: "\($0)",MultiComponentPicker.Column(label: "sec",]
    
    static var selection1: Int = 23
    static var selection2: Int = 59
    static var selection3: Int = 59
    
    static var previews: some View {
        MultiComponentPicker(columns: columns,selections: [.constant(selection1),.constant(selection2),.constant(selection3)]).frame(height: 300).previewLayout(.sizeThatFits)
    }
}

这是它的样子:

enter image description here

我已经把它变得非常通用,所以你可以将它用于任何类型的多组件选择器,而不仅仅是时间选择器。

解决方案的基础归功于 Matteo Pacini。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?