I have a save button that is supposed to be located right above the tab bar and right under the table view, but it does not appear in the view when I switch to a smaller screen. There is auto layout on all the elements, and the button is centered horizontally, equal width to the view, and has vertical spacing between the table view and bottom. Any ideas on how to make sure the save button always appears in the position stated above? Auto layout was done through storyboard not code.
set height of UIButton, and do not set height of UITableView.
Related
I have a weird behavior when I use scrollView.
As you can see in the picture bellow the button called "Back" has a bottom space constraint with value 0. But we can see is not even near to the bottom of the scroll view.
I already set the scrollview to have equals width and height of the superView and top,bottom,trailing and leading space with 0 value.
How can I fix this? I want the Back button still inside of the scrollview and put it at the bottom of the view.
Update
I have the code here https://github.com/rchampa/NDParallaxIntroView and the xib is called PageB.xib
Ricardo: you've added two constraint regarding manage y position of Validate Code button where your top constraint stop to move Validate Code button towards the bottom. So please remove top constraint of Validate Code only add bottom constraint.
you need to manage all constraint like your scrollview content view height will be equal to height. Please increase some top constraint from top.
So, if I understand correctly, the problem you are running into is that your back button is unable to be positioned based on the bottom of the scroll view.
A scroll has two sets of constraints in a storyboard, one that defines the size of the scroll view, and the other that defines the content size. The top, left, bottom, right to superview constraints on the scroll view will define the size.
The part that is causing your problem is that the content size is defined by the subviews inside the scroll view. So the button cannot be placed relative to the bottom of the scroll view since the scroll view doesn't know how large its content size is. All of the subviews of a scroll view must be placed in relation to each other.
So, create constraints for your logo, text fields, and all the buttons in relation to each other. Then create constraints from the outer most subviews to the scroll view.
In your example, you would constraints from the logo to the text field, 1st text field to 2nd text field, then 2nd text flied to the label, label to the "Send email..." button, and finally "Send email..." to the "Validate Code". For the "Back" button, it would need a left align with the text fields and then a center align with the "Validate Code" button. Create a top constraint from the logo to the scroll view. Then have leading and trailing constraints from one of the text fields to the scroll view. Finally, create a bottom constraint from either the "Back" or "Validate Code" buttons to the scroll view. You will also need some alignment constraints (logo center to the text field is an example of one). After that is all setup, your view will be fully defined for the content size of the scroll view.
If I understand you, my new question is: how can I make the subviews
make the height of scroll fit 100% screen device height? Is there a
way to define weights like Android? I don't know how achieve this
since the canvas is 600*600 which is different to every device.
Response would be too long for a comment:
So you wouldn't use a scroll view for that. A scroll view is specifically for containing content that will not fit on the screen (so the user can scroll to reach the new content).
The simplest solution is to add a regular view that has TopLeftBottomRight 0 distance constraints (so it is the max height and width of the screen) and setup the view like you have here to position the bottom in the bottom left all the time.
There is also a weight system, I can explain that if you want, but it wouldn't be required thus far.
I feel like your next response will be something like "what if I want it to scroll when its too small for the current screen?". The only way I know of doing that in encapsulating all your interface into a single UIView, and changing its sized in the viewDidLoad/viewDidAppear based on the size of the scroll view. Something like this:
func viewDidLoad() {
super.viewDidLoad()
containerViewHeightConstraint.constant = scrollView.frame.size.height
containerViewWidthConstraint.constant = scrollView.frame.size.width
}
so, I'm pretty sure I have my auto layout constraints set up correctly... And I have my view controller embedded in a navigation controller. I put all of the things inside of a uiview that's constrained to the 4 sides of the phone (including the bottom of the navigation bar) but this is happening.
I have the picture constrained to the vertical center of the view, and at a 1:3 ratio to it's height. the buttons are constrained on the sides
the problem is that (as you can see by the button borders and the button text being off centered) everything seems to be larger than it should be and is causing an overlap, when the buttons are supposed to be flush against the bottom and top of the image view, but instead overflow on top of it (again, shown by the button borders)
ah, I'm just an idiot. Image View wasn't clipping subviews. Auto Layout's working just fine! Thanks. My b.
I'm experiencing some trouble managing a scroll view embed inside a navigation view controller. I'm using Auto Layout and I'll try to explain the problem the best I can.
I embed a scroll view in the controller's main view and pinned the top, left, bottom and right borders to main view's borders.
I embed a standard UIView inside the scroll view and gave it a fixed height of 800 points. This should act as a container for all my controls (let's name it content view). Then again I pinned its top, left, bottom and right borders to the scroll view's borders. Because the bottom space constraint of scroll view's descendant view was negative, I adjusted it bringing it back to 0.
For the width, I CTRL-dragged from the content view to the main view and added a Equal widths constraint.
Finally, I added an image view and placed it at the top center of my content view adding some further trivial constraint.
The storyboard for the situation I've just depicted is shown above (in the document outline you should see all the constraints I've defined).
My scroll view works, it scrolls fine and the image view is well-centered where it's supposed to be. However, there's a gap between the end of the navigation bar and the start of the scroll view and I can't figure out why. It seems to be as high as the navigation bar, but I have no idea about how to fix it. The image shown below should make you understand what I'm talking about (the content view is highlighted in grey for clarity).
I didn't write a single line of code to achieve this result. I would really appreciate any kind of help and I'm ready to give you all the information you need to help me address the problem.
I think you should uncheck Adjust Scrollview Insets property of your viewcontroller to get rid of this....
you have to uncheck Adjust Scrollview Insets
I am trying to change some frames inside the code but I want autolayout to be respected.
I have this hierarchy
When I hit the search button on top right of navigation bar, I want the green view to go up 50px. It is working great but the tableView is not following the autolayout since its top is binded on the green view.
So when I hit the button I have a blank space between the navigation bar and the table view.
Any ideas how can I sort this out using autolayout?
When using auto layout, frame is dynamic based on constraints. Each time the view layout, it will recalculate by constraints and update view's frame. So instead of changing the frame of green view, you should change corresponding constraints.
Make a constraint reference in code call topSpace which is the constraint between green view and top layout guide and set its constant to -50 when user tap the button.
I placed TableView on a middle of a layout with constraints to stay aligned with top/bottom guide bars and left/right sides.
When I insert prototype cell it doesn't go to the top and it's the same at run time. Seems like TableView holds space on top for something?
How do I make first cell to appear on top?
In your storyboard, adjust scroll view insets of your view controller is selected by default.
The best way to solve this problem is to add top and bottom constrains between the table view and its super view, instead of the layout guide, because the view controller will adjust the insects of the table view automatically.
By default, iOS adds a content inset on the UITableView. There are two solutions. You could either set the layout constraints to the top and bottom of the view instead of the top and bottom layout guides, or you could click on the view controller and in the attributes inspector, disable Extend Edges for Under Top Bars and Under Bottom Bars.