iPhoneX help!!!!

ultram

  • *
  • Posts: 47
Hi,
Need help!!!

Stencyl scene ratio is 1.5 (320x480).
Screen size of iPhoneX is 1125x2436. The ratio is 2.165.

If "Scale to fit (fill) is set, the amont of lost pixels is twice higher on iPhoneX (2 x 69 pixels) in comparison with iPhone 6 (2 x 30 pixels).
So, on iPhoneX, the visible part of the scene is seriuously reduced!

What is the best solution to limit the lost area on iPhoneX?

1-  Duplicate all scenes
scene with 10 x 21 tiles (ratio = 2.1) if running on iPhoneX.
scene with 10 x 15 tiles if running on iPhone  (5, 6, 7, 8 ).

2. an idea?

Best,


JeffreyDriver

  • Posts: 1677
I haven't yet released a game on mobile, but I have researched screen ratios and safe areas.

See the attached image for what I came up with. It's what I'm working to, and I hope some expert can confirm!

Essentially I think there's a 48px border where content might not be visible.

So keep important graphics within the smaller region, and place HUD elements according to the screen.

« Last Edit: March 10, 2018, 03:29:40 pm by JeffreyDriver »
Current Projects:
Retro Redux Compilation (NEW).
Retro Redux (untitled) (NEW).
I always appreciate useful feedback. Thank you.
www.jeffreydriver.co.uk

ultram

  • *
  • Posts: 47
Indeed, to place HUD elements into the safe area, i must set x & y properly to fit the differents screens (ipad(s), iphone(s)).
But iPhoneX  is a big concern, because the safe area is too small.

If we apply the ratio 1.5 to the iPhoneX, resolution becomes 1624 x 2436 (calculation: (2436 x 320)/480)) instead of 1125x2436.
>>>1624 is too large!
1624 - 1125 = 499 pixels.
So, 499 +/_ = 500!
1624 / 320 = 5, then 500 / 5 = 100 (50 pix left & 50 pix right)
The safe area is 480 x 220!!!!!
220....It is really small!

Thanks you apple!!!

colburt187

  • *
  • Posts: 2223
How about using a different scale method, Scale to fit full screen for example.

ultram

  • *
  • Posts: 47
Because it doesn't work.
Scale to fit (full screen) stretch images to fit the new ratio (from 1.5 to 2.165)
So the image is distorted...

colburt187

  • *
  • Posts: 2223
Distorted on the iPhoneX only or on other devices? I was under the impression that scale to fit doesn’t stretch images.

ultram

  • *
  • Posts: 47
Perhaps i found a solution.
Instead of working with 10 x 15  tiles (ratio 1.5), i use 10 x 21 tiles (ratio 2.1 close to the iPhoneX ratio)
Then, I'm using a fictive and transparent actor in the center of the scene with the behavior "camera follow". So the game aera is perfectly centered on each devices around the position of the fictive actor.
With this solution i have pratically no loss of pixels on iPhoneX

colburt187

  • *
  • Posts: 2223
And you are using the scale to fit (fill) scale mode?

ultram

  • *
  • Posts: 47
@colburt187
Sorry you're right! the image is not strectched.

I'm always using Scale to fit (fill).

Picture Scale to fit (fit) vs Scale to fit (full screen) on iPhone 6 with a 10 x 15 tiles scene
Scale to fit (full screen) is bad.

colburt187

  • *
  • Posts: 2223
I have always used scale to fit (full screen) for my games, although I’ve never been very specific with my scene sizes so I guess that has made things  easier.

ultram

  • *
  • Posts: 47
Ok, i will try tu use Scale to fit (full screen). I think my background size is too small. When stencyl repeat this background to fit the screen, every elements are moved to the left!

Thanks you for your help!

bonzero

  • *
  • Posts: 487
I've been focusing my new games on iphone8/iPhone X ratio, and scale to fill (full screen) works perfectly. the only rule I have for iphoneX ratio screens is to leave more space between the UI and the edge of the screen as you have the notch and the home bar at the bottom, other than that, not big issues

ultram

  • *
  • Posts: 47
Device: iPhone 6
Orientation: Landscape
Scale mode: scale to fit (fill)
Scale: 1x
Scene: 10x15 tiles (32x32 per tile)


when i use "scale to fit (fullscreen)", the image quality is really not sharp enough and the game area is shifted to the left of the screen.
The best image quality is obtained with "scale to fit (fill)". Image is clear and sharp.

It is a mystery!!!

Image 1: scale to fit (fill), scale 1x
Image 2: scale to fit (fill), scale 1x, 2x, 3x, 4x        >>> poor quality
Image 3: scale to fit (full screen), scale 1x, 2x, 3x, 4x     >>> poor quality

« Last Edit: March 13, 2018, 12:56:05 am by ultram »

rob1221

  • *
  • Posts: 9153
Scale to fit (full screen) shows more of the scene so you'll need to center those actors with the camera center.

colburt187

  • *
  • Posts: 2223
What size did you import you art at? in 3.4 I would import art at 1x, only use 1x assets and use Scale to fit (fullscreen) images were sharp.