◆PROCESSING 逆引きリファレンス
カテゴリー：動画・アニメーション
動画の音量を変更するには
【解説】
PROCESSINGで 動画を扱うには、公式サイト 様に公開されている動画専用のライブラリ（Videoライブラリ）を使うのが便利です。
VideoライブラリのMovieクラスには、volume( ) という動画の音量をコントロールするメソッドがあります。
またMovieクラスのプロパティとして保持されている PlayBin2クラスでも、音量の制御が可能です。
【構文】
以下の構文にある movie はMovieクラスのインスタンス変数です。
●Movieクラスのメソッドを使う方法
void movie . volume( float setvol ) ;
setvol ：設定音量（ 0.0 – 1.0 ）
●PlayBin2クラスのメソッドを使う方法
PlayBin2 bin2 = movie . playbin ;
void bin2 . setVolume( double setvol ) ;
double getvol = bin2 . getVolume() ;
setvol ：設定音量（ 0.0 – 1.0 ）
getvol ：現在の音量（ 0.0 – 1.0 ）
【注意】
音量制御には2種類の方法があります。
簡単なのはMovieクラスが持つ volume() メソッドを使う方法です。
volume() メソッドに0.0を与えると音無し（ミュート）に、1.0を与えると最大音量になります。
特に値を設定していない場合、動画音量の初期値は1.0となっています。
ただしvolume()による制御は、play() メソッド実行中（動画再生中）でしか有効となりません。またMovieクラスには「現在の音量」を取得するメソッドがありません。
play() メソッド実行前に音量の制御を行いたい場合や、現在の音量を知りたい場合は、Movieクラスが持っている PlayBin2オブジェクトを使う事で実現可能です。
Movieクラスは、playbinプロパティにGStreamerのPlayBin2クラスのインスタンス変数を保持しています。このPlayBin2が持つ getVolume() メソッドで、「現在の音量」を取得する事ができます。
GStreamについては「動画を再生するには」記事を参照してください。
またPlayBin2クラスが持つsetVolume()メソッドでは、Movieクラスの volume()メソッドと同じく音量の制御が行えます。
与える音量の範囲はvolume() メソッドといっしょです。ただしこちらは play()メソッド実行前でも有効となりますので、使い勝手が良いかもしれません。
PlayBin2クラスについては、下記サイト様などが参考となります。
PlayBin2クラスを利用するには、スケッチの先頭に下記インポート文を記述してください。
import org.gstreamer.elements.* ;
【関連記事】
サンプルプログラム
volume()で音量を制御する例：
|
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 |
import processing.video.*; Movie movie; //Movieインスタンス boolean playing; //再生中FLG void setup(){ size(640, 360); //動画を読み込む movie = new Movie( this, "マルコメ 料亭の味 液みそ 上京篇 90秒.mp4"); playing = false; frameRate(60); } void draw(){ background( 0 ); //動画を表示する image( movie, 0, 0, width, height ); } //映像フレーム毎に自動呼び出しされるイベント void movieEvent( Movie m ) { //カレント位置の画像を取得 m.read(); } void mouseClicked(){ //範囲外がクリックされたら何もしない if( mouseX < 0 || mouseX > width || mouseY < 0 || mouseY > height ){ return; } if( playing == false ){ //ここに volume() 命令を書いても正しく動作しない //movie.volume( 0.5 ); //停止中なら再生する movie.play(); //音量は半分に設定する movie.volume( 0.5 ); playing = true; } else { //再生中なら停止する movie.pause(); playing = false; } } |
実行結果ウィンドウ内でマウスクリックすると、動画の再生を行います。
再生時に音量を半分（0.5）に設定しています。play() の前で volume() を実行しても正しく動作しないので注意してください。
PlayBin2を利用する例：
|
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 |
import processing.video.*; import org.gstreamer.elements.* ; Movie movie; //Movieインスタンス PlayBin2 bin2; //PlayBin2インスタンス boolean playing; //再生中FLG void setup(){ size(640, 360); //動画を読み込む movie = new Movie( this, "マルコメ 料亭の味 液みそ 上京篇 90秒.mp4"); //PlayBin2インスタンスを取得 bin2 = movie.playbin; frameRate(60); } void draw(){ background( 0 ); //動画を表示する image( movie, 0, 0, width, height ); } //映像フレーム毎に自動呼び出しされるイベント void movieEvent( Movie m ) { //カレント位置の画像を取得 m.read(); } void mouseClicked(){ //範囲外がクリックされたら何もしない if( mouseX < 0 || mouseX > width || mouseY < 0 || mouseY > height ){ return; } if( bin2.isPlaying() == false ){ //音量を半分に設定する bin2.setVolume( 0.5 ); println( "音量は" + bin2.getVolume() + "です" ); //停止中なら再生する movie.play(); } else { //再生中なら停止する movie.pause(); } } |
PlayBin2を利用して音量の設定と取得を行っています。PlayBin2のsetVolume() は play() 実行前でも有効です。
また先の例では動画再生中かどうかを playing という変数で管理していましたが、PlayBin2を利用すると isPlaying() メソッドで再生中か否かを取得できます。
isPlaying() については「動画の再生位置を変更するには」記事を参照してください。
応用例：
|
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 |
import processing.video.*; import org.gstreamer.elements.*; Movie movie; //Movieインスタンス PlayBin2 bin2; //PlayBin2インスタンス PImage play, stop, volMax, volMin; //制御ボタン PVector seekV; //シークバー開始座標 int seekW, seekH; //シークバーの幅と高さ float volume; //音量 color gray, lightBlue; //シークバーの色 int btnMinX; //最小音量ボタンの横位置 int movieHeight; //動画領域の高さ void setup(){ //動画の表示サイズは640×360 //360+ボタン高さ(48)=408が画面の高さ size(640, 408); //動画を読み込む movie = new Movie( this, "マルコメ 料亭の味 液みそ 上京篇 90秒.mp4"); bin2 = movie.playbin; frameRate(60); //制御ボタン画像を読み込む play = loadImage( "play.png" ); stop = loadImage( "stop.png" ); volMax = loadImage( "volMax.png" ); volMin = loadImage( "volMin.png" ); volume = 0.5; //初期音量 bin2.setVolume( volume ); btnMinX = 128; //最小音量ボタンの横位置 //シークバー開始位置 seekV = new PVector( btnMinX + volMin.width + 8, 370 ); //シークバー幅 seekW = width-(volMin.width + 8)-(volMax.width + 8)-btnMinX; seekH = 24; //シークバー高さ movieHeight = 360; //動画領域の高さ gray = color(128,128,128); lightBlue = color( 100,100,255); } void draw(){ background( 0 ); //動画を表示する image( movie, 0, 0, width, movieHeight ); //制御ボタンを表示する image( stop, 0, movieHeight ); image( play, stop.width,movieHeight ); image( volMin, btnMinX, movieHeight ); image( volMax, seekV.x + seekW + 8 , movieHeight ); //音量シークバーを描画する fill( gray ); rect( seekV.x, seekV.y, seekW, seekH ); fill( lightBlue ); rect( seekV.x, seekV.y, map( volume, 0, 1, 0, seekW ), seekH ); } //映像フレーム毎に自動呼び出しされるイベント void movieEvent( Movie m ) { //カレント位置の画像を取得 m.read(); } void mouseClicked(){ //範囲外がクリックされたら何もしない if( mouseY < movieHeight || mouseY > height ){ return; } //押されたボタンの動作を行う if( mouseX < stop.width ){ //停止 movie.stop(); } else if( mouseX < (stop.width + play.width) ){ //再生 movie.play(); } else if( mouseX > btnMinX && mouseX < width ){ //シークバーが操作された float x; if( mouseX < seekV.x ){ //左端を押された x = 0; } else if( mouseX > (seekV.x + seekW) ){ //右端を押された x = seekW; } else { //押された相対座標を計算 x = mouseX - seekV.x; } //押された相対座標を音量に変換 volume = map( x, 0, seekW, 0, 1 ); bin2.setVolume( volume ); } } |
応用例です。画面下に停止・再生を行う制御ボタンと、音量を制御するシークバーを設けました。
シークバーをクリックする事で音量を変化させる事が可能です。
＜出力サンプル＞
ボタン画像は illust-AC 様：ニコフ さん、至福の隙間 さん の画像を拝借しています。
また動画映像は、味噌や発酵食品で有名なマルコメ株式会社 様のテレビCMの1コマです。感動的なCMです。私は少しウルウルきました（笑）。
今回動画の掲載に関し、マルコメ株式会社 様より寛大なご許可を得ることができました。謹んでお礼申し上げます。
なお当サイトから動画を流用する行為は禁止とさせて頂いております。悪しからずご了承ください。
下記はサンプルプログラムと同じ動きになるように、 P5.js＋P5.dom で書き直したものです。動作イメージを確認できます。※
※ブラウザーによっては下記サンプルが表示されない事があります。動画が表示されない場合は IE11、FireFox、Chrome、Edge などでお試しください。
本ページで利用しているアイコン画像は、下記サイト様より拝借しております。各画像の著作権は、それぞれのサイト様および作者にあります。