如何使 Rectangle() 和 DatePicker 重叠？

Question

所以我试图移动矩形，使其看起来像 DatePicker() UI 元素底部有一个小点：

import SwiftUI

struct TimeSelectorView: View {
    @State private var selectedDay: Date = Date()
    var body: some View {
        VStack {
            DatePicker(selection: $selectedDay, in: Date()..., displayedComponents: .date) {
                Text("")
            }.frame(width: UIScreen.main.bounds.width * 0.75)
             .clipped()
             .background(Color.white)
             .cornerRadius(15)
            Rectangle()
            .fill(Color.white)
            .frame(width: 25, height: 25)
            .rotationEffect(Angle(degrees: 45))
            .padding(.bottom, 15)
        }
    }
}

Answer 1

要创建重叠视图，您可以使用 ZStack。

SwiftUI has a dedicated stack type for creating overlapping content, which is useful if you want to place some text over a picture for example. It’s called ZStack, and it works identically to the other two stack types [HStack, VStack].

在下面的示例中，DatePicker 将放在 Rectangle 后面：

ZStack {
    DatePicker(...)
    Rectangle()
}

您可以在本教程中找到更多信息：How to layer views on top of each other using ZStack?

如何使 Rectangle() 和 DatePicker 重叠？

How to make a Rectangle() and a DatePicker overlap?

positioning

overlap

swift

swiftui