AudioPlayer 소개

AudioPlayer는 오디오 파일을 재생하는데 필요한 기능을 제공하는 오브젝트입니다. mp3, mp4, wav, ogg, 3gp 등의 다양한 포맷을 재생할 수 있으며 기본 재생 기능뿐 아니라 스피커 밸런스 조정, 반복 재생, 구간 반복 등의 기능도 제공합니다. 사용자는 제공되는 오브젝트의 기능을 조합해 원하는 형태로 오디오 플레이어를 구현할 수 있습니다.

오디오 재생하기

AudioPlayer 오브젝트의 기능을 사용해 간단한 오디오 재생기를 구현합니다. 기본적인 오디오 파일의 재생 절차는 크게 오디오 파일의 로딩과 재생의 두 단계로 나눌 수 있습니다.

오디오 파일의 로딩은 load 메소드를 사용합니다. 오디오 파일의 파일명을 경로와 함께 입력합니다. 오디오 파일의 로딩에 성공하면 경로 정보는 url 속성에 재생 시간 정보는 duration 속성에 자동 설정됩니다.

오디오 파일의 재생은 play, stop, pause, resume 메소드를 사용합니다. 인터페이스를 구성하며 필요에 따라 적절히 조합해서 사용하면 재생에 필요한 여러 기능을 구현 할 수 있습니다. play 메소드 호출 시 인수로 전달하는 interval time은 오디오 재생 중 주기적으로 onplaying 이벤트를 발생하게 해줍니다.

예제

다음은 오디오 파일을 로딩한 후 재생하는 단순한 형태의 오디오 재생기 예제입니다.

화면이 출력되면 자동으로 미리 설정된 오디오 파일을 로딩합니다. 하단의 Play, Pause, Stop 버튼을 이용하여 재생 기능을 조작할 수 있습니다. Play 버튼을 터치하면 재생이 시작되며 Pause 버튼으로 변경됩니다. Pause 버튼을 터치하면 재생이 일시 중지되고 Stop 버튼을 터치하면 재생이 중지됩니다.

재생의 진행은 진행표시줄과 시간으로 표시됩니다.

예제에서 사용한 핵심 기능

AudioPlayer > load 메소드

오디오 파일을 재생할 수 있도록 AudioPlayer에 로딩하는 메소드입니다. 인수로 경로와 함께 파일명을 입력합니다.

AudioPlayer > play 메소드

로딩된 오디오 파일을 재생하는 메소드입니다. 인수로 시간 값을 설정하는데 시간 값에 따라 주기적으로 onplaying 이벤트가 발생합니다. 메소드를 수행하면 onplay 이벤트가 발생하고 설정한 인수 값을 주기로 onplaying 이벤트가 발생합니다. 재생 시작 시 e.reason 속성값은 1이며 재생 중에는 3이 됩니다.

AudioPlayer > stop 메소드

오디오 파일의 재생을 중지하는 메소드입니다. 재생을 중지하면 onstop 이벤트가 발생합니다. e.reason 속성값은 5입니다.

AudioPlayer > pause 메소드

재생중인 오디오 파일을 일시 중지하는 메소드입니다. pause 메소드를 호출하면 onstop 이벤트가 발생합니다. e.reason 속성값은 6입니다.

AudioPlayer > resume 메소드

일시 중지 상태의 오디오 파일을 다시 재생하는 메소드입니다. 메소드가 수행되면 onplay 이벤트가 발생합니다. e.reason 속성값은 2입니다.

AudioPlayer > url 속성

AudioPlayer에 로딩된 오디오 파일의 경로 정보를 갖는 읽기 전용 속성입니다. load 메소드 호출 시 설정한 오디오 파일의 경로가 자동으로 설정됩니다.

예제 구현 방법

AudioPlayer 오브젝트를 추가합니다. 추가된 오브젝트는 Invisible Object 창에서 확인할 수 있습니다.

현재 파일 경로 정보를 Static 컴포넌트, 재생 진행 상황을 표시할 ProgressBar 컴포넌트, 재생/일시 중지/멈춤 기능을 수행할 Button 컴포넌트를 예제의 그림과 같이 적절히 배치합니다.

화면 구성을 위해 사용한 컴포넌트 및 오브젝트는 다음과 같습니다.

플레이어의 상태 정보를 관리하기 위해 enum 타입의 전역 변수를 선언합니다.

eStatus = {
	LOAD: 0,
	PLAY: 1,
	RESUME: 2,
	PLAYING: 3,
	ENDOFPLAY: 4,
	STOP: 5,
	PAUSE: 6,
	SEEK: 7
};
var ePlayerStatus = eStatus;

로딩된 오디오 파일의 재생 시간을 사용자가 보기 편하도록 분, 초로 변환하는 메소드를 다음과 같이 작성합니다.

this.convertTime = function(nTime)
{
	var nMin = parseInt((nTime / 1000) / 60);
	var nSec = parseInt((nTime / 1000) % 60);

	var strTime = nMin.toString() +"min "+ nSec.toString() +"sec";
		
	return strTime;
}

재생 중에 현재 진행 상태를 한눈에 볼 수 있도록 진행표시줄을 설정하는 메소드를 다음과 같이 작성합니다.

this.updateProgress = function(nCurrentTime, nTotalTime)
{
	var strPercentage = parseInt((nCurrentTime / nTotalTime) * 100);
		
	this.prb_time.set_pos(strPercentage);
}

재생이 멈추거나 완료되면 진행 상태를 표시하는 진행표시줄을 초기화하는 메소드를 다음과 같이 작성합니다.

this.initProgress = function()
{
	this.prb_time.set_pos(0);
	this.prb_time.set_text(this.convertTime(this.AudioPlayer00.duration));
}

Form의 onload 이벤트 함수를 다음과 같이 작성합니다. Form이 로딩되면 사전에 설정된 오디오 파일의 경로를 AudioPlayer 오브젝트에 로딩합니다.

this.sample_audioplayer_01_onload = function(obj:nexacro.Form,e:nexacro.LoadEventInfo)
{
	var strFilePath = "%USERAPP%File/Dutch Swing College Band - Aux Champs Elysees.mp3";

	this.AudioPlayer00.load(strFilePath);
};

오디오 파일이 로딩된 후 발생하는 onload 이벤트 함수를 작성합니다.

this.AudioPlayer00_onload = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{
	this.stt_filepath.set_text(this.AudioPlayer00.url);
	this.initProgress();	
};

오디오 파일의 재생이 시작될 때 발생하는 onplay 이벤트 함수를 작성합니다.

this.AudioPlayer00_onplay = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{
	ePlayerStatus = eStatus.PLAY;
	this.btn_play.set_text("Pause");
};

오디오 파일의 재생 중에 주기적으로 발생하는 onplaying 이벤트 함수를 작성합니다.

this.AudioPlayer00_onplaying = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{
	this.prb_time.set_text(this.convertTime(this.AudioPlayer00.currentpos) +" / "+ this.convertTime(this.AudioPlayer00.duration));
	this.updateProgress(this.AudioPlayer00.currentpos, this.AudioPlayer00.duration);
};

오디오 파일의 재생이 멈출 때 발생하는 onstop 이벤트 함수를 작성합니다.

this.AudioPlayer00_onstop = function(obj:nexacro.AudioPlayer,e:nexacro.AudioEventInfo)
{	
	switch(e.reason)
	{
		case 4: //End of play
			ePlayerStatus = eStatus.ENDOFPLAY;
			this.initProgress();
			
		case 5: //STOP
			ePlayerStatus = eStatus.STOP;
			this.initProgress();
			break;

		case 6:	//PAUSE			
			ePlayerStatus = eStatus.PAUSE;
			break;
	}
	
	this.btn_play.set_text("Play");
	
};

AudioPlayer 오브젝트에서 오디오 파일에 대한 처리가 실패했을 때 발생하는 onerror 이벤트 함수를 작성합니다.

this.AudioPlayer00_onerror = function(obj:nexacro.AudioPlayer,e:nexacro.AudioErrorEventInfo)
{
	var strResult = "["+ e.errortype +"] "+ e.statuscode +" "+ e.errormsg;
	
	trace(strResult);
};

Play/Pause 버튼을 터치했을 때 발생하는 onclick 이벤트 함수를 작성합니다. 현재 플레이어 상태에 따라 어떤 기능을 수행할지 처리합니다.

this.btn_play_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	var nIntervalTime = 1000;	//ms
	
	switch(ePlayerStatus)
	{
		case eStatus.PAUSE:
			this.AudioPlayer00.resume();
			break;
		case eStatus.PLAY:
			this.AudioPlayer00.pause();
			break;
		default:
			this.AudioPlayer00.play(nIntervalTime);
	}

Stop 버튼을 터치했을 때 발생하는 onclick 이벤트 함수를 작성합니다.

this.btn_stop_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	this.AudioPlayer00.stop();
};

Form이 로딩되면 자동으로 오디오 파일이 로딩되어 재생 준비가 완료됩니다.

하단의 Play, Pause, Stop 버튼을 사용하여 오디오 파일의 재생, 일시정지, 멈춤 기능이 정상 동작하는지 확인합니다. 재생이 시작되면 재생 시간과 진행 상태가 진행표시줄에 표시됩니다.