このページの本文へ

NimbleKitで自分だけのiPodアプリを作ろう (2/4)

2011年06月23日 11時00分更新

文●古籏一浩

  • この記事をはてなブックマークに追加
本文印刷

繰り返し再生や停止の処理

 単純な再生ができるようになったら、もう少し機能を追加してみましょう。オーディオを停止させるにはstop()メソッドを使います。stop()はオーディオの再生を停止し、再生位置を先頭に戻すメソッドです。stop()メソッド実行後にplay()メソッドを実行するとオーディオは先頭から再生されます。

 再生位置を変更したくない場合(一時停止させたい場合)は、pause()メソッドを使います。pause()メソッドで一時停止させた位置から再生を再開するのはresume()メソッドです。ただし、一時停止中かどうかを示すプロパティはありませんので、状態は変数で保持する必要があります。

 続いて、繰り返し再生も設定できるようにしましょう。NKAudioPlayerでは、setLoopMode()メソッドで繰り返し再生の有無を指定できます。setLoopMode()メソッドの引数に"yes"か1を指定すると繰り返し再生され、"no"か0を指定すると解除されます。

 セレクトメニューで選択したオーディオファイルを再生/停止/繰り返し再生できるようにしたのがサンプル2です。

■サンプル2[HTML]

<html>
<head>
<meta name = "viewport" content = "initial-scale = 1.0, user-scalable = no" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="NKit.js"></script>
</head>
<body>
<form>
  <select id="musicNumber">
    <option value="music/Pop1.mp3">Pop1</option>
    <option value="music/Pop2.mp3">Pop2</option>
    <option value="music/Pop3.mp3">Pop3</option>
  </select>
  <br>
  <input type="checkbox" value="false" id="loopCheck">繰り返し再生<br>
  <input type="button" value="Play" id="playButton"><br>
  <input type="button" value="Stop" id="stopButton"><br>
</form>
<script>
  var player;
  player = new NKAudioPlayer();
  player.loadFile("music/Pop1.mp3");
  document.getElementById("musicNumber").onchange = function(){
    player.loadFile(this.value);
  }
  document.getElementById("loopCheck").onclick = function(){
    if(this.value){
      player.setLoopMode("yes");
    }else{
      player.setLoopMode("no");
    }
  }
  document.getElementById("playButton").onclick = function(){
    player.play();
  }
  document.getElementById("stopButton").onclick = function(){
    player.stop();
  }
</script>
</body>
</html>

この連載の記事

一覧へ

この記事の編集者は以下の記事をオススメしています