ptamzz
ptamzz

Reputation: 9375

how to listen to click events on group of imageViews in appcelerator

I'm creating some imageViews as below.

// Time buttons
    var timeButtons =[
        { title: 'Afternoon', path: 'images/others/time/afternoon.png'},
        { title: 'CurrentTime', path: 'images/others/time/currenttime.png'},
        { title: 'Evening', path: 'images/others/time/evening.png'}
    ]


createButtons(timeButtons);


/* Button creation function */
function createButtons(data){

    for (var i = 0; i < data.length; i++){
        //Creating each button
        var button  = Titanium.UI.createImageView({
            image:  data[i].path,
            height: 90,
            width: 90,
            top: 20+90*i+20*i,
            value: 1
        });

        //Adding the buttons to the center view
        centerButtons.add(button);
    }
}

Now when a user clicks on any of the imageView, I want to identify which imageView it clicked and do something accordingly.

Upvotes: 0

Views: 1255

Answers (2)

TheJDP
TheJDP

Reputation: 126

you can additional add parameters to you imageView. Like id or so. Here your example with an additional parameter:

for (var i = 0; i < data.length; i++){
    //Creating each button
    var button  = Titanium.UI.createImageView({
        _id: i,    // Your custom parameter
        image:  data[i].path,
        height: 90,
        width: 90,
        top: 20+90*i+20*i,
        value: 1
    });

    //Adding the buttons to the center view
    centerButtons.add(button);
}

Than you can use the new parameter to identify your imageView:

centerButtons.addEventListener('click', function(event)
{
    // Perhaps you should check here if the custom parameter ( _id ) exist.

    switch(event.source._id){
        case 0:
            // Your stuff with you first image
            break;
        // etc.
    }
});

Upvotes: 2

Dawson Toth
Dawson Toth

Reputation: 5680

centerButtons.addEventListener('click', function(evt) {
    alert(evt.source.image);
});

Upvotes: 1

Related Questions