◆PROCESSING 逆引きリファレンス
カテゴリー:音楽・演奏
BGMの再生位置を制御する(minim編)
【解説】
minimは、PROCESSINGで手軽に音楽を演奏できるライブラリです。
minimについて、より詳しく知りたい方は下記公式サイト 様を参照して下さい。
音楽の演奏では、単純に最初から最後まで順番に演奏をするだけではなく、早送りや巻き戻しを行いたい事があります。
また最後まで演奏したら最初に戻って繰り返し再生する(リピート再生)を行いたい場合もありますよね。
minim には、このような用途に利用可能な「再生位置をコントロールする機能」が備わっています。
AudioPlayer クラスの cue() メソッドを利用すると、指定したミリセカンド位置から再生を始めることが可能です。
早送りや巻き戻しを行うには、現在再生中の位置を知る必要があります。今演奏している場所から xxxミリセカンド(前後)に再生位置を移動するわけです。
現在再生中の位置は AudioPlayer クラスの position() メソッドで取得可能です。また音楽ファイル全体の演奏時間は AudioPlayer クラスの length() メソッドで取得できます。
演奏が終了すると、再生位置は自動的に音楽ファイルの最後尾に位置づけられます。この状態から引数なしで AudioPlayer クラスのplay() メソッドを発行しても、先頭から音楽が再生される事はありません。
(画像URL:illust-AC 様:任々堂工房 さん)
このような場合は、AudioPlayer クラスの rewind() メソッドで再生位置を先頭に戻してから play() メソッドを発行します。先頭から直ちに再生して良いのであれば play( 0 ) とする方法もあります(笑)。
【構文】
●指定した位置を再生位置にする
void player . cue( int millis ) ;
●再生位置を先頭にする
void player.rewind( ) ;
●現在の再生位置を知る
int pos = player.position( ) ;
●音楽ファイルの演奏時間を知る
int len = player.length( ) ;
player は AudioPlayerクラスのインスタンス変数です。
【パラメータ】
millis : 再生を開始する位置(ミリセカンド)
pos : 現在の再生位置(ミリセカンド)
len : 音楽ファイルの長さ(演奏時間。ミリセカンド)
【注意】
cue() メソッドについて
cue() メソッドに与えるのは、先頭からの演奏時間です。
例えば 6000ミリセカンド(6秒)の演奏時間がある音楽ファイルに cue( 4000 ) ; と指定すると、先頭から4秒経過した位置を新しい再生位置とします。
cue() メソッドに、音楽ファイルの演奏時間より大きな値を与えた場合は、再生位置が最後尾になります。0 または負の値を与えると、再生位置は先頭になります。
position() メソッドについて
position() メソッドで得られる値は、現在の再生位置です。例えば 2000 が戻ってきたとしたら、先頭から2秒間経過した場所がその時点の再生位置だという事になります。
当然ですが、演奏中は刻一刻と再生位置が変化します。position() で得られる値も変化する事になるので注意して下さい。
length() メソッドについて
lenght() メソッドで得られる値は、loadFile() メソッドで読み込んだ音楽ファイルのトータル演奏時間です。例えば 5000 が戻ってきたとしたら、全部で5秒間の演奏時間があるという事になります。
rewind() メソッドについて
rewind()メソッドは、再生位置を必ず音楽ファイルの先頭に位置づけます。minim の内部では cue ( 0 ) ; と同じ処理を行っています。
rewind() しても再生を開始するわけではありません。あくまで再生位置を変更するのみです。
【関連記事】
- 音楽の再生準備を行う(minim編)
- サポート機能を判定する(minim編)
- BGMのボリュームを制御する(minim編)
- BGMの再生・停止を行う(minim編)
- BGMの消音を制御する(minim編)
- BGMのバランスを制御する(minim編)
- 音楽ファイルのメタ情報を取得する(minim編)
- BGMの周波数を分析する(minim編)
サンプルプログラム
再生位置を先頭に巻き戻す例:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
import ddf.minim.*; //宣言 Minim mini; //Minimオブジェクト変数 AudioPlayer player; //音楽制御用インスタンス //------------------------ // 初期処理関数 //------------------------ void setup(){ boolean breakFlg = false; //初期処理エラーFLG size(200,200); //Minimインスタンスを作成する mini = new Minim( this ); //音楽ファイルを読み込む player = mini.loadFile("bgm.mp3"); if( player == null ){ println( "loadFile() error" ); breakFlg = true; } textSize( 16 ); textAlign( LEFT, TOP ); if( breakFlg == true ){ //エラーなら終了 noLoop(); exit(); } } //------------------------ // 描画処理関数 //------------------------ void draw(){ background( 255 ); //状態表示 String msg; if( player.isPlaying() ){ msg = "Playing"; } else { msg = "Stopped"; } fill( 0 ); text( msg, 64, 32 ); } //------------------------ // マウス押下イベント //------------------------ void mouseClicked(){ //マウス押下縦位置検査 if( player.isPlaying() == false ){ //必ず先頭から演奏開始 player.rewind(); player.play(); } } |
マウスをクリックすると演奏を開始します。
毎回からなず音楽ファイルの先頭から再生されるように、play()する前に rewind() メソッドで再生位置を先頭に巻き戻しています。
ミニ音楽プレーヤー例:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 |
import ddf.minim.*; //宣言 Minim mini; //Minimオブジェクト変数 AudioPlayer player; //音楽制御用インスタンス myButton button[];//ボタン seekBar bar; //シークバー boolean pauseFlg = false; //一時停止FLG //------------------------ //シークバークラス //------------------------ class seekBar{ //描画 void disp( AudioPlayer play ){ //現在の再生位置 float pos = play.position(); //シークバーの土台を描く fill( 128 ); rect( 8, 64, width-16, 24 ); //再生位置までバーを伸ばす float bx = map( pos, 0f, play.length(), 0f, width-16 ); fill( color( 80,80,255 ) ); rect( 8, 64, bx, 24 ); //再生位置と状態を文字で表示する String msg = ""; if( player.isPlaying() == true ){ msg = "Playing :" + int(pos); } else { msg = "Stopped :" + int(pos); } textSize( 16 ); textAlign( LEFT, TOP ); fill( 255 ); text( msg, 16, 66 ); } } //------------------------ //ボタンクラス //------------------------ class myButton{ PImage img = null; int bw, bh; int bx, by; //コンストラクタ myButton( String fileName ){ img = loadImage( fileName ); bw = img.width; bh = img.height; } //表示関数 void disp( int x, int y ){ bx = x; by = y; image( img, bx, by ); } //押下判定関数 boolean isPush( int x, int y ){ boolean ret = false; if( x > bx && x < bx + img.width && y > by && y < by + img.height ){ ret = true; } return( ret ); } } //------------------------ // 初期処理関数 //------------------------ void setup(){ boolean breakFlg = false; //初期処理エラーFLG size(192,200); //Minimインスタンスを作成する mini = new Minim( this ); //ボタン画像を読み込む button = new myButton[4]; button[0] = new myButton( "rewind.png" ); button[1] = new myButton( "play.png" ); button[2] = new myButton( "stop.png" ); button[3] = new myButton( "step.png" ); //シークバーを生成する bar = new seekBar( ); //音楽ファイルを読み込む player = mini.loadFile("bgm.mp3"); if( player == null ){ println( "loadFile() error" ); breakFlg = true; } if( breakFlg == true ){ //エラーなら終了 noLoop(); exit(); } } //------------------------ // 描画処理関数 //------------------------ void draw(){ background( 255 ); //画面下部にボタンを描画する int x, y; x = 0; y = height - button[0].bh; for( int i = 0; i < 4; i++ ){ button[i].disp( x, y ); x = x + button[i].bw; } //シークバーを描画する bar.disp( player ); } //------------------------ // マウス押下イベント //------------------------ void mouseClicked(){ //どのボタンがクリックされたか調べる for( int i = 0; i < 4; i++ ){ if( button[i].isPush( mouseX, mouseY ) == true ){ switch( i ){ case 0: //巻き戻し if( player.isPlaying() == true ){ player.cue( nowPos-5000 ); //5秒前へ } break; case 1: //再生 pauseFlg = false; player.rewind(); player.play(); break; case 2: //停止 if( player.isPlaying() == true ){ player.pause(); pauseFlg = true; } else { if( pauseFlg == true ){ //停止中なら再開 player.play(); pauseFlg = false; } } break; case 3: //早送り if( player.isPlaying() == true ){ player.cue( nowPos+4000 ); //4秒先へ } break; } break; } } } |
ちょっとした音楽プレーヤーです。巻き戻し、再生、一時停止、早送りが可能です。
一時停止中に再度停止ボタンを押すと、停止していた箇所から続きを演奏します。再生ボタンを押した場合は、必ず先頭から演奏を行います。
早送り、巻き戻しボタンの処理で、cue() メソッドを利用しています。またシークバーを伸ばす処理で、position() メソッドにより現在の再生位置を取得しています。
<出力サンプル>
下記はサンプルプログラムと同じ動きになるように、 P5.js+P5.sound で書き直したものです。動作イメージを確認できます。※
なおブラウザーのSOUND API ( P5.sound )とminim の仕様の違いにより、上記サンプルプログラムと下記動作例は、すこしだけ異なっています。
- P5.sound では再生位置は秒単位の表示になる
- 早送りを連打すると動作が不安定・・・(汗)
※ブラウザーによっては下記サンプルが表示されない事があります。IE11はNGでした。動作イメージを確認したい方は、FireFox、Chrome、Edgeなどでお試しください。
演奏される音楽は、魔王魂 様から拝借しました。物凄くカッコイイ音楽です。ありがとうございます。
本ページで利用しているアイコン画像は、下記サイト様より拝借しております。各画像の著作権は、それぞれのサイト様および作者にあります。