Whenever I run my iOS app on a device that has a home bar, the bottom of a UIScrollView or one of its descendants will render too low.
My app has a bottom navigation. I made the scroll view constrained to the safe area on the Y axis. It contains a container view (Cv For Home) in which I load a subview:
The container view is constrained to the superview (scroll view), though.
In my child storyboard's subview I have a collection view, that I have to constrain a lot from the bottom of the superview away, oddly enough. Otherwise it will not display entirely on the devices:
That's weird, but it works, unless I run the app on a device with home bar. I think this might be related, but I'm pretty new to constrains and I can't get it right for some reason.
The result, then, looks like this:
As you can see the last cells are hidden below the bottom navigation on the middle and right device. Both have a home bar, the left device does not. How can I fix this?
EDIT: The bottom navigation looks like this:
I also tried to set the bottom constraint of the scroll view to the top of the bottom navigation, but that was resulting in the same issue.
EDIT 2: Taking a look at the Debug View Hierarchy reveals in fact, my Safe Area is too long, so it seems that it has a fixed height and using a bottom constraint on the bottom edge of the Safe Area will break if there is a home bar:
The parent UIView has the correct size.
Related
I have a view controller that looks fine on all devices but leaves an undesired white padding behind the Home Indicator on iPhone X. I would like my background image to extend all the way to the bottom margin, and be behind the home indicator like, for example, a tab bar does.
I realize that I could use negative margin over the image, but then that means that I am cutting part of it on other devices. I also setting a parameter to "prefer hiding the home indicator" but it simply hides the bar, and does not extend the image to the margin.
Is there a better way to achieve this?
Finally got to a solution!
First of all, you need to either use a "new" View Controller that contains the Safe Area Layout Guides, or activate them on the Document tab of the View Controller:
After this, you need to realize that a safe area is the view from above the Home Indicator up to below the Status Bar. However, once Safe Area Layout Guides are activated, if you set a constraint to the bottom of the superview, it will go beyond the Safe Area and into the actual bottom (or top if so desired) of the View Controller.
Hope this helps!
I have a UITabBarController with one UINavigationController holding a UIViewController as root view controller.
when tapping one of the button in the UIViewController, I push a regular chat window UIViewController (with TableView + Input View) end hiding the bottom tab bar. (using the "Hide bottom bar when pushed" flag)
In storyboard I added a regular UIView subclass to VC that look like a bottom bar, and I use Auto Layout to pin it to the bottom of the VC view.
The problem
when I push VC it takes a second for this view to pin to the bottom, it looks like auto layout pin it to the bottom as if the tab bar is not hidden and after a sec it recognise that the tab bar is hidden and moves it to the real bottom of the view.
For clear info check this screen shot
Now I will let you the know the constraints of the table view..
Now I am showing the constraints of the InputView
I am also adding my View hierarchy...
I had a similar issue in my project. I solved it by selecting the view I wanted anchored to the bottom (in your case, the input view), held Command, and selected its superview (both views should be highlighted now).
Then I selected the align button at the bottom of IB:
And added a Bottom Edges constraint.
What I had done initially is used the pin menu to pin the view to its superview, but it appears that will pin it to the bottom layout by default, which causes that weird movement during the transition.
EDIT:
After seeing the latest screenshot, the problem could lie in one of the superviews. I'm assuming that chatWindow is a UIView, and your Scroll View is horizontal only. Here's what your should check:
chatWindow is pinned to the scrollView's bottom similar to what I've outlined above.
scrollView is pinned to its superview as I've outlined above.
Moving the inputView outside of the scrollView to the root superview. Then one by one move it down the hierarchy towards its current location.
I am learning iphone app development and I am using swift. I took the lynda tutorial and I have created a very basic UI which is View Controller > View .
In the View I added a segmented control, two buttons(horizontal, facing each other), three labels, one textarea and two other buttons(horizontal, facing each other).
So I have these UIcomponents arranged vertically and I used 'Reset to suggested constraints' and made all the buttons equal width and equal height and everything is fine in potrait mode but as soon as I go to landscape mode the last two buttons disappear, if I add a constraint from bottom edges the whole UI gets messed up i.e. only one label and part of an upper button appears.
What should I do to make all the UI components visible both in potrait and landscape mode?
There are many ways to go about this. I've set up a github project to show you one way to achieve it.
Short resume of what I did manually without the help of the Interface Builder:
I've pinned the segmented control to the left, top and right of the parent view
The red button below has a vertical constraint to the segmented control and a leading constraint to the parent view. It also als a horizontal space constraint to the green button
The green button has a trailing constraint to the parent view, top aligned to the red button and widths set to equal to the red button.
This setup ensures, that the segmented control is responsible for specifying the distance to the top of the parent view and the red button specifies the width of itself and the green button (test it, by changing the value of the horizontal space constraint)
I've turned the same principle upside down. So the views in the bottom are always pinned to the bottom. But as I said, there are many ways to achieve this. You could also create 3 container views for the elements in the top, center and bottom and pin those to the top, center and bottom.
The running app looks like this:
If you would like to display your content differently in landscape mode, it is possible (and most likely preferable) to create an alternate landscape interface.
Quoting the Apple developer's page on the subject:
"To support an alternate landscape interface, you must do the following:
Implement two view controller objects. One to present a portrait-only
interface, and the other to present a landscape-only interface.
Register for the UIDeviceOrientationDidChangeNotification notification.
In your handler method, present or dismiss the alternate view controller based on the current device orientation."
For more information about this, check out this apple developer page and scroll down to "creating an alternate landscape interface".
https://developer.apple.com/library/ios/featuredarticles/ViewControllerPGforiPhoneOS/RespondingtoDeviceOrientationChanges/RespondingtoDeviceOrientationChanges.html
I have a UITableView in my storyboard. I put a navigation bar at the top of the view. However the title seems to close to the top of the view near the time and battery. Is there any way to create spacing like in the view to the left of that one? I tried simply dragging the navigation bar down but it seems pinned to the top of the view. Any help is appreciated. Thanks!
If you are using autolayout (which I very much recommend), you are just missing a Vertical Space Constraint between your container view and your table view.
See the size inspector (as shown below) for a list of constraints on a UI element, or browse your Document Outline for missing constraints.
Say I have a UIViewController and I want to add a red UIView atop it that covers its view completely using Auto Layout.
My first instinct was to pin it to every edge of the view controller's view, but due to the iOS 7 nature of view controller views extending underneath the nav bars, pinning it with a constant of 0 doesn't put it under the nav bars. And if I put -64 to cover it in portrait, that's not the correct constant for landscape as the nav bar is shorter.
How should I be implementing this?
Make sure your view is pinned to the top of the super view, not the top layout guide. It sounds like it's currently pinned to the top layout guide.
If it is pinned to the top layout guide, the best way to fix it is to delete the constraint, select the view, click the "Pin" tool at the bottom right of IB, and then select the top with a setting of zero.
This works fine in Xcode 5.1.1, but was a little buggy in earlier versions. Control+Drag onto the view generally forces you to select the top layout guide instead of the top of the view.