SwiftUIを使用してYouTube検索アプリを作成する
拙著「SwiftUIではじめるiPhoneアプリプログラミング入門」では、最後のChapterのサンプルとして「Swift UIを使用したYouTube検索アプリ」を作成しています。
GitHub Webのサンプル
次のURLより、Xcode 11で作成したプロジェクトをダウンロードできます
https://github.com/makotoo2/YoutubeSearch1
作成するYouTube動画検索アプリについて
作成するYouTube動画検索アプリでは、YouTubeの提供する「YouTube Data API v3」を叩いてJSONファイルを取得し、それをリストに表示します。上部のテキストボックスに検索文字列を入力して「検索」ボタンをクリックすると、検索結果が一覧表示されます。
APIキーを取得する
YouTubeの動画検索を行うには、「YouTube Data API v3」のAPIキーが必要です。また、APIキーを取得するにはGoogleアカウントが必要になります。
- Webブラウザで、GoogleアカウントでログインしGoogle Developers Console(https://console.developers.google.com/apis/library)を開きます。
- 「YouTube Data API v3」ページを開き「有効にする」ボタンをクリックします。
- ライブラリ」ページで「作成」ボタンをクリックしてプロジェクトを作成します。
- 認証情報」ページで情報を設定し「必要な認証情報」ボタンをクリックします。
- APIキーが表示されます。
ファイル構成について
YouTube検索アプリで、は次の様な5つのswiftファイルを用意しています。
- ContentView.swift メインのコンテンツビュー
- YoutubeSearcher.swift YouTube APIを検索するYoutubeSearcherクラスを定義しています。ObservableObjectプロトコルを実装し検索結果を通知します。searchメソッドにより検索を実行します。
- YoutubeView.swift UIViewRepresentableプロトコル適合したYoutubeView構造体を定義しています。WKWebViewビューを使用して、選択したYouTubeビデオのWebページを表示します。
- YoutubeJsonModel.swift Youtube Data APIの検索結果のJSONデータに対応した構造体を定義しています。
- VideoRowView.swift 検索結果をリストの行として表示するVideoRowView構造体を定義しています。
URLImageライブラリの読み込み
ビデオのサムネール画像の表示には、外部ライブラリ「URLImage」を使用しています。