I want to make my app compatible with iPhone X. I'm not using storyboard or xibs, just code. When I run my app on the simulator the view overlaps part of the status bar and the home bar at the bottom. Is there a way to programmatically adjust the view so that it fits within the bounds? Any help is appreciated.
I believe the answer you are looking for is called safeAreaInsets, which are basically insets that considers the position of the iphoneX exclusive UI components such as the navigation bar and the home bar.
You should adjust the sizes and constraints of your UI components according to the safe area as opposed to the screen, for and non iphoneX devices, it would be 0, which means it would be the same as adjusting according the the screen sizes instead.
The docs for it is at:
https://developer.apple.com/documentation/uikit/uiview/positioning_content_relative_to_the_safe_area
Related
I am facing some trouble with a bottom UIToolbar on the iPhone. The height of the bar seems to depend on the device orientation at the time when I navigate to the scene and does not update when the orientation is changed.
When I navigate to the scene in portrait mode, the bottom bar has a height of 44. When I then turn the phone (an iPhone XR here), the height of the bar remains 44.
When I open the scene in landscape mode, the bottom bar height is 49 and also remains 49 when I turn the phone upright.
This can easily be reproduced with as simple 2-scene app such as this one:
Initially, this was not really an issue - the user would not even notice the small change. But now I am using the bottom bar in a split view. When that is initially opened in portrait, the bottom toolbar has a height of 44. Turning the phone into landscape, the detail view with its own toolbar, 49 high, opens. Then I have two toolbars with different heights right next to each other, which is rather ugly:
So the question is how I can ensure the toolbar height is either updated on orientation change, or the height is always the same (as e.g. in the email app). I don't want to hard-code the height expecting that it would eventually make things worse on future iOS versions or different devices.
I am using Xcode 10.1, running the app on an iPhone with iOS 12.1.2.
Did you add the toolbar manually on to the view or are you using the navigationController to manage the toolbar? I am assuming you did, since on rotation the height is not changing.
The navigation controller manages the height of the toolbar on rotation. Adding the following to the viewDidLoad() method will show the navigationController's toolbar.
navigationController?.setToolbarHidden(false, animated: false)
This approach requires a little less code than if your view controller manages the toolbar (one less method, one less outlet).
Here is the default template I did to check that the toolbar displayed properly on iPad and an iPhone Max model:
https://github.com/joelesli/TBHeight/
iPad Pro
iPhone XS Max
iPad Air 2
iPhone 8 Plus
I initially solved it (based on Mocha's comment above) by overriding viewWillTransition(...) to redraw the toolbar and assume its default dimensions for each orientation.
override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
if let bBar = bottomBar { bBar.invalidateIntrinsicContentSize() }
}
That way it should adapt to future UI changes, and I don't risk having problems in app approval (if modifying standard UI element styles would be an issue here).
Update:
I prefer JoelEsli's solution though this might be a good alternative in some situations, so I'm leaving it here for completeness.
How can I remove the white bar at the bottom of my mobile app? I've tried the solution of adding a Launch screen in the Launch screen file but that didn't work. I've attached an image.
Just for a bit of context, I'm using a PageViewController to slide between 3 pages.
Any help appreciated.
It looks like you add static size view on the iPhone 6 screen in xcode UI constructor but launch it on the iPhone 6s Plus (with bigger screen).
To scale this view properly you should turn on Use Auto Layout in the Utilities bar and add constraints to the view
Make sure that the blue-colored view is properly constrained to the bottom of its superview.
Is it possible to use a vertical stack view when the device is in portrait mode, but switch to a horizontal stack view when the device is orientated to landscape mode, to make best use of space.
Click the small plus button in the attributes inspector to add a variation, in this screenshot I already added one to switch to horizontal when regular width.
See a preview by changing the screen options at the bottom of the storyboard.
Use Auto Layout to design UI, orientation will be taken care of automatically.
See a tutorial here, it should answer your question in detail.
i want to change iOS6 application to iOS7.(i.e)i want iOS7 compatibility. When i run my application in iOS7 simulator,view is moving up.
Can someone help me?
The full size of the iPhone Screen (non-retina, for simplicity sake, since that what we use with layout coordinates) is 320x480.
In iOS6 and previous, from a developer standpoint, the screen size was actually 320x460, with a 320x20 strip at the top for the status bar. In iOS6, the point x=0, y=0 translates to the iOS7 point of x=0,y=20.
This is because now the status bar is transparent an you can controller how that 320x20 strip at the top looks.
If you want to support both, you need to check which version of iOS they're using, and if they're using iOS7 or greater, you need to increment the origin.y by 20 pretty much everywhere.
Borrowed from this StackOverflow answer, here is how to programmatically determine which version of iOS is running:
NSString *version = [[UIDevice currentDevice] systemVersion];
int ver = [version intValue];
if (ver < 7) {
//iOS 6 work
} else {
//iOS 7 related work
}
Because by default viewcontroller have extended edges and it will go under top bar, set it to UIedgeRectNone then view will not go under the top bar.
self.edgesForExtendedLayout = UIRectEdgeNone;
Best way to support both iOS6 and iOS7 without much pain is to pack all your view controllers inside navigation controller (with navigation bar set to hidden if necessary).
This will allow to automatically and cleanly handle status bar behaviour changes.
People are nibbling around the correct answer, but haven't given it. I struggled with this for weeks, and finally figured out how to handle it correctly.
How to handle layout differences between iOS 6 and iOS 7 so you can support both without custom code:
The answer is different depending on whether you're using auto-layout or struts and springs.
For auto layout, you tie your top constraints to the "top layout guide", an imaginary line that starts at the content area of the window. It's under any status bar or navigation bar that's present, and moves up if either or both of those items are not shown.
For struts and strings based layout, IB has a mechanism that will let you adjust your view layout automatically.
Select your nib file/storyboard file.
Open the "File inspector" on the right side and look for an item titled "View as". Set that to "iOS 6.1 and earlier. This does several things. It makes your UI look like the app is running under iOS 6, and it makes the geometry work as if it's running under iOS 6.1 rules (the 0.0 point of your content view is under the status bar and your effective screen size is 20 points smaller when the status bar is shown.)
Next, select the views that are pinned to the top of your screen and choose the Size Inspector. (The tab in the utilities area that looks like a ruler). There is a new section of the size inspector called "iOS 6/7 deltas." This lets you specify changes to apply to the selected view when running in the "other" version of iOS than the one you specified above in the file inspector. Since we specified iOS 6, the current layout is using iOS 6 rules, so we want to specify the changes that are needed when running iOS 7 instead. If we had specified "View as iOS 7" in the file inspector, we'd be seeing an iOS 7 layout, and we'd be specifying changes to make when we run under iOS 6. You can do it either way. However, beware. If you have delta values (described below) and then switch this setting, IB moves stuff around on you in very confusing and destructive ways. Don't do that. Pick a value for the "View as" setting and stick with it for your entire app or you will get very confused and frustrated.
You want to make your navigation bars 20 points taller (They then automatically tint the status bar and adjust their layout so their titles and bar button items don't overlap the status bar.)
You also typically want to make views that are pinned to the top of the screen have a delta Y of 20 points to shift them down to make room for the status bar.
If a view is also pinned to the bottom of the screen so it's size adapts with the screen size, you'll probably also want a delta height of -20 pixels.
It takes some tinkering to get everything working right, but by setting your "iOS 6/7 delta" values correctly, you can create IB files that work correctly on both OS versions without any custom code.
If you DO have custom code to do things like tweak your layout for user interface orientation, though, things get really confusing.
I have a layout issue. I'm trying to make a legacy 3.5in app work on iPhone 5. As soon as I give it the Default-568h#2x.png splash image, the whole app gets aligned to the top of the screen, leaving a huge white gap at the bottom. The autosizing struts and such seem to be set properly (not using Autolayout at the moment), but the thing doesn't stretch to fill the screen. I'm not sure where to look next. I just want my poor tab bar to be at the bottom!
Since you're not using AutoLayout, now is a great time to start. Xcode 5 makes setting constraints a simple exercise.
I suspect that your tab bar frame is hard-coded to certain x, y, width, height coordinates which work well on the 3.5" screen. You can also see how your view renders on taller screens by pressing this button in the Xcode 5 Interface Builder: