【问题标题】:Is it possible to hide the DatePicker's calendar when you tap a date?点击日期时是否可以隐藏 DatePicker 的日历?
【发布时间】:2021-11-29 15:17:48
【问题描述】:

我有一个基本的 SwiftUI 日期选择器,点击时会显示一个日历小部件:

DatePicker(
  "Date",
  selection: $date,
  in: ...Date(),
  displayedComponents: [.date]
)

当您选择一个日期(上例中为 10 月 8 日)时,日历会保留在屏幕上,要折叠它,您需要在其外部点按。

是否可以在选择日期时自动折叠它?

【问题讨论】:

  • 不能单独使用DatePicker。您可以将图形日期选择器样式显示为sheetZStack,并在onChange 时隐藏date
  • 感谢您的建议,@lorem-ipsum 但就我而言,我在下面发布的一个相当丑陋的黑客似乎是较小的邪恶。首先,它允许我使用单个原生DatePicker 视图,而不是手动构建触发器,然后使用GraphicalDatePickerStyle 启动另一个层。其次,扩展的日历相当不显眼,因为它很好地位于其后面的内容之上(就像一个绝对定位的 HTML/CSS 层在另一层之上),并且不会将其余内容推到页面下方。跨度>

标签: swiftui datepicker


【解决方案1】:

@chris.kobrzak 提供了一个很好的方向,我最终解决了这个问题:

struct ContentView: View {
    @State var calendarId: UUID = UUID()
    @State var someday: Date = Date()
    
    var body: some View {
        VStack {
            DatePicker("Day", selection: $someday, displayedComponents: [.date])
                .labelsHidden()
                .id(calendarId)
                .onChange(of: whatday) { _ in
                    calendarId = UUID()
                }
            AnotherView(someday)
        }
    }
}

【讨论】:

  • onTapGesture 的删除破坏了预期的行为 - 当您在我的应用程序中点击日期时,日历小部件不再折叠。我也不相信将calendarId 的类型从Int 更改为UUID,因为生成ID 是一项更昂贵的操作。尽管如此,我还是喜欢 onChange 调用的简写符号(不需要 perform 标签)。
  • @ChrisKobrzak 我对 UUID 感觉更好,因为我知道你最终可能会溢出 Int ......尽管这极不可能。我不确定为什么我们会看到 onTapGesture 有所不同。我希望能再深入一点。
  • 这也没有任何更新的答案?
【解决方案2】:

我最终得到了一个似乎可以完成这项工作的相当老套的解决方案:

添加一个保存日历 ID 的 @State 变量:

@State private var calendarId: Int = 0

DatePicker 调用与.id.onChange.onTapGesture 操作链接起来:

DatePicker(
  "Date", selection: $date, in: ...Date(), displayedComponents: [.date]
)
.id(calendarId)
.onChange(of: date, perform: { _ in
  calendarId += 1
})
.onTapGesture {
  calendarId += 1
}

【讨论】:

  • 从 Xcode 13.2 / iOS 15 开始,.onTapGesture 给我留下了 NSInternalInconsistencyException。但是,将其排除在外对我来说很好。
  • @jason-farnsworth,我无法在 Xcode 13.2.1 中重现此异常。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2020-01-10
  • 1970-01-01
  • 2022-01-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多