SwiftUI：如何从“查找我的”应用程序实现向上滑动视图

Question

我想在我的应用程序中使用 swiftui 从苹果“查找我的”应用程序中实现这个“向上滑动视图”。 有谁知道这是如何工作的或我可以寻找什么？ 此致

Answer 1

从 iOS 16 开始，您可以使用presentationDetents(_:)修饰符来实现这些。

有关示例，请参阅本文。

Answer 2

是的，展示一张纸并不完全相同，并且没有内置的 SwiftUI 视图可以做到这一点。

以下是正确方向的一些指示：

1

尝试使用 ZStack 作为基本结构：

ZStack(alignment: .bottom) {
    mapView
    sheetView
}

工作表漂浮在 map 上方并与底部对齐（您可以根据需要使用.frame(height:)设置其高度）。 mapView 应该是全高，因为工作表背景是半透明的

2

工作表背景可能如下所示：

    // Sheet background:
    RoundedRectangle(cornerRadius: 18, style: .continuous)
        .fill(.regularMaterial)
        .edgesIgnoringSafeArea(.bottom)
    .overlay {
    // Handle
    Capsule()
        .fill(.ultraThinMaterial)
        .colorScheme(.dark)
        .frame(width: 60, height: 8)
        .padding()
}

3

您可以使用拖动手势开始处理实施制动器：

    @State var sheetHeight = 300.0

// in body:
    sheetView
        .frame(height: sheetHeight)
        .gesture(DragGesture(minimumDistance: 1)
            .onChanged{ v in
                sheetHeight = 300 - v.translation.height
            }
            .onEnded{ _ in
                sheetHeight = 300
            }
        )

从那里开始，地图有很多行为：自定义定位、内容在顶部定位转换为可滚动、图标显示和隐藏、map 平移时切换定位等。

做这些事情并没有内置的魔法——它只是自定义 UI 工作。 没有理由你不能在 SwiftUI （或 UIKit 如果你愿意）中实现它。 玩得开心！