swiftUI开发实现页面的跳转

适配6sp ios13.3
使用
TabView点击实现跳转，
请自行删除掉注释部分和不需要的部分。

//
//  ContentView.swift
//  GraduationTestApp01
//
//  Created by Humphrey Norton on 2022/4/26.
//  Copyright © 2022 Humphrey Norton. All rights reserved.
//

import SwiftUI
import RealityKit
import UIKit
import Combine
import Foundation


struct ContentView : View {
    
    
    
    
    @State private var selectedIndex = 0
    
    @State private var Title = "进行中"
    
    
    
    var body: some View {
        NavigationView{
            
            
            VStack(alignment: .leading, spacing: 0){
                
                
                
                
                
                
                userInformation
                
                
                classifyTopview
                //                Text("hello world! ")
                pageView
                
                Spacer()
            }//VStack
                .navigationBarTitle("界面01",displayMode: .inline)
            //            .navigationBarItems(leading: searchBar, trailing: postButton)
        }//NavigationView
            .onAppear{
                UINavigationBar.appearance().barTintColor = .white
        }
    }
    
    
    
    
    
}


//定义全局常量 设置Titles
private let Titles = ["全\t部","进行中","已完成"]


private var userMoney = 6.56


//ARViewContainer结构体加载三维模型
struct ARViewContainer: UIViewRepresentable {
    
    func makeUIView(context: Context) -> ARView {
        
        let arView = ARView(frame: .zero)
        
        // Load the "Box" scene from the "Experience" Reality File
        let boxAnchor = try! Experience.loadBox()
        
        //        parkinglot_s模型加载
        //    为什么未自动创建parkinglot_s的类？
        //        let boxAnchor = try! parkinglot_s.loadBox()
        
        
        // Add the box anchor to the scene
        arView.scene.anchors.append(boxAnchor)
        
        return arView
        
    }
    
    func updateUIView(_ uiView: ARView, context: Context) {}
}



//test3
//userinformation
extension ContentView{
    
    
    private  var userInformation : some View{
        
        //返回VStack，整合视图，以垂直方向排列显示；HStack水平方向排列显示;ZStack重叠排列显示；布局的显示
        
        
        
        HStack(alignment: .center){
            
            VStack(alignment: .center){
                Image(systemName: "person.crop.circle")
                    .font(Font.title.weight(.medium))
                    .accentColor(.white)
                    .padding(5)
                Text("余额：6.54元").padding(5)
                //添加边框线
                
                
            }//VStack
                .offset(x:30,y: 8)
            
            
            VStack(alignment: .leading){
                
                Text("昵称：8103018310").padding(5)
                
                
                Text("账号：678@c.com").padding(5)
                
                
            }//VStack
                .offset(x:40,y: 10)
            
            
            
        }//HStack
        
        
        
        
        
        
        
    }
    
}


//orderFormInformation
extension ContentView{
    
    private  var orderFormInformation : some View{
        
        HStack{
            
            Text("订单信息0")
        }
        
        
        
    }
    
}






//滑动改变订单界面效果 订单状态选项
extension ContentView{
    private  var classifyTopview : some View{
        
        VStack(alignment: .leading, spacing: 0){
            
            HStack{
                
                
                VStack(alignment: .leading, spacing: 0){
                    
                    
                    
                    HStack(spacing:0){
                        
                        //设置状态选项栏中显示的内容
                        ForEach(0..<Titles.count){
                            
                            index in
                            Text(Titles[index])
                                //设置显示字体
                                .fontWeight(self.selectedIndex == index ? .bold : nil)
                                .font(.subheadline)
                                //设置字体显示的颜色
                                .foregroundColor(self.selectedIndex == index ? .green : nil)
                                .frame(width:136,height: 36)
                                
                                //添加边框线
                                .overlay(
                                    RoundedRectangle(cornerRadius: 28.0/2, style: .continuous)
                                        .stroke(Color(.gray), lineWidth: 0.5)
                            )
                                
                                
                                .onTapGesture {
                                    self.selectedIndex = index
                                    print("当前在状态栏：\(self.selectedIndex)")}
                            
                        }
                        
                        
                        
                        
                    }
                    
                    //下划线的长宽高
                    HStack{
                        Capsule().fill(Color.blue)
                            .frame(width:30,height: 2)
                        
                    }.frame(width:136)
                        .offset(x:CGFloat(selectedIndex * 136))
                        .animation(.default)
                    
                }.padding(.leading,10)
                
                
                
                
                
            }.background(Color.white.opacity(0.5))
                .offset(x:-5)
            Divider()
            
            
            
            
        }.frame(height:64)
        
    }
    
    
    
}


//订单详情界面的设置 根据所选择的项目的不同 怼不同内容的显示
extension ContentView{
    private var pageView : some View{
        VStack{
        

            
            
            TabView(selection: $selectedIndex) {
                
                
                
                //在三个选项框内部的显示内容，后期可以改成循环数据库中的数据 显示出来 对用户的账号id 邮箱进行显示
                
                Text("第一栏页面").foregroundColor(.blue).tag(0)
                Text("第二栏页面").foregroundColor(.green).tag(1)
//                Text("第三栏页面").foregroundColor(.red).tag(2)
                Text("当前的$selectedIndex的值为 \(selectedIndex)").tag(2)


            }//TabView
                //将边界的TabView移出屏幕外
                .offset(y:60)
        










#if DEBUG
struct ContentView_Previews : PreviewProvider {
    static var previews: some View {
        ContentView().previewDevice("iPhone 6s Plus 13.3")
    }
}
#endif