SwiftUI自定义TabBar导航适配问题（iOS16）

问题分析 #

你当前的代码存在两个核心问题：

1. 无效的视图创建方式：在Button的action闭包中直接调用Periodic_View()只是创建了视图实例，并未将其添加到SwiftUI的视图树中，因此会出现“Result of initializer is unused”警告，完全无法实现页面跳转。
2. 过时的导航逻辑：iOS16+后，SwiftUI的导航体系已从NavigationView切换到NavigationStack，原有的@State绑定isActive触发NavigationLink的方式不再是最佳实践，且你当前的状态变量navigatedX完全冗余。

解决方案 #

以下是适配iOS16+的自定义TabBar实现方案，核心思路是：让TabBar仅负责切换选中状态，父视图根据选中状态展示对应页面，同时采用NavigationStack构建导航体系。

完整修正代码

import SwiftUI

// 统一管理Tab的类型、对应视图和样式信息
enum Tabs: Int, CaseIterable {
    case pt = 0
    case lessons = 1
    case home = 2
    case notes = 3
    case settings = 4
    
    // 每个Tab对应的目标视图
    var destination: some View {
        switch self {
        case .pt:
            Periodic_View()
        case .lessons:
            LessonsView()
        case .home:
            HomeView()
        case .notes:
            NotesView()
        case .settings:
            SettingsView()
        }
    }
    
    // 每个Tab的样式配置
    var tabConfig: (text: String, icon: String, activeIcon: String, color: Color, size: CGFloat) {
        switch self {
        case .pt:
            return ("PT", "atom", "atom", .indigo, 30)
        case .lessons:
            return ("Lessons", "text.book.closed", "text.book.closed.fill", .blue, 30)
        case .home:
            return ("Home", "house", "house.fill", .green, 38)
        case .notes:
            return ("Notes", "tray.full", "tray.full.fill", .orange, 30)
        case .settings:
            return ("Settings", "gearshape", "gearshape.fill", .gray, 30)
        }
    }
}

struct CustomTabBar: View {
    @Binding var selectedTab: Tabs
    
    var body: some View {
        ZStack {
            RoundedRectangle(cornerRadius: 30)
                .frame(height: 100)
                .foregroundStyle(.ultraThinMaterial)
                .shadow(radius: 5)
            
            // 用ForEach批量生成Tab按钮，避免重复代码
            HStack(alignment: .center, spacing: 0) {
                ForEach(Tabs.allCases, id: \.self) { tab in
                    Button {
                        selectedTab = tab
                    } label: {
                        let config = tab.tabConfig
                        CustomTabBarView(
                            buttonText: config.text,
                            imagename: config.icon,
                            imagefillname: config.activeIcon,
                            isActive: selectedTab == tab,
                            color: config.color,
                            size: config.size
                        )
                    }
                    .tint(Color("TabBar"))
                    .frame(maxWidth: .infinity) // 平均分配按钮宽度
                }
            }
            .frame(height: 100)
        }
    }
}

// 以下是示例子视图，请替换为你自己的实际视图
struct Periodic_View: View {
    var body: some View {
        Text("元素周期表页面")
            .navigationTitle("PT")
    }
}

struct LessonsView: View {
    var body: some View {
        Text("课程页面")
            .navigationTitle("Lessons")
    }
}

struct HomeView: View {
    var body: some View {
        Text("首页")
            .navigationTitle("Home")
    }
}

struct NotesView: View {
    var body: some View {
        Text("笔记页面")
            .navigationTitle("Notes")
    }
}

struct SettingsView: View {
    var body: some View {
        Text("设置页面")
            .navigationTitle("Settings")
    }
}

// 整合导航栈和自定义TabBar的主视图
struct MainContentView: View {
    @State private var selectedTab: Tabs = .home
    
    var body: some View {
        NavigationStack {
            // 根据选中的Tab展示对应页面
            selectedTab.destination
                .navigationBarTitleDisplayMode(.inline)
                .toolbar {
                    // 将自定义TabBar放在底部工具栏，符合SwiftUI布局规范
                    ToolbarItem(placement: .bottomBar) {
                        CustomTabBar(selectedTab: $selectedTab)
                    }
                }
        }
    }
}

struct CustomTabBar_Previews: PreviewProvider {
    static var previews: some View {
        MainContentView()
    }
}

关键改进点说明

1. 简化状态管理：移除所有冗余的navigatedX状态，仅通过@Binding var selectedTab控制页面切换，逻辑更清晰。
2. 统一配置管理：扩展Tabs枚举，将每个Tab对应的视图、文字、图标等信息集中管理，后续修改样式或新增Tab时更高效。
3. 适配iOS16+导航：使用NavigationStack替代旧的NavigationView，符合最新的SwiftUI导航规范；若需要在子页面中跳转其他页面，可直接在对应子视图中使用NavigationLink。
4. 优化布局：用ForEach批量生成Tab按钮，通过frame(maxWidth: .infinity)让按钮平均分配宽度，避免手动计算布局。

内容的提问来源于stack exchange，提问作者StackedErrors