API串接-動物森友會 K.K.音樂合輯

Cash
彼得潘的 Swift iOS / Flutter App 開發教室
4 min readJun 16, 2020

女朋友從動物森友會在台灣上市後,
每天都與Switch形影不離,
裡面的動物角色,令我最印象深刻的就是他。
K.K. Cruisin(一隻白色的裸體狗狗)

K.K. 可以說是全方位曲風的天才型音樂家
動物森友會裡的角色可以與現實世界的周杰倫相比
沒有任何曲風難得倒牠

動物森友會的API — 有村民、動物、音樂各種物件
這裡就以songs歌曲為例吧

https://acnhapi.com/v1/songs/
把這個網址放進Postman解析
發現他是以Dictionary不是之前TMDB所使用的Array
於是Call Out彼得潘

透過Peter小王子的文章訊息攻擊後
瞭解如何使用Dictionary紀錄Key:Value
準備開始製作App囉~

這次我們使用Collection View製作

建立歌曲的Model
因為程式不能用 - 這個符號
因此使用CodingKey 把有使用到 - 這個符號轉成字串
在NameData裡面有多國語言包,我們這裡使用TWzh。

Collection View Cell
只需顯示歌曲圖片與歌曲名稱

一樣使用ViewController因此要記得遵從CollectionView的協定
(UICollectionViewDelegate, UICollectionViewDataSource)
跟TableView類似,但這次我們直接在viewDidLoad裡讀取Data,
let decoder = JSONDecoder()

if let data = data, let songsDic = try? decoder.decode([String: Song].self, from: data)

self.songs = Array(songsDic.values)
利用這三行程式碼將Dictionary轉換成Array

遵從了協定就要給相對應的方法,與TableView相似,
numberOfItemsInSection -> 回傳歌曲的個數 return songs.count
cellForItemAt -> 找到對應的Cell並且將Data與UI連接
didSelectItemAt ->選取cell之後,將資料傳遞到SongDetailViewController

將取得的歌曲資訊在此顯示

成果如下

--

--