I have an iPad app that I'm converting to a universal app to show on phones. It has both a tab bar and a navigation bar, and my problem is that they are both way too big on the phone. I could swear I heard Paul Hegarty (from the iTunes U class from Stanford on Swift app development) mention a switch or trick somewhere that would cause the bars to adapt to the iPhone, but I can't find it.
Here are screenshots of my apps bars, vs the Photos app in the iPhone 6 simulator to show what I'm talking about.
Not a huge difference, but significant on a small phone screen.
My fonts are also way to big, which is confusing since I have them set to the system "headline" or "body" options for all size classes, but that may be a separate issue.
Any help is greatly appreciated!
App written in Swift, using storyboards for iOS8, btw.
Edit:
The more I look at this, the more I'm convinced it's not related to the bars, but the entire app - the fonts and everything. The whole app appears to be zoomed in to 120%, which is subtle, but looks really bad and wastes space.
I have also now seen this in a second app - the Apple DateCell sample. It also appears 'zoomed in' when run on the iPhone 6 simulator.
Edit 2:
This effect is even more exaggerated on the iPhone 6 Plus simulator - everything is even more 'zoomed in' looking - the top and bottom bars are almost twice the height they should be. This can be seen by downloading the Apple DateCell sample and running it.
Edit 3:
ARGGGG, all this time wasted, and it was due to the launch screen image - why on earth would a launch screen image not being set cause the entire app to scale?
I finally figured this out - it was related to the launch screen image. Apparently if it's not setup right, the whole app scales on the iPhone 6 and 6 Plus for some reason. This question is what pointed me to the answer.
For me, I had to both create a LaunchScreen image in Assets, and set it in the project file, and ALSO select the launchScreen.xib as the Launch Screen File in the project. I don't have a real launch screen yet, so these are both just empty or defaults in my case.
Related
I have a game we're trying to release in the app store for iphone and ipad, and while it works fine on all of our devices (a handful of iphones and ipads), when the app store reviewers try it the actual viewport they see is highly cropped and distorted.
This is an example options screen that the reviewer saw:
This is what that options screen looks like for us on an equivalent aspect ratio/resolution:
As you can see, it's just a small, off-centered square for them, surrounded by black. But we've tested this on devices like an old iphone 5 up to big ipads and have never seen anything like this, the game takes up the full screen and the aspect ratio is correct and not distorted or stretched.
One important detail is this is entirely an OpenGL and SDL program, not using any Apple UI frameworks at all. The render size is determined by SDL_GetRendererOutputSize(), which then is used in glViewport(), and the window is created with the SDL_WINDOW_ALLOW_HIGHDPI flag. This so far has seemed to work with both retina and non-retina physical devices.
Also all of the screenshots they've given us look the same, same little square viewport surrounded by black, so I originally thought they were cropping them on purpose to highlight specific components of the screen, but this appears to be just exactly how it looks for them as this square is in the same position in each screenshot. I've asked them for more information on their devices but they wouldn't tell me.
We also have the program set to only ever use landscape, not portrait, but the weird thing is that with the way our UI reflows, the only way to get that button to look squished the way it does there is if the game was somehow still rendering in portrait, as seen this example shot I took by forcing it to run in a very tall portrait window:
I don't even know where to begin to try to figure out what's going wrong for them though, because as I've said, everything looks fine when running in an emulator and everything looks fine when we've run it on several physical devices. Is there some build or release configuration I could be missing? Some OpenGL setting I should check? I'm just hoping this problem looks similar to something someone else has encountered before.
If you are on an equivalent device, then another thing that may differ is the accessibility settings. Search for display zoom in settings. Also, try locking the iPad into portrait mode before launching your app to try and reproduce.
Note the little double arrow icon in the lower right corner of the reviewer’s screenshot. I don’t know what that is, but it looks like it could be some kind of screen zoom or accessibility mode. Perhaps they can answer what it does, and how to enable it for yourself.
To follow up with the solution that worked for me, I noticed that in my project's General settings in Xcode, under Deployment Info, I had only checked iPhone and not iPad. What I've since learned is that without that checkbox, some iPads will have to run in an emulation mode, which may have been the source of our problem. Deploying a new build with that checked (as well as "requires full screen"), it rendered exactly the same on our own iPads, but the app was subsequently approved with no further problems. I had made no other changes to the program, so my assumption is that that setting likely fixed it.
I've two live apps on Appstore, my one app is looking quite blurry on iPhone 11(which I just bought) and its fine previous models of iPhone, but my another app looks fine on iPhone 11.
The first app which is blurry is built on xib file and base screen size of iPhon SE and second app which look fine is built on storyboard and base screen size is iPhone 8 but I think that may not be the reason.
Blurry App on iPhone 11 (as it look pixelated)
Blurry App on iPhone 8(as it looks fine and crisp)
Xib file of Blurry App
Let me know why this is happening and whats the solution ? Do I need to revamp all screens in project? Looking for suggestions.
Thanks
Finally I found solution and the culprit was iOS 8.0 and Later check. It was unchecked, which I marked checked and added Splash screens for these defined sizes and my whole apps screens became crisp from pixelated.
Previously the app supported the iPhone 5s/SE screen and iPhone 6-8 screens (not the plus sizes), this was done using launch images. So on Plus sized devices and iPhone X* devices it would display black bars above and below the app.
We then released an update where among other things a launch storyboard was added. All through the development of this update the screen size worked perfectly on every device we had. However after releasing the update on the App Store, for some users, the app now shows at iPhone 4 size (height/width ratio is 1.5). So now affected users on an SE have the black bars, and X* users have bigger black bars the before. This doesn't seem to affect everyone, and we can't replicate on our devices.
The deployment target is 10, so there should be no reason to use the old launch images method. And the update is definitely using a storyboard for the launch screens.
Has a similar thing happened to anyone else? Or is there something you have to do specially when releasing an update that moves to the storyboard method from individual launch images?
All the existing answers either say to make sure you have the correct screenshots, or use a xib/storyboard. We don't have any screenshots and are definitely using a storyboard.
EDIT: now after a few hours of restarting the app users are starting to see the correct sizes, implying it’s an iOS caching issue.
I have experienced it lot before.
Reason: iOS commonly keeps launch screens of all apps in its own cache system, So, unless your app get loaded,it can show that launch images/screen to user from cache. Now, As your app was previously having launch images and now moved to storyboard, it makes this problem.
Also note that, iOS always render your app in screensize which it have in launchscreen, thats why you are seeing black bars at top and bottom.
Way to reproduce: This will happen everytime you update your launch screen. Try adding some label or some other component to your launchscreen.storyboard and install it. You will not see updated launch screen for some duration.
Best Solution(It works almost for all): Just update your app's version number and install on the device. After version number get updated, it will take new updated resources.
If above solution didn't worked for you, then you can try for these alternate solutions:
Solution 01: Your user might have to delete older app and install new one
Solution 02: Your user needed to reboot their device after update.
Solution 03: iOS System itself refreshes its own cache after certain interval, so your customers might face issue just after updating... but will get resolved automatically after some duration(around 3-4 hours).
I experienced similar issues with LaunchScreen Storyboard changes and when switching from Launch Images. It is an iOS Bug, sometimes you need to reboot the device in order to see the correct LaunchScreen when changes are made, it is very odd and difficult to reproduce.
Most probably there is nothing wrong with your App...
Yes Jonathan, it has happened to others as well.
Sadly it seems that this is a real iOS issue, the problem is real (those negationists please believe).
I called the Apple Support and the developer/support staff that I talked with, seemed aware and/or heard the issue, although the response was unclear I did, nonetheless, report the issue properly. "They will check it out". Typical Apple sideways answer...
Now, current solutions:
It seems that what has worked is the On/off iPhone solution, drastic and heavily inconvenient but currently it's the only workaround "tested".
I am deeply sorry for not solving you inquire straight, but I think this affair is beyond any of us developers field of action, it seems (yet to confirm) an OS problem, which Apple and only Apple can fix for real.
May app has two storyboards, where the default Main.storyboard is used for iPad, and another one named iPhone.storyboard is used for iPhone build. The storyboard to be used by the app is chosen in AppDelegate, in application didFinishLaunchingWithOptions after detecting which device is running the app.
For me, this two storyboard approach is very much simpler than working with adaptive layout, because of my app characteristics. But there is one side effect I couldn't overcome until now: when the app is installed on iPhone, the app icon is not being shown, even though I have the icon images for iPhone in Assets.xcassets. On iPad the icon is being shown correctly. Any ideas?
I have just discovered that I was using a wrong sized image for the icon. I had two separate projects for iPhone and iPad before. Funny that I made the same mistake then, but the iPhone app icon was shown anyway. I also made this mistake for iPad in this new joint project, but, as I mentioned before, I had no problem with the iPad icon. Sorry for bothering with this silly question.
I dont quite remember what change I made but the whole UI seemed to be magnified for my ios app including font sizes , image sizes. Strange thing is the time , battery power ad network connection symbols which are usually shown on top have also magnified. I cant seem to figure out why . Can someone please advise ?
I have already tried playing with size classes ( with / without for each VC ) and it dint work
It may be running in the 4" compatibility mode, which was to allow older apps to run on the newer 6 and 6+ phones full screen. you might need to change your splash screen of you app to have all the sizes to fix this, if you dont have it already