SwiftUI JSON之List下載、解析、顯示遠程Json文件

本文的目的是展示一種從遠程JSON文件獲取數據并將其顯示在SwiftUI中的列表上的簡單方法。

數據介紹

下面是我們json文件的格式

[{
    "id": 5,
    "title": "Joker",
    "year": "2019",
    "image": "",
    "created_at": "2019-10-06T17:55:21.374Z",
    "updated_at": "2019-10-06T17:55:21.374Z"
}, {
    "id": 1,
    "title": "Pulp Fiction",
    "year": "1994",
    "image": "",
    "created_at": "2019-10-06T15:26:36.675Z",
    "updated_at": "2019-10-06T18:05:31.649Z"
}, {
    "id": 4,
    "title": " The Godfather ",
    "year": "1972",
    "image": "",
    "created_at": "2019-10-06T15:27:38.123Z",
    "updated_at": "2019-10-06T18:05:50.242Z"
}, {
    "id": 6,
    "title": "The Dark Knight ",
    "year": "2008",
    "image": "",
    "created_at": "2019-10-06T18:06:12.933Z",
    "updated_at": "2019-10-06T18:06:12.933Z"
}, {
    "id": 7,
    "title": "Fight Club",
    "year": "1999",
    "image": "",
    "created_at": "2019-10-06T18:06:33.096Z",
    "updated_at": "2019-10-06T18:06:33.096Z"
}, {
    "id": 8,
    "title": " Inception",
    "year": "2010",
    "image": "",
    "created_at": "2019-10-06T18:06:52.034Z",
    "updated_at": "2019-10-06T18:06:52.034Z"
}, {
    "id": 2,
    "title": "The Matrix ",
    "year": "1999",
    "image": "",
    "created_at": "2019-10-06T15:26:48.042Z",
    "updated_at": "2019-10-06T18:08:00.902Z"
}, {
    "id": 3,
    "title": "The Shawshank Redemption ",
    "year": "1984",
    "image": "",
    "created_at": "2019-10-06T15:26:59.572Z",
    "updated_at": "2019-10-06T18:08:47.637Z"
}]

預期效果

[email protected]

編碼

首先，我們需要為Movie定義模型，在這種情況下，該模型是具有Decodable和Identifiable協議的struct。Decodable能夠從JSON文件中對其進行解碼，Identifiable能夠與List一起列出。List可以像UITableViewController一樣顯示可標識集合中的數據列表。

struct Movie: Decodable, Identifiable {
    public var id: Int
    public var name: String
    public var released: String
    
    enum CodingKeys: String, CodingKey {
           case id = "id"
           case name = "title"
           case released = "year"
        }
}

CodingKeys能夠將JSON key名稱與您創建的Model的變量名稱進行映射。在這種情況下，我將其命名為Release而不是年份，只是為了表明您可以在模型中使用自己的名稱，只要您在Coding Keys中定義它即可。

下面我們將編碼讀取數據并進行解碼的代碼

本文鏈接：https://blog.csdn.net/iCloudEnd/article/details/105530253

智能推薦

SwiftUI封裝UIKit之UIDatePicker

本文價值與收獲看完本文后，您將能夠作出下面的界面 [email protected] 看完本文您將掌握的技能 UIDatePicker基礎使用掌握SwiftUI使用UIDatePicker方法代碼推薦基礎文章推薦《SwiftUI是什么，聽聽大牛們如何說》經典教程推薦 onevcat 大神的《SwiftUI 與 Combine 編程》更新近百篇SwiftUI教程《...

SwiftUI學習筆記之Animations 一 SwiftUI的Animations可以用到View當中，不僅是數值變化可以使用，即使是布爾變量也可以使用，例如在Button中使用當點擊button時，背景顏色立刻變為藍色或者紅色。如果我們加上animation 則顏色變化則漸變為紅色或者藍色。除了默認的動畫模式還有很多可供選擇比如 interpolatingSpring easeInOu...

SwiftUI之List 和form（2020版）

SwiftUI之List 和form（2020版） VStack 效果 image.png List 效果 image.png List with header & footer 效果 image.png List & navigation Treat.swift 效果 image.png 完成代碼效果 image.png...

SwiftUI 基礎之List如何設置風格

UIKit時代我們可以給UITableview設置不同顯示風格，SwiftUI世界里該如何實現呢？實現方法非常簡單，請看效果和代碼效果 [email protected] 代碼參考文章 https://stackoverflow.com/questions/56498045/remove-extra-separators-below-list-in-swiftui 更多S...

iOS SwiftUI macOS之List基礎使用

本文價值與收獲看完本文后，您將能夠作出下面的界面 image.png 看完本文您將掌握的技能 macOS中list基礎使用代碼技術交流 QQ:3365059189 SwiftUI技術交流QQ群:518696470 請關注我的專欄icloudend, SwiftUI教程與源碼 https://www.jianshu.com/c/7b3e3b671970...