Days39 Moonshot项目开启

Moonshot:简介

####应用 -- 使用户可以了解组成NASA阿波罗太空计划的任务和宇航员。

####技术： --Codable --滚动视图 --导航 --更多有趣的布局。

#####带着疑问去学： -- 如何使图像正确适合其空间？ -- 如何使用计算属性来清理代码？ -- 如何将较小的视图组合成较大的视图，以帮助保持项目的井井有条？

使用GeometryReader调整图像大小以适合屏幕

这里先用一个Image控件举例，图片的原始大小和我们设置的frame 可能因为宽高比不匹配而遇到一些问题！然后引出GeometryReader如何解决这个问题:

              Image("anders")
                ///resizable可以调整图片尺寸 但是宽高比例会被破坏掉
                .resizable()
                ///这个可以让图片保持原始的宽高比，宽度会被撑满，但是高度可能达不到
                ///fill会让图片显示不全
                .aspectRatio(contentMode: .fit)
                .frame(width:300, height: 300)
            
                ///clipped可以切掉在尺寸外的图片内容 但是图片显示不完整
                ///不会破坏宽高比
                .clipped()

                ///使用GeometryReader,我们将获得一个GeometryProxy要使用的对象。这使我们可以查询环境：容器有多大？我们的立场是什么？是否有安全区域插图？等等。
            GeometryReader.init { proxy in
                Image("anders")
                .resizable()
                    .aspectRatio(contentMode: .fit)
                    ///下面这个的宽度会一直和屏幕宽度一样
                    ///但是它知道原始宽度 知道目标宽度 知道内容模式(比例)
                    ///可以推测出目标高度
                    .frame(width:proxy.size.width)
            }

按照目前结束这一小节，上面提到的如何让图片正确的适合其空间问题可以解决！

ScrollView如何让我们处理滚动数据

就举了一个简简单单的小例子

struct CustomText: View {
    var text: String

    var body: some View {
        Text(text)
    }

    init(_ text: String) {
        print("Creating a new CustomText")
        self.text = text
    }
}
struct demo2: View {
    var body: some View {
        ///包含100个文本的滚动视图
        VStack(spacing: 10) {
            ForEach(0..<100) {
                CustomText("Item \($0)")
                    .font(.title)
            }
        }
//        .frame(maxWidth: .infinity)

    }
}

使用NavigationLink将新视图推入堆栈

其实就是用Navigation Push到下一个界面使用Sheet也可以不过那个是model

NavigationView {
    List(0..<100) { row in
        NavigationLink(destination: Text("Detail \(row)")) {
            Text("Row \(row)")
        }
    }
    .navigationBarTitle("SwiftUI")
}

处理分层可编码数据

就是json嵌套数据的时候该如何解码 ---》给嵌套的模型也创建符合codable协议的结构体

struct User: Codable {
    var name: String
    var address: Address
}

struct Address: Codable {
    var street: String
    var city: String
}


Button("Decode JSON") {
    let input = """
    {
        "name": "Taylor Swift",
        "address": {
            "street": "555, Taylor Swift Avenue",
            "city": "Nashville"
        }
    }
    """

    // more code to come
}

let data = Data(input.utf8)
let decoder = JSONDecoder()
if let user = try? decoder.decode(User.self, from: data) {
    print(user.address.street)
}

第39天一共就介绍这么多东西！

关于Hack-Swift100Days的全部笔记都在这里: github.com/zyzhangyu/Z…

Hack-SwiftUI-Days-39笔记