【SwiftUI】SwiftUIで音を鳴らす方法【AVAudioPlayer】

こんにちは、餅屋です！

今回はSwiftUIを使って、ボタンを押すと音が鳴るアプリを作ってみます。

AVAudioPlayerを使用して音声を再生するだけの、非常にシンプルなアプリです。

1.音声ファイルを用意する。

鳴らす音が無いとはじまらないので、音を用意します。

今回は、効果音ラボ様の演出・アニメジャンルの、『きらきら輝く1』を使用しました。

『効果音ラボ』　演出・アニメ
 https://soundeffect-lab.info/sound/anime/

効果音ラボからダウンロードすると、『きらきら輝く1.mp3』のように日本語のファイル名なので、

『SE_kirakira01.mp3』などと半角に改名しておきます。

mp3やwaveファイルであればなんでもいいので、好きな音を調達しましょう。

2.音声ファイルをプロジェクトに追加

用意した音声ファイルを、XcodeプロジェクトのAssets.xcassetsに入れておきます。

3.見た目を作る

音声ファイルの準備が整ったら、見た目(ContentsView)を作りましょう。

といっても、白い画面に"効果音再生"ボタンがあるだけです。

ボタンを押した時の処理(action)はこれから記述するので空欄です。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Button(action: {}) {
            Text("効果音再生")
                .font(.title)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

4.ボタンを押すと効果音を再生させる

手順としては

AVFoundationをインポート
SE_kirakira01.mp3を再生するプレイヤーkirakiraSoundを作成
kirakiraSoundを再生するメソッド作成
「効果音再生」ボタンのアクションに、3のメソッドを入れる

全体はこんな感じです。

import SwiftUI　
import AVFoundation　//追加①AVFoundationをインポート

struct ContentView: View {
    //追加② SE_kirakira01.mp3を再生するAVAudioPlayerのkirakiraSoundを作成
    private let kirakiraSound = try!  AVAudioPlayer(data: NSDataAsset(name: "SE_kirakira01")!.data)

    //追加③　②のkirakiraSoundを再生するメソッドを作成
    private func playSound(){
        kirakiraSound.play()
    }
    
    var body: some View {
        Button(action: {
            playSound()//追加④　③で作成したメソッド発動
        }) {
            Text("効果音再生")
                .font(.title)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

ただこれだと、効果音再生ボタンを連続で押したときに反応しなくなってしまいます。

なので、下記のように2行追加します。

private func playSound(){
        kirakiraSound.stop()//追加①
        kirakiraSound.currentTime = 0.0//追加②
        kirakiraSound.play()
    }

①によってストップをかけ、②で音声を頭まで巻き戻しています。

これによって、ボタンを連続で押したときに音声が最初から再生されるようになります。

すべてのコードです。

import SwiftUI
import AVFoundation

struct ContentView: View {
   
    private let kirakiraSound = try!  AVAudioPlayer(data: NSDataAsset(name: "SE_kirakira01")!.data)
    
    private func playSound(){
        kirakiraSound.stop()
        kirakiraSound.currentTime = 0.0
        kirakiraSound.play()
    }
    
    var body: some View {
        Button(action: {
            playSound()//追加④　メソッド発動
        }) {
            Text("効果音再生")
                .font(.title)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

以上です。

最後に

SwiftUIで音声を再生させる方法が、意外と調べても出てこなかったので書いてみました。

参考になれば幸いです。