[SwiftUI] SwiftUIとMusicKit/MediaPlayerFrameworkを使った音楽再生アプリの作り方

ライブラリにある音楽再生機能を持つアプリを開発するための手順を説明します。

作りたいアプリ仕様

以下のような仕様を作りたいですが、難しければ妥協するかも。

  • プレイリストを選択できる(複雑な操作を行いたくない)
  • 再生・停止の操作ができる
  • プレイリスト単位をリピートする(固定)




MediaPlayerFrameworkのドキュメントを一読

MediaPlayerFramework Documentを一読しました。

ざっくりまとめ

  • 音楽再生そのものは、MPMusicPlayerApplicationControllerから生成したオブジェクトで行う。ビデオ再生したければ、AVFoundationのAVPlayerを使う必要あり。
  • バックグラウンド再生させたいならば、Capabilityをenableにする必要がある
  • 音楽のライブラリにアクセスするならば、info.plistに追記必要。
  • メディア情報は、MPMediaItemで管理される。音楽だけでなく、ビデオも同様に管理されている。
  • 音楽再生以外には、このフレームワークを使うべからず。

note: Apple Musicのケースにも言及してますが、今回はスコープ外として読んでません。

音楽ライブラリへのアクセス

ユーザーのライブラリにアクセスするならば、info.plistに、記載する必要あり。記載がないとアプリがクラッシュします。

キー値
Privacy – Media Library Usage Description
値:
アクセス理由を記載

プレイリストの取得

MPMediaQueryを使って、検索します。アルバムやアーティスト等でのQueryは、すでに用意されています。
プレイリストを取得するためのQuery作成は、MPMediaQuery.playlists()でした。

返り値のタイプが、MPMediaQueryなので、結果に対して、collectionsプロパティにアクセスすると[MPMediaItemCollection]? が取得できます。

Playlistを取得

プレイリストから曲データの取得

Playlistは、MPMediaCollectionsなので、itemsプロパティにアクセスすると曲情報を取得することができます。

playlistから曲を取得してリスト表示

前半まとめ

ここまでで、音楽ライブラリへアクセスするときの許諾の方法、プレイリストの取得方法、プレイリストから曲情報の取得と見てきたので、作りたいアプリの基本機能はカバーできたと思います。あとは、SwiftUIと組み合わせて簡単なUIを作っていきます。




アプリ用のモデル作成

SwiftUIのUIを更新するためのベースとなるモデルを作ります。

以下の、AppModelという”アプリ全体管理モデル”でプレイリスト全体を管理します。UserSelectionでは、ユーザーの選択したプレイリストを記憶して、再生・停止等の処理を行います。

アプリ全体管理モデル
プレイリスト選択管理モデル

音楽ライブラリへのアクセス許可

ライブラリへのアクセス許可は、アプリ全体を管理するAppModelを初期化するときに確認しましょう。アクセスが認証されているならば、プレイリストを取得して内部に保持することにしましょう。コードとしては、以下のようになります。

AppModel アクセスリクエスト

プレイリストを取得してリスト表示

MPMediaQueryを使って取得したものを、playlistsに保存します。SwiftUIはこの変数を見てGUIを更新しますので、メインスレッドで変更します。

コード

メイン画面の作成

せっかくプレイリストが取得できたので、表示するようにします。

アプリモデルのenvironmentObject設定

まずは、AppModelをenvironmentObjectとして使えるように設定します。

scene(_ scene: UIScene, ...)を変更

プレイリストのリストを表示するビューをPlayListViewという名前で作ることにしましょう。

ContentView.swift

PlayListView

特に工夫もなく、リスト表示するビューです。

コード

ここで、一度実行してみましょう。

playlist 表示
シミュレータで実行しているので、寂しいですが、プレイリスト名とそのプレイリスト中の曲数を表示しています。

次に、プレイリストを選択したら、曲を表示するようにして見ましょう。

選択されたプレイリストから曲データを取得してリスト表示

PlayListViewで選択されたプレイリストは、userSelection.playlistに保存されるようになっていますから、それを見て、曲をリスト表示するビューを作ります。SongListViewとしましょう。

SongListView

ContentView.swiftの方も、SongListViewを追加します。

コード

PlayListとSongList

ここでもシミュレータでの実行なので、下側のリスト:曲のリストは空ですが、音楽の入っている実機で実行すると、実際の曲名が表示されます。

曲を再生/停止

曲の再生には、MPMusicPlayerApplicationController.applicationQueuePlayerからインスタンス化したものを使います。
Playするときに、一旦キューを空にしてから、プレイリストアイテムをキューに追加します。
あとは、play()やstop()でOKです。

UserSelection

Start/StopのUIも作ります。

PlayButtonView

最終的なContentView.switf

バックグラウンド再生

アプリがバックグラウンドになっても再生を継続したいときには、アプリの”Signing & Capabilities”の”Background Modes”で”Audio, AirPlay, and Picture in Picture”にチェックを入れます。

background再生設定

最終的なコード

アプリデータモデル AppData.swift
ContentView.swift
PlayListView
SongListView
PlayButtonView

Note: 再生中の曲名表示用にTextを入れていますが、実装してません。




まとめ

以下の機能を持つアプリを作りました。

  • プレイリストをリスト表示
  • 選択されたプレイリストに含まれる曲をリスト表示
  • 選択されたプレイリストを再生・停止

ドキュメントを斜め読みして、SwiftUI と MediaPlayer を組み合わせて作ったアプリですが、AirPlay 等にも対応するので、既存のアプリに音楽再生機能を追加することはFrameworkがよくできていることもあり簡単なことがわかりました。

説明は以上です。




1 COMMENT

Bryan

Very helpful! I am trying to build an app using MusicKit and SwiftUI, so I learned a lot here that I will use in the future.

返信する

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です