堆栈中的 SwiftUI TextField 锁定无法访问

如何解决堆栈中的 SwiftUI TextField 锁定无法访问

经过一段时间的故障排除（并将整个视图剥离到测试文件中），导致堆栈中的文本字段“锁定”或无法访问，我发现这是堆栈中的一些修饰符存在。在这种情况下，是因为 .Shadow

据了解，一些修饰符适用于修改后的视图中的每个视图。但这应该很酷。

因此我知道什么，但有人知道为什么吗？

@State private var tempName: String = ""
@State private var tempSurname: String = ""
@State private var tempPhone: String = ""

var body: some View {

        vstack  { //Stack 1
            Text("Please provide your details")
                vstack (spacing: 16) {
                       #warning ("check out why below textfields wont accept interaction")
                            TextField("User Name",text: $tempName)
                            TextField("User Surname",text: $tempSurname)
                            TextField("User Phone",text: $tempPhone)
                  }
                  .padding(.horizontal,8)
                  .padding(.vertical,16)
                  .shadow(radius: 8,x: 2,y: 4)
       }
}

解决方法

据了解，一些修饰符适用于修改后的视图内的每个视图

确实如此。

但是，您可以使用 compositingGroup 将修饰符应用于仅最外层视图：

VStack(spacing: 16) {
    // ...
}
.padding(.horizontal,8)
.padding(.vertical,16)
.compositingGroup() // add before `shadow`
.shadow(radius: 8,x: 2,y: 4)

这是直接取自文档的非常好的解释：

/// Wraps this view in a compositing group.
///
/// A compositing group makes compositing effects in this view's ancestor
/// views,such as opacity and the blend mode,take effect before this view
/// is rendered.
///
/// Use `compositingGroup()` to apply effects to a parent view before
/// applying effects to this view.
///
/// In the example below the `compositingGroup()` modifier separates the
/// application of effects into stages. It applies the ``View/opacity(_:)``
/// effect to the VStack before the `blur(radius:)` effect is applied to the
/// views inside the enclosed ``ZStack``. This limits the scope of the
/// opacity change to the outermost view.
///
///     VStack {
///         ZStack {
///             Text("CompositingGroup")
///                 .foregroundColor(.black)
///                 .padding(20)
///                 .background(Color.red)
///             Text("CompositingGroup")
///                 .blur(radius: 2)
///         }
///         .font(.largeTitle)
///         .compositingGroup()
///         .opacity(0.9)
///     }
///
/// ![A view showing the effect of the compositingGroup modifier in applying
/// compositing effects to parent views before child views are
/// rendered.](SwiftUI-View-compositingGroup.png)
///
/// - Returns: A view that wraps this view in a compositing group.
@inlinable public func compositingGroup() -> some View