Easy way to change from "zoomEven" to "letterbox"

[dodi_games]

There will be an easy way to change from “zoomEven” to “letterbox”?

I just did a test on a Samsung Galaxy Note 8 and my application looks good. The Note 8, which is now literally rectangular, has an option to change to the “full screen mode” and my App leaves 30% of content off the screen. My content area is 768x1024 and I am using “zoomEven”. I use the basic config that the tablet preset brings and I only have the @2x suffix. For example I have 3 banners 512x238 with the 1024x476 as a @2x image. In full screen mode they leave the screen as 32p on each side.

I think changing it to “letterbox” can help me keep the content within the margins of the different screens.

Thanks in advance.

[roaminggamer]

This question is a little unclear.

 Are you saying

1. You changed your scaling from ‘zoomEven’ to 'letterbox.

2. Then you tested it on your Galaxy Note 8.

3. You were happy with the look.

4. You are looking for a way to keep this scaling (letterbox) and make it ‘work’ on all devices

Whatever the case, the size of your @* images is not relevant to this question.  It is more about the size of your 1X assets and how you place things.  Determine the right size for a 1X asset then make 2X twice that, 3X three times, and so on.

These are the major issues you are facing when setting up for letterbox:

A. If you have full screen images as backgrounds and they are not big enough, they won’t show properly on some devices.

B. Even if your images are big enough, there will be parts of the image that do not show on some devices.  If that part of the image is critical to the use of your game/app then you will have an issue.

C. If you position things outside of the safe area then they won’t show on all screens.

Finally, I wish you’d said your base resolution were 640x960 because I have a recipe for that, but I don’t for 768x1024.  Hopefully someone can help you with the calculations for finding:

• max fullscreen image size
• safe area size

[dodi_games]

@roaminggamer - Thanks for your reply. What I want to say is my content area is 768x1024 in zoomEven. When I test on note 8 everything is fine till I switch to full screen mode from the note 8 interface buttons. I think if I change my “zoomEven” to “letterbox” I fix the problem cause in “letterbox” it’s supposed to no content get out of screen bounds across devices.

My question is if there is an easy way to switch to “letterbox”, cause I just change the “zoomEven” to “letterbox” in config and now I have black bars.

I designed everything in 2048x2048 which gives me the option to create my assets in the size I want. But the App has 221 assets so I would like to know if there is a “fix” for the black bars of the “letterbox”.

I think if “letterbox” does not allow content to be displayed outside of the screen, I can keep all the content within the margins of each screen.

Rectangular Samsung devices are a real headache. Everything was fine in the s8 and s8+ as long as all the important content of the App will not exceed a maximum of 512 pixels (for a content area of ​​768x1024, which is the “tablet preset” of Corona SDK.

[roaminggamer]

Your content area never changes no matter the scaling style.

I think you’re conflating content area with the scaled content.

Yes, there is a ‘fix’.  Have a recipe for images and placement that accounts for the difference.

I’ll show a demo later.  Gotta jet for now.

[dodi_games]

@roaminggamer - the problem is “zoomEven” bleeds to much content outside the screen bounds for a 768x1024 content area in Note 8. Exceed my 512 pixel rule.

[roaminggamer]

I made a tool to figure out the ideal texture for any letterbox content size:

https://github.com/roaminggamer/RG_FreeStuff/raw/master/AskEd/2018/06/letterboxCalculator.zip

See this post for full details: https://forums.coronalabs.com/topic/73041-ideal-scaling-calculator/

For your case that size is: 768 x 1664

This is a sample texture:

• bleed area is pink
• safe area is green

[dodi_games]

Thanks @roaminggamer I’m going to read it well

[roaminggamer]

This question is a little unclear.

 Are you saying

1. You changed your scaling from ‘zoomEven’ to 'letterbox.

2. Then you tested it on your Galaxy Note 8.

3. You were happy with the look.

4. You are looking for a way to keep this scaling (letterbox) and make it ‘work’ on all devices

Whatever the case, the size of your @* images is not relevant to this question.  It is more about the size of your 1X assets and how you place things.  Determine the right size for a 1X asset then make 2X twice that, 3X three times, and so on.

These are the major issues you are facing when setting up for letterbox:

A. If you have full screen images as backgrounds and they are not big enough, they won’t show properly on some devices.

B. Even if your images are big enough, there will be parts of the image that do not show on some devices.  If that part of the image is critical to the use of your game/app then you will have an issue.

C. If you position things outside of the safe area then they won’t show on all screens.

Finally, I wish you’d said your base resolution were 640x960 because I have a recipe for that, but I don’t for 768x1024.  Hopefully someone can help you with the calculations for finding:

• max fullscreen image size
• safe area size

[dodi_games]

@roaminggamer - Thanks for your reply. What I want to say is my content area is 768x1024 in zoomEven. When I test on note 8 everything is fine till I switch to full screen mode from the note 8 interface buttons. I think if I change my “zoomEven” to “letterbox” I fix the problem cause in “letterbox” it’s supposed to no content get out of screen bounds across devices.

My question is if there is an easy way to switch to “letterbox”, cause I just change the “zoomEven” to “letterbox” in config and now I have black bars.

I designed everything in 2048x2048 which gives me the option to create my assets in the size I want. But the App has 221 assets so I would like to know if there is a “fix” for the black bars of the “letterbox”.

I think if “letterbox” does not allow content to be displayed outside of the screen, I can keep all the content within the margins of each screen.

Rectangular Samsung devices are a real headache. Everything was fine in the s8 and s8+ as long as all the important content of the App will not exceed a maximum of 512 pixels (for a content area of ​​768x1024, which is the “tablet preset” of Corona SDK.

[roaminggamer]

Your content area never changes no matter the scaling style.

I think you’re conflating content area with the scaled content.

Yes, there is a ‘fix’.  Have a recipe for images and placement that accounts for the difference.

I’ll show a demo later.  Gotta jet for now.

[dodi_games]

@roaminggamer - the problem is “zoomEven” bleeds to much content outside the screen bounds for a 768x1024 content area in Note 8. Exceed my 512 pixel rule.

[roaminggamer]

I made a tool to figure out the ideal texture for any letterbox content size:

https://github.com/roaminggamer/RG_FreeStuff/raw/master/AskEd/2018/06/letterboxCalculator.zip

See this post for full details: https://forums.coronalabs.com/topic/73041-ideal-scaling-calculator/

For your case that size is: 768 x 1664

This is a sample texture:

• bleed area is pink
• safe area is green

[dodi_games]

Thanks @roaminggamer I’m going to read it well