Swift高级用法:navigationLink,@Binding

457 阅读1分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第3天,点击查看活动详情

PS:已经更文3天

1.navigatioLink

1.1 要点简明

导航链接,用来做swift View的切换 今天算是水了一篇文章,明天继续开始更新的文章。


//
//  ContentView.swift
//  NavigationLink
//
//  Created by Ethan on 2022/2/3.
//

import SwiftUI
struct detail:View{
    @Environment(\.presentationMode) var presentation
    
    var body: some View{
    
    VStack{
        
        Text("详细介绍")
            .font(.title2)
                               
    }
    .navigationBarTitle("详细页面")
    .navigationBarTitleDisplayMode(.inline)
    .navigationBarBackButtonHidden(true)
    .navigationBarItems(leading: Button("<<返回"){
        self.presentation.wrappedValue.dismiss()
        
                
    })
            
    
    }
    
    
}

struct ContentView: View {
    var body: some View {
        
        NavigationView{
            
            VStack(alignment: .center, spacing: 30){
                NavigationLink("第一个画面",destination: Text("Welcome to fist view"))
                    .font(.title)
                NavigationLink("第二个画面"){
                    Text("Welcome to second view")
                                                            
                }
                .font(.title)
                NavigationLink("详细画面",destination: detail())
                    .font(.title)
                
                                                                                
            }
                        
            .navigationTitle("Main Screen")
            
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

1.2案例截图

在这里插入图片描述 在这里插入图片描述

2.navigationView和@Binding

2.1这一节要点

1.@Binding,按地址传递,不是值传递。 2.navigationView的常用方法:

NavigationLink(
                    destination: detail(detailActive: self.$active),
                    isActive: self.$active,
                                        
                    label: {
                        
                        Button(action: {
                            
                            self.active=true
                                                      
                        }, label: {
                            
                            Text("Main Screen")
                                .font(.title)                            
                        })

//
//  ContentView.swift
//  NavigationLink
//
//  Created by Ethan on 2022/2/3.
//

import SwiftUI
struct detail:View{
    @Environment(\.presentationMode) var presentation
    //@Binding按地址传递 deltailActive--active,这两个bool类型之间进行了双向绑定($)
    @Binding var detailActive:Bool
    
    var body: some View{
    
        VStack(spacing:40){
        
        Text("详细介绍")
            .font(.title2)
        
        Button(action: {
            
            self.detailActive=false
        }, label: {
            Text("关闭画面")
                .font(.title2)
            
            
        })
            
    }
    .navigationBarTitle("详细页面")
    .navigationBarTitleDisplayMode(.inline)
    .navigationBarBackButtonHidden(true)
    .navigationBarItems(leading: Button("<<返回"){
        self.presentation.wrappedValue.dismiss()
        
    })
    }
    
    
}

struct ContentView: View {
    
    
    @State private var  active:Bool=false
    
    
    var body: some View {
        
        
        NavigationView{
            
            VStack(alignment: .center, spacing: 30){
                NavigationLink("第一个画面",destination: Text("Welcome to fist view"))
                    .font(.title)
                NavigationLink("第二个画面"){
                    Text("Welcome to second view")
                                                            
                }
                .font(.title)
                NavigationLink("详细画面",destination: detail(detailActive: self.$active),isActive: self.$active)
                    .font(.title)
                
                NavigationLink(
                
                    destination: detail(detailActive: self.$active),
                    isActive: self.$active,
                                        
                    label: {
                        
                        Button(action: {
                            
                            self.active=true
                            
                            
                        }, label: {
                            
                            Text("Main Screen")
                                .font(.title)
                            
                        })
                        
                        
                    }

                )
                
                
            }
            
            
            
        
            
            .navigationTitle("Main Screen")
            
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

2.2案例截图

在这里插入图片描述 在这里插入图片描述