Background made from repeaded/tiled smaller image

I’d like to have some kind of backgound in my game, but want it to be scrollable (parallax effect). I’d like to do this by creating an image with the dimensions: displayWidth+tileWith x displayHeight+tileHeight and then offset this image with values from 0 to tileWidth and 0 to tileHeight to give an impression of an endless scroll in two directions.

But how do I compose such a large image from many smaller ones?

Just to answer myself…

I would up just making an array of individual tiles calling newImage with the same image. They were all places in the same group and scrolled together by adjusting the x/y values of the group:

local plxGroup     = display.newGroup(); plxBgArr = {} local horizBgTileNum = math.ceil(displayWidth/tilePixSize+1) local verticBgTileNum = math.ceil(displayHeight/tilePixSize+1) local plxBgCnt = 1 for y = 0, verticBgTileNum-1 do     for x = 0, horizBgTileNum-1 do         LevelElements.plxBgArr[plxBgCnt] = display.newImage(plxGroup, "tileImage.png")         LevelElements.plxBgArr[plxBgCnt].x = tilePixSize\*x + tilePixSize/2         LevelElements.plxBgArr[plxBgCnt].y = tilePixSize\*y + tilePixSize/2         plxBgCnt = plxBgCnt + 1     end end 

Maybe this is even better (using less texture memory?) than a composite image for all I know…

At least it works  :slight_smile:

Just to answer myself…

I would up just making an array of individual tiles calling newImage with the same image. They were all places in the same group and scrolled together by adjusting the x/y values of the group:

local plxGroup     = display.newGroup(); plxBgArr = {} local horizBgTileNum = math.ceil(displayWidth/tilePixSize+1) local verticBgTileNum = math.ceil(displayHeight/tilePixSize+1) local plxBgCnt = 1 for y = 0, verticBgTileNum-1 do     for x = 0, horizBgTileNum-1 do         LevelElements.plxBgArr[plxBgCnt] = display.newImage(plxGroup, "tileImage.png")         LevelElements.plxBgArr[plxBgCnt].x = tilePixSize\*x + tilePixSize/2         LevelElements.plxBgArr[plxBgCnt].y = tilePixSize\*y + tilePixSize/2         plxBgCnt = plxBgCnt + 1     end end 

Maybe this is even better (using less texture memory?) than a composite image for all I know…

At least it works  :slight_smile: