#6 複数の音源から再生したい音源を選ぶーC4でAudio Playerをつくる(4)

この記事は「一人アドベントカレンダー2013〜Lonely Advent Calender 2013〜」の６日目の記事です。

ようやく「一人アドベントカレンダーやってるんですねｗ」と話しかけるようになりました。 前回はC4Sampleの音源の再生・停止をコントロールする機能を実装しました。かなりAudio Playerらしくなってきたのではないでしょうか。 今回はあらかじめプロジェクトに組み込んだ複数の音源を選んで再生する機能を実装したいと思います。

音源を選択するためのビューを表示する

これまで単一のビューでAudio Playerを実装してきましたが、音源の選択はさすがに別のビューを使って行いたいと思います。 C4ではいったいどのように新しい画面を追加するのかを調べてつつ、実装していきます。

音源選択画面を表示するためのボタン配置

まずはC4WorkSpace側に音源選択画面を表示するためのボタンを配置します。 例のごとく、前回のサンプルに追記していきます。

-(void)setupUI
{
    //再生・停止ボタン
    playbackButton = [C4Button buttonWithType:CUSTOM];
    playbackButton.frame = CGRectMake(0, 0, 28, 28);
    [playbackButton setBackgroundImage:[C4Image imageNamed:@"icon_play.png"] forState:NORMAL];
    [playbackButton setBackgroundImage:[C4Image imageNamed:@"icon_stop.png"] forState:SELECTED];
    
    playbackButton.center = self.canvas.center;
    [playbackButton runMethod:@"onPlaybackButton" target:self forEvent:TOUCHUPINSIDE];
    [self.canvas addSubview:playbackButton];
    
    //楽曲リスト表示ボタン <---追加
    playlistButton = [C4Button buttonWithType:CUSTOM];
    [playlistButton setBackgroundImage:[C4Image imageNamed:@"icon_list"] forState:NORMAL];
    playlistButton.frame = CGRectMake(self.canvas.width - 40, 30, 20, 25);
    [playlistButton runMethod:@"onPlaylistButton" target:self forEvent:TOUCHUPINSIDE];
    [self.canvas addSubview:playlistButton];

}

ボタンをタップした後の処理も用意しておきます。

-(void) onPlaylistButton
{
    
}

音源選択画面を作成する

ではC4において新たに画面を追加する場合はどうすればいいでしょうか。 画面の切り替えに関してはこの公式ページが詳しいです。 MultiCanvas : C4

こちらの内容を見てみると、遷移先のビュー（Canvas）の初期化の仕方に特徴があるようですが、それはまた別の機会に。

新たに以下の３つのファイルを追加します。 追加するときにsubクラス名をC4CanvasControllerを選択してください。