Fill repeat using spreadsheets doesn't work on the device

Solar2D Native builds
#1

We are having a problem with the new bg repeat of G 2.0
Basically if we use spritesheets it works on simulator but not on the device.

Here the code example:

display.setDefault("

textureWrapX", “repeat”);

local groundSheetInfo = require(“classes.ground_sheet”)
 local groundSheet = graphics.newImageSheet( “images/ground_sheet.png”, groundSheetInfo:getSheet() )

 local groundSequenceData = {start=1, count=2}
 local ground = display.newSprite( group, groundSheet , groundSequenceData )
  groundLayer.x, groundLayer.y = display.contentCenterX, display.contentHeight-display.screenOriginY;

function groundLayer:enterFrame()
  
      local gameSpeed = -(speed/512);
      local fillX = self.fill.x;
      fillX = fillX-gameSpeed;
      if fillX > 1 then
        fillX = fillX-1;
      end

      self.fill.x = fillX;
   
 
  end
  Runtime:addEventListener(“enterFrame”, ground);
 
  display.setDefault(“textureWrapX”, “clampToEdge”);
 

If we use  local ground = display.newImageRect(group, “images/ground.png”, _TW, 128); it will work on boths

#2

Hi @filippo22000,

When using repeating fills, you must adhere to power-of-2 sized fill textures (2, 4, 8, 16, 32, 64, 128, etc.). This is noted in the “display.setDefault()” documentation, and also in the guide on repeating fills:

http://docs.coronalabs.com/api/library/display/setDefault.html

http://coronalabs.com/blog/2013/11/07/tutorial-repeating-fills-in-graphics-2-0/

Hope this helps,

Brent

#3

Hi, The texture is 512 so should work. Why in the simulator is it working? Did you try to use these options with a spritesheet? Thanks for you reply. Filippo

#4

Hello @filippo22000,

Can you reformat your code to the most basic usage, without using the texture packing modules? We can’t see any of the definitions that were made there, nor can we see the actual image sheet used (we’d need this attached as well).

Thanks,

Brent

#5

Hi Brent,

Here the ground_sheet code:

local SheetInfo = {}

SheetInfo.sheet =
{
    frames = {
    
        {
            – ground
            x=0,
            y=126,
            width=512,
            height=124,

            sourceX = 0,
            sourceY = 2,
            sourceWidth = 512,
            sourceHeight = 128
        },
        {
            – groundNight
            x=0,
            y=0,
            width=512,
            height=124,

            sourceX = 0,
            sourceY = 2,
            sourceWidth = 512,
            sourceHeight = 128
        },
    },
    
    sheetContentWidth = 512,
    sheetContentHeight = 250
}

SheetInfo.frameIndex =
{

    [“ground”] = 1,
    [“groundNight”] = 2,
}

function SheetInfo:getSheet()
    return self.sheet;
end

function SheetInfo:getFrameIndex(name)
    return self.frameIndex[name];
end

return SheetInfo

Please let me know because we need to deploy, otherwise we need to change the logic of how we repeat the fill

#6

Hi @filippo22000,

I’m seeing a height of 124 for both “ground” objects, and a sheet content height of 250. Please adjust your image(s) and make everything power-of-2, then test on devices again and report back your results.

Thanks,

Brent

#7

Hi Brent,

We have alredy tried to create a full spritesheet power of 2 but didn’t work

We double checked again creating a spritesheet with one image everything in power of two and didn’t work.

Can you publish a demo project showing us that this is working and that  is not a bug on your side please?

We are spending too much time on this and we still don’t have a solution in 3 days.

Please let us know or we will rollback to another solution

Thanks for your help

Below the code in power of 2

Filippo

local SheetInfo = {}

SheetInfo.sheet =
{
    frames = {
    
        {
            – ground
            x=0,
            y=512,
            width=2048,
            height=512,

        },
        {
            – groundNight
            x=0,
            y=0,
            width=2048,
            height=512,

        },
    },
    
    sheetContentWidth = 2048,
    sheetContentHeight = 1024
}

SheetInfo.frameIndex =
{

    [“ground”] = 1,
    [“groundNight”] = 2,
}

function SheetInfo:getSheet()
    return self.sheet;
end

function SheetInfo:getFrameIndex(name)
    return self.frameIndex[name];
end

return SheetInfo

#8

I’m not sure what “groundLayer” is in your code. I don’t see it initially declared anywhere. Can you isolate this down to the most simple case, without the enterFrame and all of that?

Thanks,

Brent

#9

Here the code

local groundSheetInfo = require(“classes.ground_sheet”)
 local groundSheet = graphics.newImageSheet( “images/ground_sheet.png”, groundSheetInfo:getSheet() )
 local groundSequenceData = {start=1, count=2}
 local groundLayer = display.newSprite( group, groundSheet , groundSequenceData )
 groundLayer.x, groundLayer.y = display.contentCenterX, display.contentHeight-display.screenOriginY;

Thanks

Filippo

#10

Hi Filippo,

I guess there’s some miscommunication here. This code looks like a standard sprite being created from a standard image sheet, exactly as sprites are meant to be. And this isn’t working on the device?

Or, are you trying to “fill” a sprite? Sprites don’t support that in my tests (in fact, the Simulator crashes if you try to fill a sprite with a bitmap image). I’m not sure why you’d want to “fill” a sprite anyway, since it’s just a series of animated frames, but maybe I’m not clear on what you’re envisioning.

Best regards,

Brent

#11

Hi Brent,

Below my answers:

>I guess there’s some miscommunication here. This code looks like a
>standard sprite being created from a standard image sheet, exactly as
>sprites are meant to be. And this isn’t working on the device?

Exactly. If I use display.setDefault(“textureWrapX”, “repeat”); it doesn’t work on the device but it works fine on the simulator

>Or, are you trying to “fill” a sprite? Sprites don’t support that in
>my tests (in fact, the Simulator crashes if you try to fill a sprite
>with a bitmap image). I’m not sure why you’d want to “fill” a sprite
>anyway, since it’s just a series of animated frames, but maybe I’m not
>clear on what you’re envisioning.

I am using a spritesheet to change the background using setFrame(n)

Basically the background is repeating and I can set a different frame to change the background.

Hope it helps

Filippo

#12

Hi Filippo,

Out of curiosity, did you try to install our sample “repeating fill” project on the same device? It’s located in your local Corona application directory here:

CoronaSDK > SampleCode > Graphics-Premium > PatternFill

This has been tested on devices so it should work for you too. If so, then please inspect the code and see if there’s something that doesn’t quite mesh with your code.

Again, I don’t think that sprites can be “filled”.

Brent

#13

Hi,

Yes we know that example and as my initial post if we load the image in that way works.

Do you have any example using sprite-sheets?

Thanks

Filippo

#14

Hi Filippo,

In my tests, sprite objects (display.newSprite) do not support repeating fills. It crashes my Simulator when I try it. If you have a project which shows otherwise, and wish to have it inspected via the bug report system, you can file a bug through the submission form. Otherwise, I encourage you to follow the example project or seek another workaround.

Best regards,

Brent

#15

Hi @filippo22000,

When using repeating fills, you must adhere to power-of-2 sized fill textures (2, 4, 8, 16, 32, 64, 128, etc.). This is noted in the “display.setDefault()” documentation, and also in the guide on repeating fills:

http://docs.coronalabs.com/api/library/display/setDefault.html

http://coronalabs.com/blog/2013/11/07/tutorial-repeating-fills-in-graphics-2-0/

Hope this helps,

Brent

#16

Hi, The texture is 512 so should work. Why in the simulator is it working? Did you try to use these options with a spritesheet? Thanks for you reply. Filippo

#17

Hello @filippo22000,

Can you reformat your code to the most basic usage, without using the texture packing modules? We can’t see any of the definitions that were made there, nor can we see the actual image sheet used (we’d need this attached as well).

Thanks,

Brent

#18

Hi Brent,

Here the ground_sheet code:

local SheetInfo = {}

SheetInfo.sheet =
{
    frames = {
    
        {
            – ground
            x=0,
            y=126,
            width=512,
            height=124,

            sourceX = 0,
            sourceY = 2,
            sourceWidth = 512,
            sourceHeight = 128
        },
        {
            – groundNight
            x=0,
            y=0,
            width=512,
            height=124,

            sourceX = 0,
            sourceY = 2,
            sourceWidth = 512,
            sourceHeight = 128
        },
    },
    
    sheetContentWidth = 512,
    sheetContentHeight = 250
}

SheetInfo.frameIndex =
{

    [“ground”] = 1,
    [“groundNight”] = 2,
}

function SheetInfo:getSheet()
    return self.sheet;
end

function SheetInfo:getFrameIndex(name)
    return self.frameIndex[name];
end

return SheetInfo

Please let me know because we need to deploy, otherwise we need to change the logic of how we repeat the fill

#19

Hi @filippo22000,

I’m seeing a height of 124 for both “ground” objects, and a sheet content height of 250. Please adjust your image(s) and make everything power-of-2, then test on devices again and report back your results.

Thanks,

Brent

#20

Hi Brent,

We have alredy tried to create a full spritesheet power of 2 but didn’t work

We double checked again creating a spritesheet with one image everything in power of two and didn’t work.

Can you publish a demo project showing us that this is working and that  is not a bug on your side please?

We are spending too much time on this and we still don’t have a solution in 3 days.

Please let us know or we will rollback to another solution

Thanks for your help

Below the code in power of 2

Filippo

local SheetInfo = {}

SheetInfo.sheet =
{
    frames = {
    
        {
            – ground
            x=0,
            y=512,
            width=2048,
            height=512,

        },
        {
            – groundNight
            x=0,
            y=0,
            width=2048,
            height=512,

        },
    },
    
    sheetContentWidth = 2048,
    sheetContentHeight = 1024
}

SheetInfo.frameIndex =
{

    [“ground”] = 1,
    [“groundNight”] = 2,
}

function SheetInfo:getSheet()
    return self.sheet;
end

function SheetInfo:getFrameIndex(name)
    return self.frameIndex[name];
end

return SheetInfo