Change background image

Solar2D General Questions/Discussion
#1

I would like to change background image when i click over a button in a certain moment of the app.

When i do that,it overloads over all user interface objects.

How do i do it to stay on bottom of the other displays?

#2

Are you removing the old image for the new one? Or just adding a new display.newImage when the click happens?

And maybe if you do something like: 

myImage:toBack();
#3

No i do not remove, i tried it and got same experience. 

Here is my code:

mygroup = nil

mybgimage = nil

mybgimage = display.newImageRect(“imagefile1.png”, display.contentWidth, display.contentHeight)

  --center the image

  image.x = x   --display.contentWidth / 2

  image.y = y   --display.contentHeight / 2

mygroup:insert(mybgimage)

On button click function i do:

    mybgimage:removeSelf()

    mybgimage = display.newImageRect(“imagefile2.png”, display.contentWidth, display.contentHeight)

     --center the image

    image.x = x   --display.contentWidth / 2

    image.y = y   --display.contentHeight / 2

    mygroup:insert(mybgimage)

#4

Do you have other display components in “mygroup”?

Also, Have you tried :toBack()?

Place after you insert the new image to the group, like this:

On button click function i do: mybgimage:removeSelf() mybgimage = display.newImageRect("imagefile2.png", display.contentWidth, display.contentHeight) --center the image image.x = x --display.contentWidth / 2 image.y = y --display.contentHeight / 2 mygroup:insert(mybgimage) mybgimage:toBack();
#5

Thank you Ziad.Ali , it did the trick :slight_smile:

#6

Are you removing the old image for the new one? Or just adding a new display.newImage when the click happens?

And maybe if you do something like: 

myImage:toBack();
#7

No i do not remove, i tried it and got same experience. 

Here is my code:

mygroup = nil

mybgimage = nil

mybgimage = display.newImageRect(“imagefile1.png”, display.contentWidth, display.contentHeight)

  --center the image

  image.x = x   --display.contentWidth / 2

  image.y = y   --display.contentHeight / 2

mygroup:insert(mybgimage)

On button click function i do:

    mybgimage:removeSelf()

    mybgimage = display.newImageRect(“imagefile2.png”, display.contentWidth, display.contentHeight)

     --center the image

    image.x = x   --display.contentWidth / 2

    image.y = y   --display.contentHeight / 2

    mygroup:insert(mybgimage)

#8

Do you have other display components in “mygroup”?

Also, Have you tried :toBack()?

Place after you insert the new image to the group, like this:

On button click function i do: mybgimage:removeSelf() mybgimage = display.newImageRect("imagefile2.png", display.contentWidth, display.contentHeight) --center the image image.x = x --display.contentWidth / 2 image.y = y --display.contentHeight / 2 mygroup:insert(mybgimage) mybgimage:toBack();
#9

Thank you Ziad.Ali , it did the trick :slight_smile: