在输入和展开时使文本字段重叠文本答案

【问题标题】：Make Textfield overlap text when input in entered and expanded在输入和展开时使文本字段重叠文本
【发布时间】：2021-09-13 19:30:24
【问题描述】：

我正在尝试这样做，当我的“搜索字段”（带框架的文本字段）扩展时，我希望它与文本/按钮重叠。但相反，它会按下文本/按钮。

我该如何更改？我正在研究一些 GeometryReader，但我的专业知识还没有达到那么高。

类

struct SearchView: View {

@ObservedObject var allGames = SearchController()

var body: some View {
    
    NavigationView{
        ZStack(alignment: .top) {
            Color("Color").edgesIgnoringSafeArea(.all)
            
            VStack{
                
                SearchBar(data: self.allGames.allGames)
                    .padding(.top) <--- This needs to overlap RandomGameView when expanded
                
                RandomGameView()
                    .padding(.top)

            }
        }
        .navigationBarTitle("Search")
        .padding(.top, -20)
    }
    .navigationViewStyle(StackNavigationViewStyle())
    .listStyle(PlainListStyle())
  }
}

【问题讨论】：

对于重叠，你需要使用 ZStack 而不是 VStack，在后者中，当上视图展开时，下视图将始终向下移动。

标签： swift swiftui overlap

【解决方案1】：

如果它们在同一个 V 或 HStack 中，当一个视图增长时，它将推送该堆栈中的所有其他视图，因此如果您希望它越过顶部，请将其放入 ZStack 中。

NavigationView{
    ZStack(alignment: .top) {
        Color("Color").edgesIgnoringSafeArea(.all)
        
        ZStack(alignment: .top) { // Make this a top aligned ZStack.
            
            SearchBar(data: self.allGames.allGames)
                .padding(.top)
            
            RandomGameView()
                .padding(.top)

        }
    }
    .navigationBarTitle("Search")
    .padding(.top, -20)
}
.navigationViewStyle(StackNavigationViewStyle())
.listStyle(PlainListStyle())

【讨论】：