SwiftUI Rectangle 突然变成 RoundedRectangle

Question

我刚刚开始学习 SwiftUI 并且正在玩视图和动画，我想让 controller 有点像苹果在控制中心的音量或亮度。 但我发现有趣的小东西，我真的不知道该怎么办。

struct DragControler: View {
    @GestureState var fillPercentGS : Double = 0.5
    @State var fillPercent = 0.5
    var body: some View {
        ZStack{

            Rectangle()
            GeometryReader { geometry in
                VStack(spacing: 0) {
                    Rectangle().foregroundColor(.red) //these rects
                    Rectangle().foregroundColor(.green).frame(height: geometry.size.height * CGFloat(self.fillPercent))
                }.gesture(DragGesture(coordinateSpace: .local).updating(self.$fillPercentGS, body: { (value, state, transaction) in
                    state =  Double(value.location.y/geometry.size.height)

                }).onChanged({ (value) in
                    self.fillPercent = max(0, min(1 - Double(value.location.y/geometry.size.height), 1))
                }))
            }
            Text("\(fillPercent)").foregroundColor(.white)
            }.cornerRadius(50).aspectRatio(1/4, contentMode: .fit).padding()
    }
}

GIF 当其中一个矩形填满整个视图时，它会变成圆形

因此，正如您在 gif 上看到的那样，当我将它一直拖到顶部或底部时，代码中明确表示为 Rectangles 的 Rectangles 变为圆角矩形

那么，为什么会这样呢？ 我试图用 clipShape(RoundedRect(...)) 替换 .cornerRadius() 修饰符，但它没有帮助。 但我发现它有助于将这些矩形的角半径显式设置为零。

Rectangle().cornerRadius(0).foregroundColor(.red)
Rectangle().cornerRadius(0).foregroundColor(...)

我的猜测是 swiftUI 在后台做的有点优化

提前致谢

Answer 1

对我来说它看起来像一个错误，但有一个简单的修复。 只需将绿色矩形的角半径显式设置为 0：

Rectangle().foregroundColor(.green).frame(height: geometry.size.height * CGFloat(self.fillPercent)).cornerRadius(0)