Dynamically Assign Listener to Button
I am working on my first project using Appcelerator: Soundboard.
I am using a while loop to create multiple buttons and assign event listeners to play sounds when button is clicked. Code below.
var buttons = new Array();
var sounds = new Array();
var snd = new Array();
sounds[0] = '../sounds/mrt/asus.wav';
sounds[1] = '../sounds/mrt/asus.wav';
sounds[2] = '../sounds/mrt/audio3.wav';
sounds[3] = '../sounds/mrt/audio5.wav';
sounds[4] = '../sounds/mrt/camera.wav';
sounds[5] = '../sounds/mrt/asus.wav';
sounds[6] = '../sounds/mrt/asus.wav';
var itemCount = sounds.length;
var i = 0;
var pos = 1;
while(i<(itemCount/2)) {
var position = pos * 50;
var btn_title = 'Button ' + i;
buttons[i] = Ti.UI.createButton({ title: btn_title, opacity: btn_opacity, backgroundColor:btn_bgcolor, color:btn_textcolor, borderColor:btn_bordercolor, borderWidth:btn_borderwidth, height: btn_height, width:btn_width, borderRadius: btn_borderRadius, top: position, left:25 });
win1.add(buttons[i]);
buttons[i].addEventListener('click',function(e){
snd[i] = Ti.Media.createSound({ url: sounds[i] }).play(); //Issue here with assigning sounds
Ti.API.info("Playing Sound: " + i + sounds[i] + ", snd " + i + " - " + snd[i]); //Information
});
i++;
pos++;
}
All the buttons are created just fine but all buttons are assigned with sound[5] only unless I manually enter the absolute file name of the .wav.
Trace Output below on multiple button presses:
[INFO] [134,18496] Playing Sound: 5../sounds/mrt/asus.wav, snd 5 - ti.modules.titanium.media.SoundProxy@44fa54b0
[TRACE] E/TiUIView( 263): (main) [6154,24650] TAP, TAP, TAP
[TRACE] D/AudioSink( 34): bufferCount (4) is too small and increased to 12
[INFO] [135,24785] Playing Sound: 5../sounds/mrt/asus.wav, snd 5 - ti.modules.titanium.media.SoundProxy@44f378a0
[TRACE] E/TiUIView( 263): (main) [16809,41594] TAP, TAP, TAP
[TRACE] D/AudioSink( 34): bufferCount (4) is too small and increased to 12
[INFO] [178,41772] Playing Sound: 5../sounds/mrt/asus.wav, snd 5 - ti.modules.titanium.media.SoundProxy@44f8ac78
[TRACE] E/TiUIView( 263): (main) [2802,44574] TAP, TAP, TAP
[TRACE] D/AudioSink( 34): bufferCount (4) is too small and increased to 12
[INFO] [136,44710] Playing Sound: 5../sounds/mrt/asus.wav, snd 5 - ti.modules.titanium.media.SoundProxy@44fad868
2 Answers
-
Accepted Answer
Here is what you do:
buttons[i] = Ti.UI.createButton({ .......... //Add this my_id:i });
This can be fetched again later
buttons[i].addEventListener('click',function(e)){ var i = e.source.my_id; snd[i] = Ti.Media.createSound({ url: sounds[i] }).play(); Ti.API.info("Playing Sound: " + i + sounds[i] + ", snd " + i + " - " + snd[i]); });
or
buttons[i].addEventListener('click',function(e)){ var i = e.source.my_id; playSound(i); //And create a function that handles this. });
-
I dont think you can chain the functions the way you have… try this
snd[i] = Ti.Media.createSound({ url: sounds[i] }); snd[i].play();