Storyboard 電子書 App — 彼得潘的 iOS App 作業 — 冰雪奇緣 Frozen

褚慧芸
海大 SwiftUI iOS / Flutter App 程式設計
4 min readOct 25, 2017
  1. App 操作的動畫影片 gif
Frozen App 操作的動畫

2. GitHub 連結

3. 特製的 App 畫面截圖

Frozen App 畫面截圖
Frozen App 畫面截圖
Frozen App 畫面截圖

4. 文字說明

這是一個介紹Disney動畫電影 — 冰雪奇緣 Frozen的App,內容包含該電影的劇情簡介、角色簡介、冰雪奇緣及後續系列預告片和原聲帶的YouTube。

而想到冰雪奇緣,當然就會讓人馬上聯想到他的原聲帶。為了能把原聲帶的影片放進電子書App裡,於是就上網查了如何把YouTube影片加入至App裡。

做完這次的電子書App作業後,使我對storyboard及Table View Controller的應用更熟悉,也學到了如何把YouTube影片加入至App裡。

#storyboard:

Frozen storyboard 畫面截圖

5. 重點程式碼講解

在這個App裡有用到沒教過的技術 — YouTube影片嵌入

將YouTube影片嵌入至App

#如何把YouTube 影片播放器嵌入至UIWebView裡:

先在該ViewController加入一個UIWebView,並拉線至對應的UIViewController.swift,然後在對應的UIViewController.swift裡加入下圖程式碼,再把要播放的YouTube影片的VIDEO_ID放進第16行程式裡的videoID裡。

#程式碼截圖:

YouTube 影片嵌入 程式碼截圖

參考資料:

--

--