I'm testing iPhone X behavior using the Xcode simulator. For some odd reason, if I'm hiding the Status Bar the Navigation Bar pushed upwards causing the title to completely disappear and cutting the left and right buttons. This is happening only on the iPhone X.
Illustration:
How can I hide the status bar and keep the Navigation Bar at a visible position?
UPDATE:
Sample project for your convince:
https://drive.google.com/file/d/0B5qJARV-Oc9ra1hvZkpXZm9lRUE/view?usp=sharing
One solution is to embed the navigation controller inside a container view controller which is properly constrained to the safe area.
Just create another view controller and drag a "Container View" from the Object Library. This view has top, bottom, leading, and trailing constraints to the safe area, all with constants equal to 0. If you control-drag from the container view to the navigation controller, you'll get an option to set an "embed segue" which will embed the selected view controller as a child view controller.
I set the status bar to be hidden on the new view controller I created, and it works fine.
This feels like something that UINavigationBar should handle automatically, but this workaround seems like it should work pretty well.
Another note: if you change the color of the navigation bar, you'll also need to create another view above the container view, and change its color to match the color of the navigation bar.
I, for a small app, changed from using a Push to a Modal segue and adding in my own navigation bar. I used Push because it looks good, and already had a Modal for another part, which I wanted to animate differently for style reasons.
For smaller apps this may be the quickest and easiest solution, but my next update I need to use the navigation controller. For that I think I'll switch on the status bar, which is no big deal for me and allows it to work.
I think you need to use "safeAreaLayoutGuide" new update in iOS 11
Apple has provided us with the necessary APIs to get around the unsafe regions of this iphone x. We do this by using the new safeAreaLayoutGuide anchors in our code
safeAreaLayoutGuide
Related
What I'm trying to do: place the tab bar at the bottom of the iPhone X display where it belongs, and also put the navigation bar at the top of the display.
I've been trying to accomplish what I thought would be a straightforward task of using Safe Areas in the storyboard to position the tab bar near the bottom of the iPhone X's display. I'm missing something fundamental.
I've read a lot of writeup about how to do this, including this one. It includes a screenshot of a tab bar control scene that looks like this:
But I can't create a view inside my Tab Bar Controller to put my tab bar item in, as the article mentions. It's my understanding that I'll use the safe area of the view that should contain the tab bar item. But it won't let me put a view anywhere except outside the Controller view. I've tried using "embed" - but all options are greyed out.
Same goes for a navigation controller to move a navigation bar to the top of the display.
The funny thing is that IB renders it in the right place, but on my device, the tab bar is way above where it should be (and the navigation bar way below).
I have "Opens in" set to "Latest Xcode (9.0) and Builds for iOS 11.1 set in the scene's "Interface Builder Document", and "use Safe Area Layout Guides" is checked. I'm not using any custom classes for my tab bar controller or tab bar. I'm using XCode 9.3 and iOS 11.3.1
What's the simple thing that I'm missing? Thanks in advance.
The article explains how to adapt your app if you're using a custom navigation bar or a custom tab bar.
If you're using the standard navigation bar or tab bar then you have to make sure it's top or bottom (depending on the element) constraints are connected to the superview and not the Safe Area layout guide. UIKit makes sure these elements are correctly rendered with spacing at the top or bottom on an iPhone X device. Check out this screenshot for clarification.
I want to know how, if possible, one can keep the scrollview on top of the navigation bar. When I put the scrollview on my view controller it covers the whole screen except for the navigation bar and toolbar. I want to keep it on top of everything.
Use containerView to achieve this because containerView can contain Navigation controller within it like other controller.
And Add scrollView within containerView like below shown -
Hope it will work for you :)
I don't think there is a simple way to put the scroll view "on top of" the navigation bar, and it is certainly something that Apple Devs never intended to be done. Generally (although certainly not always) that means that if you want your code to work consistently as new versions of Swift and iOS are released, you shouldn't do it. The other reason you shouldn't do it (probably) is that unless you setup some sort of fancy "touch through" system you would never be able to actually use the nav bar, at which point you might as well just save the trouble and not have a nav bar in the first place. You can, however, easily check a box in your storyboard to have the scrollview go under the nav bar, and have the nav bar be translucent so that you can see the scroll view content under it.
Good luck!
I think preset modal(UIModalPresentationOverFullScreen) is what you're looking for.
Trying to set up a scrollview in a UIViewController that has a nav bar. In IB my content gets pushed up to the top below the nav bar (see image).
When running the app on my phone the view is pushed down to sit below the nav bar which is fine. Is there anyway to get it to reflect like this in IB. It is hard to set up my content when half of it is cut off.
If I add a constraint to make the top of the view sit below the nav bar when I run the app it adds that offset and doesn't look correct. (I guess I could alter the constraint before running on my phone but seems like a ridiculous hack just to layout my app). (Already having major issues getting my scrollView to work the way I want it to... don't scroll if my content fits the screen but also use the scroll view to move the view up if the content is covered up by the keyboard but thats for another post)
when I run in simulator looks like this
In Interface Builder you should make sure your NavigationBar is set to Opaque in the simulated metrics. When you have a transparent Nav bar content can go underneath it.
It might look right in your app if you have a global attribute applied to make sure all nav bars are not translucent.
I'm experiencing a bit of a weird issue and I'm hoping someone can point me in the right direction.
In Xcode, using storyboard, I have a view controller that inherits a navigation bar. This is working fine. Where the issue is is that when I add an element to the view controller (ie, UIButton, UILabel, etc) and run the application on my phone, the Y positioning of the element is off by the amount of the height of the navigation bar.
Let's say I wanted to have a UIButton DIRECTLY BELOW the navigation bar, I would have to move it UNDER the navigation bar, to the very top of the view controller on the Storyboard. On my phone it would be directly below (Y positioning) the Navigation Bar.
I'm fairly new to iOS development, so I'm not even sure where to begin. I tried enabling / disabling Auto Layout, which didn't change anything.
Try this:
Click on your view controller, in the Attributes Inspector uncheck the "Adjust scroll view insets" option.
I am a beginner using storyboards for iOS. I have been using the tab bar controller to show my content.
When I first implemented the UITabBar I could see all the icons at the bottom of the UITabController in storyboard and I could see the UITabBarItem at the bottom of each UIViewController. Why is there now a blank grey bar? I can't seem to change the content either in storyboard. I tried adding another UITabBarController but got the same problem, it also has a dark grey bar at the bottom. However when I run the app all the icons appear. How do I fix this so I can see the UITabBarItems in storyboard or should I just try updating them programmatically instead?
Showing a tab bar or not is one of the couple of simulated metrics used in Interface Builder. As such they only serve to have an idea of how your controller would look under different conditions but do not really change anything to the actual controller.
Most of the time the default Inferred option will try to deduce from the Storyboard configuration how it should look like. In your case just connect the tab bar controller to your controller through the viewControllers outlet.
In contrast, below you have some View Controller properties that change both how your controller is previewed in Interface Builder and also its actual behavior (for instance try changing Adjusts Scroll View Insets or Extended Edges).