Change image on touch

Games
#1

Hi all,

I have been reading the docs for 6 hours now and am lost???

Can somebody point me to the documentation, that will help explain how to change an objects image, using the touch event listener. There is so much info in the docs I seem to be going round in circles…

Also in the transition.to function, can it be used to rotate an object as well as move it’s position?

These seem very simple questions I know, but I have got myself into a muddle with all the docs.

Thanks
Chris [import]uid: 7388 topic_id: 5174 reply_id: 305174[/import]

#2

So for changing the image there might be an easier way to do this, but what I would do is:

local rect = display.newRect( 100, 200, 40, 40)  
rect:setFillColor( 255, 100, 100 )  
  
function rectlistener()  
  
 local rect = display.newRect( 100, 200, 40, 40)  
 rect:setFillColor( 50, 50, 255 )  
  
end  
  
rect:addEventListener("touch", rectlistener )

It might be different if this object is moving or if it needs to change multiple times, but a stationary object that needs to change once works for the code above.

For the rotation, there is a way to do it, I’m not sure off the top of my head though. The documentation seems kinda poor on that, which is unfortunate as transitions are really useful. [import]uid: 10903 topic_id: 5174 reply_id: 17162[/import]

#3

Apologies you asked about switching images. Code modified to reflect:

[code]

local img = display.newImage( “ball01.png” )
img.x = 100; img.y = 200

function rectlistener()

img:removeSelf()
img = display.newImage( “avoid01.png” )
img.x = 100; img.y = 200

end

img:addEventListener(“touch”, rectlistener )

[/code] [import]uid: 10903 topic_id: 5174 reply_id: 17164[/import]

#4

Cheers Crsmn,

that helps loads, i think that they need a bit of user generated code repository, with just snippets of code.

many Thanks once again and i shall keep looking for the rotate method

Chris [import]uid: 7388 topic_id: 5174 reply_id: 17230[/import]

#5

@chrisal

check the “Code Exchange” its where we put our code samples [import]uid: 5354 topic_id: 5174 reply_id: 17254[/import]

#6

Maybe this will help you!!!

you also need to have the movieclip.lua

[lua]require “movieclip”

myAnim = movieclip.newAnim{ “img1.png”, “img2.png” }
myAnim.x=100
myAnim.y=100

function step(event)
myAnim:nextFrame()
end

Runtime:addEventListener(“tap”, step)

–if you want to use touch
–Runtime:addEventListener(“touch”, step)[/lua] [import]uid: 65047 topic_id: 5174 reply_id: 63104[/import]

#7

also for rotation you can use transition.to…

transition.to(yourImage, {time=400, rotation=360})

Its as simple as that if you want a simple rotation. [import]uid: 69826 topic_id: 5174 reply_id: 63109[/import]

#8

How to swap images on the touch?Its like I touch img1 and then touched img2 then both the images get swapped.likewise whenever i touch any two images in my table the to images swap each other…please help me if anybody can? this is what I have done till now…

[code]

module(…, package.seeall)

function new()
local localGroup = display.newGroup()

local alpha = {{“alpha_a”} , {“alpha_b”} , {“alpha_c”} , {“alpha_d”} ,
{“alpha_e”} , {“alpha_f”} , {“alpha_g”} , {“alpha_h”}}

local coordinates ={
{x=092, y=470}, {x=197, y=470}, {x=302, y=470},
{x=407, y=470}, {x=512, y=470}, {x=617, y=470},
{x=722, y=470}, {x=827, y=470} }

for i=1, #alpha do
local selection = table.remove(coordinates, math.random(#coordinates))
print(selection.x,selection.y, #coordinates)
images = display.newImage(alpha[i][1]…".png")
images.x = selection.x
images.y = selection.y
images.touch = _G[alpha[i][2]]
images:addEventListener(“touch”,images)

end

return localGroup
end
[/code] [import]uid: 82446 topic_id: 5174 reply_id: 63096[/import]

#9

Useful Function showFrame (clip, framenum)
I did not want to add on to the already cool movieclip library provided in the Corona samples included in the download, so I added a little function of my own to switch to the relevant frame. Feel free to use it.
[lua]local movieclip = require “movieclip”

local function showFrame(clip, framenum)
while (clip:currentFrame() ~= framenum) do
clip:nextFrame()
end
end

local hero=movieclip.newAnim{“left.png”,“right.png”,“up.png”,“down.png” }

showFrame( hero, 1 ) --make dino look left

– continue with game logic

showFrame( hero, 3 ) --make dino look up[/lua] [import]uid: 58387 topic_id: 5174 reply_id: 63524[/import]

#10

@ crssmn

How can I apply this chunk of code

[lua] local img = display.newImage( “ball01.png” )
img.x = 100; img.y = 200

function rectlistener()

img:removeSelf()
img = display.newImage( “avoid01.png” )
img.x = 100; img.y = 200

end

img:addEventListener(“touch”, rectlistener )[/lua]

To an image I have created in a table. So when I touch the images in the table they turn into another image entirely… Heres the code I am working with

[lua]display.setStatusBar( display.HiddenStatusBar ) – HIDE STATUS BAR
local loqsprite = require(‘loq_sprite’)
math.randomseed(os.time())
math.random()

local _W = display.contentWidth
local _H = display.contentHeight
local objects = {}
local speed = 5
local i
local x0 , y0, x1, x2
local t1 = {

{ x = 650, y = 365 },
{ x = 350, y = 380 },
{ x = 600, y = 480 },
{ x = 400, y = 550 },
{ x = 700, y = 600 },

}

local background = display.newImageRect(“background.png”, 1024, 768)
background.x = _W/2; background.y = _H/2

function tapped(event)
event.target:removeEventListener(“tap”, tapped)
event.target:removeSelf()
objects[event.target] = nil

end
for i = 1,5 do
objects[i] = display.newImageRect(“weed.png”, 200, 150 )
objects[i].x = t1[i].x; objects[i].y = t1[i].y
objects[i]:addEventListener(“tap”, tapped)
end[/lua]

THANKS FOR ANY HELP!! [import]uid: 51459 topic_id: 5174 reply_id: 63615[/import]

#11

This is probably what you want. I had to use saveX and saveY because after removeSelf(), these seems to have disappeared, but I’m not sure. You test it out and see if we don’t need to use 2 extra variables, albeit local.
[lua]function tapped(event)
–added-----------------------------
local saveX = event.target.x
local saveY = event.target.y

event.target:removeEventListener(“tap”, tapped)
event.target:removeSelf()
objects[event.target] = nil
–added-----------------------------
objects[event.target] = display.newImageRect(“gold.png”, 200, 150)
objects[event.target].x = saveX
objects[event.target].y = saveY

end[/lua] [import]uid: 58387 topic_id: 5174 reply_id: 63990[/import]

#12

Cool thanks Useful fun, It worked!!!..

Very useful info and FUN!

THANKS

[import]uid: 51459 topic_id: 5174 reply_id: 64010[/import]

#13

Glad it does. Most welcome. [import]uid: 58387 topic_id: 5174 reply_id: 64042[/import]