简体   繁体   English

在 SwiftUI 中点击 TextField 时出现键盘错误

[英]Keyboard bug when tapping on TextField in SwiftUI

I have a Main View that contains multiple Views and picks one based on the value change of a variable in a ObservabledObject, which change on buttons press.我有一个包含多个视图的主视图,并根据 ObservabledObject 中变量的值变化选择一个,该值在按下按钮时发生变化。

The problem comes when I select a View that contains input fields, in that case, when I tap on a TextField, instead of showing the keyboard, it takes me back to the Homepage View.当我 select 包含输入字段的视图时,问题就出现了,在这种情况下,当我点击文本字段时,它没有显示键盘,而是将我带回主页视图。

It only happens on devices, not on simulators.它只发生在设备上,而不是模拟器上。

Though, it works if you set that specific view (the one with TextField) as Main View (the first case in the Switch).但是,如果您将该特定视图(带有 TextField 的视图)设置为主视图(Switch 中的第一种情况),它就可以工作。

Here's the ObservableObject Code:这是 ObservableObject 代码:

class Watcher : ObservableObject {
    @Published var currentView: String = "home"
}

Main View:主视图:

import SwiftUI

struct MainView : View {
    var body: some View {
        
        GeometryReader { geometry in
            ZStack (alignment: .leading){
                HomepageView()
                    .frame(width: geometry.size.width, height: geometry.size.height)
            }
        }
    }
}

struct HomepageView : View {
    @ObservedObject var watcher = Watcher()
    
    init(){
        UITabBar.appearance().isHidden = true
        JSONHandler.fetchData(webService: "https://myWebsite.com/app/request.php") {
            print("loaded")
        }
    }
    
    var body: some View {
        ZStack {
            VStack {
                TabView {

                    switch self.watcher.currentView {
                    case "home":                                       //STARTING CASE
                        NavigationView {
                            DailyMenuView()
                                .navigationTitle("Recipes APP")
                                .navigationBarTitleDisplayMode(.inline)
                        }
                        .opacity(self.watcher.currentView == "newRecipe" ? 0 : 1)

                    case "innerMenu":
                        InnerMenuView(watcher: watcher)

                    case "members":
                        MembersView(watcher: watcher)

                    case "recipe":
                        RecipeView(watcher: watcher)

                    case "newRecipe":                                  //TextField View
                        TestView()

                    default:
                        Text("Error")
                    }
                }
            }
            
            VStack {
                Spacer()
                
                MenuTabView(watcher: watcher)
            }                
            .edgesIgnoringSafeArea(.bottom)
            
        }
        .environment(\.colorScheme, self.watcher.currentView == "home" ? .dark : .light)
        
    }
}

struct MainView_Previews: PreviewProvider {
    static var previews: some View {
        MainView()
    }
}

And last, the View containing TextField:最后,包含 TextField 的视图:

import SwiftUI

struct TestView: View {
    @State var text: String = ""
    
    var body: some View {
        VStack {
            Text("TEST VIEW")
                .font(.largeTitle)
                .fontWeight(.bold)
            
            Spacer()
            
            TextField("Write here", text: $text)
                .font(.title)
                .padding()
                .border(Color.red, width: 2)
            
            Spacer()
        }
    }
}

struct TestView_Previews: PreviewProvider {
    static var previews: some View {
        TestView()
    }
}

Hope you can help me solve this mess!希望你能帮我解决这个烂摊子!

If you need more information, ask me.如果您需要更多信息,请询问我。

You need to use tag and selection.您需要使用标签和选择。

TabView(selection: $watcher.currentView) { // < === Here
    
    switch self.watcher.currentView {
    case "home":                                       //STARTING CASE
        NavigationView {
            DailyMenuView()
                .navigationTitle("Recipes APP")
                .navigationBarTitleDisplayMode(.inline)
        }
        .opacity(self.watcher.currentView == "newRecipe" ? 0 : 1)
        .tag("home") // < === Here
        
    case "innerMenu":
        InnerMenuView(watcher: watcher)
            .tag("innerMenu") // < === Here
    case "members":
        MembersView(watcher: watcher)
            .tag("members") // < === Here
        
    case "recipe":
        RecipeView(watcher: watcher)
            .tag("recipe") // < === Here
    case "newRecipe":                                  //TextField View
        TestView()
            .tag("newRecipe") // < === Here
        
    default:
        Text("Error")
    }
}

I solved moving:我解决了移动:

@ObservedObject var watcher = Watcher()

Inside the Main View as it follows:在主视图中如下所示:

struct MainView : View {
    @ObservedObject var watcher = Watcher()

    var body: some View {            
        GeometryReader { geometry in
            ZStack (alignment: .leading){
                HomepageView()
                    .frame(width: geometry.size.width, height: geometry.size.height)
            }
        }
    }
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM