Carousel Touch ?

This thread here:

http://web-c3.anscamobile.com/forum/2010/11/20/carousel

I am trying to use it in a project, but I cannot figure out how to place a touch event listener to each of the icons/objects in the carousel, If someone could provide a quick example of how to do that I’d appreciate it.
Thank you :slight_smile:
[lua]
local NUM_ITEMS=20;
local radiusX= 200;
local radiusY= 40;
local centerX = 240;
local centerY = 160;
local speed = 0.05;
local perspective = 3;

local carousel = display.newGroup()
local icons = {}

local function zSort(myTable, myGroup)

table.sort(myTable,
function(a, b)
return a.depth < b.depth – depth is your custom field
end
)
for i = 1, #myTable do
myGroup:insert(myTable[i].img)
end

end

function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end

function update(event)

local icon
local sin = math.sin
local cos = math.cos

for i=1, NUM_ITEMS, 1 do

icon = icons[i]
local img = icon.img

img.x = cos(icon.angle) * radiusX + centerX
img.y = sin(icon.angle) * radiusY + centerY

local s = (img.y - perspective) / (centerX + radiusY - perspective)
img.xScale = s*0.25
img.yScale = s*0.25

icon.angle = (icon.angle + speed) --%math.rad(360)

icon.depth = s

end

zSort(icons, carousel)

end

for i=1, NUM_ITEMS, 1 do
local icon = Icon(i)
icons[i] = icon
end

function onTouch(event)
if(event.phase==“moved”) then
speed = (event.x - centerX) / 2000;
end
end

Runtime:addEventListener(“enterFrame”,update)
Runtime:addEventListener(“touch”, onTouch)
[/lua]
[import]uid: 58922 topic_id: 36496 reply_id: 336496[/import]

[lua]
function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
icon :addEventListener(“touch”, onIconTouch)
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
[/lua] [import]uid: 138389 topic_id: 36496 reply_id: 144785[/import]

Hi vovasoft,
that would make that event listener the same for all the icons in the table.
I need a method to have a different event listener for each icon in the table :slight_smile:
tyvm
[import]uid: 58922 topic_id: 36496 reply_id: 144815[/import]

[lua]function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
icon.tag = i
icon :addEventListener(“touch”, onIconTouch)
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
[/lua]
Now you should control icon.tag in onIconTouch listener [import]uid: 138389 topic_id: 36496 reply_id: 144817[/import]

works perfectly, thank you vovasoft :slight_smile:

[lua]
function Icon(i)

local this = {}
local icon = display.newImage(carousel, “image”…i…".png")
icon.tag = i
local function onIconTouch(event)
if icon.tag == 1 and event.phase == “ended” then
print(‘icon 1 touched’)
end
if icon.tag == 2 and event.phase == “ended” then
print(‘icon 2 touched’)
end
if icon.tag == 3 and event.phase == “ended” then
print(‘icon 3 touched’)
end
if icon.tag == 4 and event.phase == “ended” then
print(‘icon 4 touched’)
end
if icon.tag == 5 and event.phase == “ended” then
print(‘icon 5 touched’)
end
if icon.tag == 6 and event.phase == “ended” then
print(‘icon 6 touched’)
end
end
icon :addEventListener(“touch”, onIconTouch)
icon.rotation = 20
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon

return this
end
[/lua] [import]uid: 58922 topic_id: 36496 reply_id: 144822[/import]

try this:
[lua]
local function onIconTouch(event)
if event.phase == “ended” then
if icon.tag == 1 then
print(‘icon 1 touched’)
end
if icon.tag == 2 then
print(‘icon 2 touched’)
end
if icon.tag == 3 then
print(‘icon 3 touched’)
end
if icon.tag == 4 then
print(‘icon 4 touched’)
end
if icon.tag == 5 then
print(‘icon 5 touched’)
end
if icon.tag == 6 then
print(‘icon 6 touched’)
end
end
end
[/lua] [import]uid: 138389 topic_id: 36496 reply_id: 144824[/import]

Yep, that works as well, tyvm [import]uid: 58922 topic_id: 36496 reply_id: 144827[/import]

[lua]
function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
icon :addEventListener(“touch”, onIconTouch)
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
[/lua] [import]uid: 138389 topic_id: 36496 reply_id: 144785[/import]

Hi vovasoft,
that would make that event listener the same for all the icons in the table.
I need a method to have a different event listener for each icon in the table :slight_smile:
tyvm
[import]uid: 58922 topic_id: 36496 reply_id: 144815[/import]

[lua]function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
icon.tag = i
icon :addEventListener(“touch”, onIconTouch)
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
[/lua]
Now you should control icon.tag in onIconTouch listener [import]uid: 138389 topic_id: 36496 reply_id: 144817[/import]

works perfectly, thank you vovasoft :slight_smile:

[lua]
function Icon(i)

local this = {}
local icon = display.newImage(carousel, “image”…i…".png")
icon.tag = i
local function onIconTouch(event)
if icon.tag == 1 and event.phase == “ended” then
print(‘icon 1 touched’)
end
if icon.tag == 2 and event.phase == “ended” then
print(‘icon 2 touched’)
end
if icon.tag == 3 and event.phase == “ended” then
print(‘icon 3 touched’)
end
if icon.tag == 4 and event.phase == “ended” then
print(‘icon 4 touched’)
end
if icon.tag == 5 and event.phase == “ended” then
print(‘icon 5 touched’)
end
if icon.tag == 6 and event.phase == “ended” then
print(‘icon 6 touched’)
end
end
icon :addEventListener(“touch”, onIconTouch)
icon.rotation = 20
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon

return this
end
[/lua] [import]uid: 58922 topic_id: 36496 reply_id: 144822[/import]

try this:
[lua]
local function onIconTouch(event)
if event.phase == “ended” then
if icon.tag == 1 then
print(‘icon 1 touched’)
end
if icon.tag == 2 then
print(‘icon 2 touched’)
end
if icon.tag == 3 then
print(‘icon 3 touched’)
end
if icon.tag == 4 then
print(‘icon 4 touched’)
end
if icon.tag == 5 then
print(‘icon 5 touched’)
end
if icon.tag == 6 then
print(‘icon 6 touched’)
end
end
end
[/lua] [import]uid: 138389 topic_id: 36496 reply_id: 144824[/import]

Yep, that works as well, tyvm [import]uid: 58922 topic_id: 36496 reply_id: 144827[/import]

[lua]
function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
icon :addEventListener(“touch”, onIconTouch)
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
[/lua] [import]uid: 138389 topic_id: 36496 reply_id: 144785[/import]

Hi vovasoft,
that would make that event listener the same for all the icons in the table.
I need a method to have a different event listener for each icon in the table :slight_smile:
tyvm
[import]uid: 58922 topic_id: 36496 reply_id: 144815[/import]

[lua]function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
icon.tag = i
icon :addEventListener(“touch”, onIconTouch)
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
[/lua]
Now you should control icon.tag in onIconTouch listener [import]uid: 138389 topic_id: 36496 reply_id: 144817[/import]

works perfectly, thank you vovasoft :slight_smile:

[lua]
function Icon(i)

local this = {}
local icon = display.newImage(carousel, “image”…i…".png")
icon.tag = i
local function onIconTouch(event)
if icon.tag == 1 and event.phase == “ended” then
print(‘icon 1 touched’)
end
if icon.tag == 2 and event.phase == “ended” then
print(‘icon 2 touched’)
end
if icon.tag == 3 and event.phase == “ended” then
print(‘icon 3 touched’)
end
if icon.tag == 4 and event.phase == “ended” then
print(‘icon 4 touched’)
end
if icon.tag == 5 and event.phase == “ended” then
print(‘icon 5 touched’)
end
if icon.tag == 6 and event.phase == “ended” then
print(‘icon 6 touched’)
end
end
icon :addEventListener(“touch”, onIconTouch)
icon.rotation = 20
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon

return this
end
[/lua] [import]uid: 58922 topic_id: 36496 reply_id: 144822[/import]

try this:
[lua]
local function onIconTouch(event)
if event.phase == “ended” then
if icon.tag == 1 then
print(‘icon 1 touched’)
end
if icon.tag == 2 then
print(‘icon 2 touched’)
end
if icon.tag == 3 then
print(‘icon 3 touched’)
end
if icon.tag == 4 then
print(‘icon 4 touched’)
end
if icon.tag == 5 then
print(‘icon 5 touched’)
end
if icon.tag == 6 then
print(‘icon 6 touched’)
end
end
end
[/lua] [import]uid: 138389 topic_id: 36496 reply_id: 144824[/import]

Yep, that works as well, tyvm [import]uid: 58922 topic_id: 36496 reply_id: 144827[/import]

[lua]
function Icon(i)
local this = {}
local icon = display.newImage(carousel, “images/icon”…i…".png")
icon :addEventListener(“touch”, onIconTouch)
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
[/lua] [import]uid: 138389 topic_id: 36496 reply_id: 144785[/import]