Why isnt my game the right size on my i phone when testing ??

FuzzBuzz

Hi Everyone got a small problem... every time i test my game on my phone using game salad the game image has two black bar bars, one on the top and on the bottom ( landscape app ). I tried " resolution independence" i get the same result. Even before lauching the app on my phone when in the game salad app, there's a little button i've tried that, doesn't work too. And i actually tried taking off the " resolution independence" and now the game is very " zoomed in " ( too big for the iphone screen ). Has anyone had this problem? How do you deal with it?

breuban

I think its because your project settings are based on iphone 4 resolution and youre testing on the iphone 5? because if the bars are on top i think its because the iphone 5's height is bigger than the 4

Armelline

I would assume that iPhone 4 resolution on iPhone 5 device would mean black bars at the left and right. Top and bottom sounds like the opposite - he's developing with the default iPhone 5 size and testing on an iPhone 4. (@breuban highlighted below that this is just an assumption - most games are landscape, but if it's portrait then he was entirely correct above!)

You have three options when publishing your game:

Letterbox: The game will be the exact dimensions you developed it in, but will be "zoomed out" so that the whole thing fits on your screen. Just like if you watch a widescreen movie on a non-widescreen TV.

Overscan: The game will be the exact dimensions, but also the exact size. So if your game is wider than the screen, the left and right will get cut off. It's like if you have a photo you try to put in a frame, but it's too wide for the frame so you snip the left and right edges off, leaving just the center area of the photo.

Stretch: You game will be stretched or squished to fit the screen of your phone. This will make it look distorted.

My guess is you're using letterbox mode with the wrong size device. If you have black bars at the top and bottom, it means your game is wider than the screen on your device (iPhone 5 is 568 pixels, iPhone 4 is 480 pixels).

Resolution independence is something different - that's related to retina displays. It uses higher resolution graphics on higher resolution devices. iPhone 3G, for example, will use smaller versions of each graphic to iPhone 4 or 5.

breuban

Thanks, helped a lot. So if i develop for iphone5 and choose overscan when publishing, then it will cut off the top and bottom on the iphone 4 correct? the width will remain the same and fill the screen?

Armelline

Hmm, you just highlighted something I forgot

If you're working in Portrait, it'll cut off the top and bottom.
If you're working in Landscape, it'll cut off the left and right.

GS defaults to landscape so that's how my brain mostly works

Held upright, an iPhone 4 has a height of 480 and a width of 320.
Held upright, an iPhone 5 has a height of 568 and a width of 320.

Turn the phone to landscape mode, and that becomes a width of 480/568 and a height of 320.

The difference is 88, so 44 pixels are cut off each edge.

breuban

aaah, that makes sense Thanks Armelline

Armelline

Any time!

FuzzBuzz

Wow OMG you guys like gave me all the info i needed to know and i didn't even get the time to comment lol Thanks breuban & Armelline ! Great help

FuzzBuzz

oh yeah and yes, i was testing on an iphone 4, so that means that on i phone 5, i will not get letter boxing?

Armelline

That is correct. Be aware, though, that Apple will reject apps that letterbox on an iPhone 4. So you'll need to adjust your game for iPhone 4.

There are three fairly easy methods to deal with this:

1. Don't put anything important in those edge 44 pixels. Apple will reject your app if they're empty entirely, but should be happy enough if there is background or something in it. They're not big on 44 pixel wide forced borders, though

2. Have two copies of each scene, one sized for iPhone 4 and one for iPhone 5. Detect the screen size, and move to the appropriate scene.

3. (Preferable) Have your actors dynamically move depending on the screen size. There are a bunch of tutorials for doing this.

FuzzBuzz

I didn't know that game salad could detect the device used... what kind of logic do you use to do that?

Armelline

In the attribute browser, Devices>Screen>Size

You then have two options. Either calculate the aspect ratio, and go by that, or use the screen width. I researched the different device screen sizes and aspect ratios a while back, I'll see if I can dig that post out.

Here is the post in question.

FuzzBuzz

@Armelline said:
In the attribute browser, Devices>Screen>Size

You then have two options. Either calculate the aspect ratio, and go by that, or use the screen width. I researched the different device screen sizes and aspect ratios a while back, I'll see if I can dig that post out.

Here is the post in question.

I actualy don't have a " calculate the aspect raton ". I've got Width & Hight, and even when i try to change those, they go back to their original setting... Weird