【Apple Vision Pro】簡単なオーディオ再生UIの構築
はじめに
こんにちは。
モバイルソリューショングループのyoshino.kです。
この記事は アイソルート Advent Calendar 2024 6日目の記事です。
この記事では、visionOSで簡単なオーディオ再生機能を実現する方法を解説します。
2つのボタンを備えたシンプルなUIを構築し、オーディオファイルの再生・停止ができるコードを実装します。
目次
必要な準備
プロジェクトの作成
Xcodeで新しいvisionOSプロジェクトを作成します。テンプレートとして visionOS App を選択してください。
オーディオファイルの準備
使用するオーディオファイル（ここでは audio_sample.mp3 ）を用意しプロジェクトに追加してください。
プロジェクトの配下に、Resourcesディレクトリを作成しオーディオファイルを配置します。
配置した後、ResourcesディレクトリをXcodeへドラッグ＆ドロップします。
「Copy items if needed」にチェックを入れ、ターゲットに正しく追加されていることを確認してください。
オーディオ再生・停止の設定
オーディオの読み込みおよび再生・停止機能を実装します。
オーディオファイル名は “audio_sample” として実装していますので、ファイル名に合わせて変更してください。
setupAudioメソッドに引数を追加して、オーディオを指定可能にすることもできます。
import AVFoundation
import SwiftUI
class AudioManager: ObservableObject {
private var audioEngine = AVAudioEngine()
private var playerNode = AVAudioPlayerNode()
private var audioFile: AVAudioFile?
func setupAudio() {
guard let audioFileURL = Bundle.main.url(forResource: "audio_sample", withExtension: "mp3") else {
print("Audio file not found!")
return
}
do {
audioFile = try AVAudioFile(forReading: audioFileURL)
audioEngine.attach(playerNode)
audioEngine.connect(playerNode, to: audioEngine.outputNode, format: audioFile?.processingFormat)
try audioEngine.start()
} catch {
print("Error during audio setup: \(error.localizedDescription)")
}
}
func playAudio() {
guard let audioFile = audioFile else { return }
if !playerNode.isPlaying {
playerNode.scheduleFile(audioFile, at: nil, completionHandler: nil)
playerNode.play()
print("Audio is playing.")
}
}
func stopAudio() {
if playerNode.isPlaying {
playerNode.stop()
print("Audio stopped.")
}
}
}
オーディオ操作用のUI構築
ここではオーディオ操作用のUIを作成します。
UIは、ビューの上に2つのボタンを配置した簡単なものになります。
・再生ボタン：タップ時に指定されたオーディオファイルを再生する
・停止ボタン：タップ時に再生中のオーディオファイルを停止する
import SwiftUI
import RealityKit
import RealityKitContent
struct ContentView: View {
@StateObject private var audioManager = AudioManager()
var body: some View {
VStack {
Button("再生") {
audioManager.playAudio()
}
.padding()
.background(Color.blue)
.foregroundColor(.white)
.cornerRadius(10)
Button("停止") {
audioManager.stopAudio()
}
.padding()
.background(Color.red)
.foregroundColor(.white)
.cornerRadius(10)
}
.onAppear {
audioManager.setupAudio()
}
}
}
メインクラスでContentViewを呼び出し、作成したUIを表示します。
import SwiftUI
@main
struct AudioApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
これでオーディオの再生・停止が可能なアプリを実現できます。
visionOSでも特に難しい点はなく実装できました！
さいごに
今回は、visionOSでのオーディオ再生機能のチュートリアルとして記事を作成しました。
基礎的な機能ですが仕組みを拡張することで、さらに魅力的なオーディオ体験を提供できると考えています。
オーディオの発信源を3Dオブジェクトに設定することで、よりリアルな3Dライブやリモート飲み会を表現することもできそうです！
今後も面白い活用法を模索して、Apple Vision Proの可能性を引き出していきたいと思います！
明日は shimizu.sho さんの 【生成AI】Claude.aiのArtifactsを触ってみました です。お楽しみに！
