Hello all,
I have my images in create function.
I have object1 first object2 second, and no matter how I switch the order of display.newImage object2 is always in front of object1…
What I want is to be able to control the order in which the images appear in the view. Totally confused Now !!
Any Help is much appreciated.
I seen some nonsense of searches of zindex but I do not believe it…
Thanks
JZ
Corona SDK supports a tofront() and toback() call to move things to the front or send to the back within the display hirearchy (i.e. within a display group, or for ungrouped items, the stage).
There is not an API call to move up one or down one. Your best bet is to layer things where they need to be, i.e. create them in order and insert them in order in the group. I know some developers have had managed to use standard table operations to reorder them. A group is pretty much a big table of objects. Perhaps you can search for that instead of z-index.
Rob
Hi Rob, thanks for the help, i tried the toFront and toBack() the toBack() hides my object totally even behind the background, so that is not working, even if i do toFront() for the object I want in front of the object1 it still does not work.
Whats next ?
JJZAD,
try this snippet of code; cut and paste it into a new project and run it. tap the small rectangles and see how they move behind each other.
local CENTER\_X = display.contentWidth \* .5 local CENTER\_Y = display.contentHeight \* .5 local bg = display.newRect(CENTER\_X, CENTER\_Y, display.contentWidth, display.contentHeight) bg:setFillColor(.7,.2,.2) local greyImg = display.newRect(200,200,100, 100) greyImg:setFillColor(.2, .2, .2) greyImg.id = 1 local blueImg = display.newRect(250,250,100, 100) blueImg:setFillColor(.2, .2, .8) blueImg.id = 2 local greenImg = display.newRect(300,300,100, 100) greenImg:setFillColor(.2, .8, .2) greenImg.id = 3 local imgGroup = display.newGroup() imgGroup:insert(greyImg) imgGroup:insert(blueImg) imgGroup:insert(greenImg) local defaultImg = 2 local function onTouch(e) if e.phase == "ended" then -- first move the selected target to back, if that is what you want e.target:toBack() -- now reorder the images for i = 1, imgGroup.numChildren do -- you can loop thru the images and -- figure which order to place them in -- pushing the images to front or back end end return true end greyImg:addEventListener("touch", onTouch) blueImg:addEventListener("touch", onTouch) greenImg:addEventListener("touch", onTouch)
The key point is bg (background image) is not inserted into the display group. Both the background image and the display group (‘imgGroup’) are part of the stage. If you were to code : ’ imgGroup:toBack() ’ it will hide that group behind the bg image.
So as Rob mentioned (and in this example code), just add your images to a display group. Maybe give each a unique id, and then loop through the group of images to re-order them.
Hope this helps.
Great thanks I will give it a try.
Thanks
JZ
I see it my mistake was to make two groups and put one image in each group. Now I see what to do.
Thanks so much.
JZ
Corona SDK supports a tofront() and toback() call to move things to the front or send to the back within the display hirearchy (i.e. within a display group, or for ungrouped items, the stage).
There is not an API call to move up one or down one. Your best bet is to layer things where they need to be, i.e. create them in order and insert them in order in the group. I know some developers have had managed to use standard table operations to reorder them. A group is pretty much a big table of objects. Perhaps you can search for that instead of z-index.
Rob
Hi Rob, thanks for the help, i tried the toFront and toBack() the toBack() hides my object totally even behind the background, so that is not working, even if i do toFront() for the object I want in front of the object1 it still does not work.
Whats next ?
JJZAD,
try this snippet of code; cut and paste it into a new project and run it. tap the small rectangles and see how they move behind each other.
local CENTER\_X = display.contentWidth \* .5 local CENTER\_Y = display.contentHeight \* .5 local bg = display.newRect(CENTER\_X, CENTER\_Y, display.contentWidth, display.contentHeight) bg:setFillColor(.7,.2,.2) local greyImg = display.newRect(200,200,100, 100) greyImg:setFillColor(.2, .2, .2) greyImg.id = 1 local blueImg = display.newRect(250,250,100, 100) blueImg:setFillColor(.2, .2, .8) blueImg.id = 2 local greenImg = display.newRect(300,300,100, 100) greenImg:setFillColor(.2, .8, .2) greenImg.id = 3 local imgGroup = display.newGroup() imgGroup:insert(greyImg) imgGroup:insert(blueImg) imgGroup:insert(greenImg) local defaultImg = 2 local function onTouch(e) if e.phase == "ended" then -- first move the selected target to back, if that is what you want e.target:toBack() -- now reorder the images for i = 1, imgGroup.numChildren do -- you can loop thru the images and -- figure which order to place them in -- pushing the images to front or back end end return true end greyImg:addEventListener("touch", onTouch) blueImg:addEventListener("touch", onTouch) greenImg:addEventListener("touch", onTouch)
The key point is bg (background image) is not inserted into the display group. Both the background image and the display group (‘imgGroup’) are part of the stage. If you were to code : ’ imgGroup:toBack() ’ it will hide that group behind the bg image.
So as Rob mentioned (and in this example code), just add your images to a display group. Maybe give each a unique id, and then loop through the group of images to re-order them.
Hope this helps.
Great thanks I will give it a try.
Thanks
JZ
I see it my mistake was to make two groups and put one image in each group. Now I see what to do.
Thanks so much.
JZ