SwiftUI – 以编程方式更改TabView的焦点

huangapple go评论50阅读模式
英文:

SwiftUI - Programatically changing the TabView focus

问题

I have a SwiftUI TabView that calls 5 separate views: Location, Calculate etc.

这是一个SwiftUI TabView,调用了5个不同的视图,包括位置(Location)、计算(Calculate)等。

These work perfectly. But some views are called programmatically within the App. So, for example, when you have chosen your Location you move to the Calculate view. When I do this how would I programmatically tell it to move the TabView focus onto the Calculate icon from the CalculateView?

这些视图都运行得很好。但是,在应用程序内部有些视图是以编程方式调用的。例如,当你选择了位置后,会跳转到计算视图。在这种情况下,我应该如何以编程方式告诉它将TabView的焦点移动到Calculate图标上,从CalculateView中?

I have a separate MenuView that controls the Tabs:

我有一个单独的MenuView,用于控制选项卡:

struct MenuView: View {
    
    @State public var selectedTab = Tab.location  // was private
    
    public enum Tab: Hashable {
            case location
            case calculate
            case install
            case results
            case about
    }
    
    var body: some View {
        VStack {
            TabView(selection: $selectedTab) {
                LocationView()
                    .tabItem {
                        Label("Location", systemImage: "globe.europe.africa")
                    }
                    .tag(Tab.location)
                CalculateView()
                    .tabItem {
                        Label("Calculate", systemImage: "apps.ipad")
                    }
                    .tag(Tab.calculate)
                InstallView()
                    .tabItem {
                        Label("Install", systemImage: "window.ceiling.closed")
                    }
                    .tag(Tab.install)
                ResultsView()
                    .tabItem {
                        Label("Results", systemImage: "sun.max.fill")
                    }
                    .tag(Tab.results)
                AboutView()
                    .tabItem {
                        Label("About", systemImage: "gear")
                    }
                    .tag(Tab.about)
            } // TabView
            .accentColor(.yellow)                                               //Active tab color
            .background(Color.white)
        }                                                                       // VStack
    }                                                                               // body
    
    init() {
        UITabBar.appearance().barTintColor = UIColor.systemGray //TabBar color
        UITabBar.appearance().backgroundColor = UIColor.white
        UITabBar.appearance().unselectedItemTintColor = UIColor.red //systemGray
        UITabBar.appearance().isOpaque = false
    }
}

这是控制选项卡的独立MenuView的代码。

英文:

I have a SwiftUI TabView that calls 5 separate views: Location, Calculate etc.

SwiftUI – 以编程方式更改TabView的焦点

These work perfectly. But some views are called programmatically within the App. So, for example, when you have chosen your Location you move to the Calculate view. When I do this how would I programatically tell it to move the TabView focus onto the Calculate icon from the CalculateView?

I have a separate MenuView that controls the Tabs:

struct MenuView: View {
    
    @State public var selectedTab = Tab.location  // was private
    
    public enum Tab: Hashable {
            case location
            case calculate
            case install
            case results
            case about
    }
    
    var body: some View {
        VStack {
            TabView(selection: $selectedTab) {
                LocationView()
                    .tabItem {
                        Label("Location", systemImage: "globe.europe.africa")
                    }
                    .tag(Tab.location)
                CalculateView()
                    .tabItem {
                        Label("Calculate", systemImage: "apps.ipad")
                    }
                    .tag(Tab.calculate)
                InstallView()
                    .tabItem {
                        Label("Install", systemImage: "window.ceiling.closed")
                    }
                    .tag(Tab.install)
                ResultsView()
                    .tabItem {
                        Label("Results", systemImage: "sun.max.fill")
                    }
                    .tag(Tab.results)
                AboutView()
                    .tabItem {
                        Label("About", systemImage: "gear")
                    }
                    .tag(Tab.about)
            } // TabView
            .accentColor(.yellow)                                               //Active tab color
            .background(Color.white)
        }                                                                       // VStack
    }                                                                               // body
    
    init() {
        UITabBar.appearance().barTintColor = UIColor.systemGray //TabBar color
        UITabBar.appearance().backgroundColor = UIColor.white
        UITabBar.appearance().unselectedItemTintColor = UIColor.red //systemGray
        UITabBar.appearance().isOpaque = false
    }
} 

答案1

得分: 2

selectedTab作为与选项卡视图绑定,并在这些视图中声明@Binding var selectedTab: Tab并在其中更改值。

这是一个示例代码,概述了这种方法:

结构体 ContentView: 视图 {
    var body: 一些视图 {
        菜单视图()
    }
}

结构体 CalculateView: 视图 {
    @Binding var selectedTab: Tab
    
    var body: 一些视图 {
        按钮("点击我 CalculateView", 操作: {selectedTab = Tab.install} )
    }
}

结构体 LocationView: 视图 {
    @Binding var selectedTab: Tab
    
    var body: 一些视图 {
        按钮("点击我 LocationView", 操作: {selectedTab = Tab.calculate} )
    }
}

结构体 InstallView: 视图 {
    @Binding var selectedTab: Tab
    
    var body: 一些视图 {
        按钮("点击我 InstallView", 操作: {selectedTab = Tab.location} )
    }
}

公共枚举 Tab: 可散列 {
        案例 位置
        案例 计算
        案例 安装
        案例 结果
        案例 关于
}

结构体 MenuView: 视图 {
    
    @State var selectedTab = Tab.location

    var body: 一些视图 {
        垂直 {
            TabView(selection: $selectedTab) {
                LocationView(selectedTab: $selectedTab)  // <-- 这里
                    .tabItem {
                        标签("位置", 系统图像: "globe.europe.africa")
                    }
                    .tag(Tab.location)
                CalculateView(selectedTab: $selectedTab)
                    .tabItem {
                        标签("计算", 系统图像: "apps.ipad")
                    }
                    .tag(Tab.calculate)
                InstallView(selectedTab: $selectedTab)
                    .tabItem {
                        标签("安装", 系统图像: "window.ceiling.closed")
                    }
                    .tag(Tab.install)
    //                ResultsView()
    //                    .tabItem {
    //                        Label("Results", systemImage: "sun.max.fill")
    //                    }
    //                    .tag(Tab.results)
    //                AboutView()
    //                    .tabItem {
    //                        Label("About", systemImage: "gear")
    //                    }
    //                    .tag(Tab.about)
            } // TabView
            .accentColor(.yellow)
            .background(Color.white)
        }
    }
    
    初始化() {
        UITabBar.appearance().barTintColor = UIColor.systemGray //TabBar color
        UITabBar.appearance().backgroundColor = UIColor.white
        UITabBar.appearance().unselectedItemTintColor = UIColor.red //systemGray
        UITabBar.appearance().isOpaque = false
    }
}
英文:

Pass the selectedTab as a binding to the tab views, and in these views, declare
@Binding var selectedTab: Tab and change the value in there.

Here is a working example code, that outlines the approach:

struct ContentView: View {
var body: some View {
MenuView()
}
}
struct CalculateView: View {
@Binding var selectedTab: Tab
var body: some View {
Button("click me CalculateView", action: {selectedTab = Tab.install} )
}
}
struct LocationView: View {
@Binding var selectedTab: Tab
var body: some View {
Button("click me LocationView", action: {selectedTab = Tab.calculate} )
}
}
struct InstallView: View {
@Binding var selectedTab: Tab
var body: some View {
Button("click me InstallView", action: {selectedTab = Tab.location} )
}
}
public enum Tab: Hashable {
case location
case calculate
case install
case results
case about
}
struct MenuView: View {
@State var selectedTab = Tab.location
var body: some View {
VStack {
TabView(selection: $selectedTab) {
LocationView(selectedTab: $selectedTab)  // <-- here
.tabItem {
Label("Location", systemImage: "globe.europe.africa")
}
.tag(Tab.location)
CalculateView(selectedTab: $selectedTab)
.tabItem {
Label("Calculate", systemImage: "apps.ipad")
}
.tag(Tab.calculate)
InstallView(selectedTab: $selectedTab)
.tabItem {
Label("Install", systemImage: "window.ceiling.closed")
}
.tag(Tab.install)
//                ResultsView()
//                    .tabItem {
//                        Label("Results", systemImage: "sun.max.fill")
//                    }
//                    .tag(Tab.results)
//                AboutView()
//                    .tabItem {
//                        Label("About", systemImage: "gear")
//                    }
//                    .tag(Tab.about)
} // TabView
.accentColor(.yellow)
.background(Color.white)
}
}
init() {
UITabBar.appearance().barTintColor = UIColor.systemGray //TabBar color
UITabBar.appearance().backgroundColor = UIColor.white
UITabBar.appearance().unselectedItemTintColor = UIColor.red //systemGray
UITabBar.appearance().isOpaque = false
}
} 

huangapple
  • 本文由 发表于 2023年4月19日 14:56:55
  • 转载请务必保留本文链接:https://go.coder-hub.com/76051540.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定