[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])
}
}
}
上一篇: 编写程序,包含3个标签,其背景分别为红、黄、蓝3色。
下一篇: OpenCV笔记: 查找轮廓