欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

[1]SwiftUI

程序员文章站 2024-03-24 12:50:52
...

Text

Text(landmark.location)
	.font(.subheadline)//字体的大小
	.foregroundColor(.secondary)//secondary一个比较常用的灰色字体
    .padding(.all)//四周都设置空格

StackView

HStack 左右
VStack 上下
ZStack 前后

StackView里面对其的方式

VStack(alignment:.leading) {
	******
}

ImageView

Image(landmark.imageName)
	.cornerRadius//边角
	.resizable()//填充可变
	.aspectRatio(contentMode:zoomed ? .fill : .fit)//改变填充方式
	.frame(minWidth: 0,maxWidth: .infinity,minHeight: 0,maxHeight: .infinity)//自定义frame的大小
	.onTapGesture {//事件的触发
	                   withAnimation(.linear(duration: 1)){//只要因为zoomed的改变而更新的数据,都有animation
	                       self.zoomed.toggle()//true和false的切换
   }
}

NavigationView

NavigationView {
//NavigationLink连接下一个视图,视图加括号进行传值
	NavigationLink(destination: LandmarkDetail(landmark: landmark)){
            Image(landmark.thumbnailName)
                .cornerRadius(8)
            VStack(alignment: .leading) {
                Text(landmark.name)
                Text(landmark.location)
                    .font(.subheadline)
                    .foregroundColor(.secondary)
            }
        }
}
.navigationBarTitle(Text("****"))//Navigation标题

TableView

List(landmarks) { landmark in
                
//list ForEach等要求被循环的每个元素都有一个唯一标识符
//两种方法:
//1.ArrayData.identified(by:\.id)id为每个元素的唯一标识符属性
//2.数组中元素遵循Identifiable id用UUID结构体
   ******
}

上述的方法2:

struct Landmark : Identifiable {
    var id = UUID()
}

ExtractedView

struct ContentView: View {
    var body: some View {
        
    LandmarkCell(landmark: landmark)//用ExtractedView分离子视图简化代码,括号内进行传值
    }
}
struct LandmarkCell : View {
    
    let landmark:Landmark
    var body: some View {
    	*****
    }
}

Animation

@State var zoomed = false //使得可以改变该值,并且在改变该值之后自动重新运行程序

withAnimation(.linear(duration: 1)){//只要因为zoomed的改变而更新的数据,都有animation
	self.zoomed.toggle()//true和falsehq的切换
}
if !zoomed {
    Text(landmark.location)
        .font(.largeTitle)
        .foregroundColor(.secondary)
        .padding(.all)
        .transition(.move(edge: .trailing))//大小改变是ainimate移动是transition
            }

调试

静态的模型显现

struct LandmarkDetail_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView{
            LandmarkDetail(landmark: landmarks[0])
        }
    }
}

SceneDelegate

生命周期函数的管理者由AppDelegate改为SceneDelagate

if let windowScene = scene as? UIWindowScene {
            let window = UIWindow(windowScene: windowScene)
            window.rootViewController = UIHostingController(rootView: contentView)//决定rootview的位置即启动之后的第一个页面。
            self.window = window
            window.makeKeyAndVisible()
        }

ContentView:

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            List(landmarks) { landmark in
                
                //list ForEach等要求被循环的每个元素都有一个唯一标识符
                //两种方法:
                //1.ArrayData.identified(by:\.id)id为每个元素的唯一标识符属性
                //2.数组中元素遵循Identifiable id用UUID结构体
                
                LandmarkCell(landmark: landmark)//用ExtractedView分离子视图简化代码
            }
            .navigationBarTitle(Text("世界地标"))
        }
    }
}

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

struct LandmarkCell : View {
    
    let landmark:Landmark
    var body: some View {
        NavigationLink(destination: LandmarkDetail(landmark: landmark)){
            Image(landmark.thumbnailName)
                .cornerRadius(8)
            VStack(alignment: .leading) {
                Text(landmark.name)
                Text(landmark.location)
                    .font(.subheadline)
                    .foregroundColor(.secondary)
            }
        }
    }
}

LandmarkDetail:

import SwiftUI

struct LandmarkDetail: View {
    
    let landmark:Landmark
    @State var zoomed = false //使得可以改变该值,并且在改变该值之后自动重新运行程序
    
    
    var body: some View {
        ZStack(alignment:.bottomTrailing) {
            Image(landmark.imageName)
                .resizable()
                .aspectRatio(contentMode:zoomed ? .fill : .fit)
                .navigationBarTitle(Text(landmark.name),displayMode: .inline)
                .frame(minWidth: 0,maxWidth: .infinity,minHeight: 0,maxHeight: .infinity)
                .onTapGesture {//事件的触发
                    withAnimation(.linear(duration: 1)){//只要因为zoomed的改变而更新的数据,都有animation
                        self.zoomed.toggle()//true和falsehq的切换
                    }
            }
            
            if !zoomed {
                Text(landmark.location)
                    .font(.largeTitle)
                    .foregroundColor(.secondary)
                    .padding(.all)
                    .transition(.move(edge: .trailing))//大小改变是ainimate移动是transition
            }
            
        }
    }
}

struct LandmarkDetail_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView{
            LandmarkDetail(landmark: landmarks[0])
        }
    }
}

相关标签: iOS 开发