How to slide content over with AutoLayout - ios

I have a messaging view where the user can select emoticons to add to the message. I have a bar above the keyboard where the user can enter their message. It looks something like this: H:|-[UIButton: emoticon]-[UITextField]-[UIButton: send]|
Now I've tried to slide all these over by setting their left constraint to constraint.constant -= screenWidth, but this didn't seem to work, as I got loads of "Could not satisfy constraints" messages in the log and none of them moved. I also had the problem of not knowing where to put the emoticons (it's a bar of UIButton with one emoji each).
Is there a way to do this in a simple way?

If I understand what you're doing right (you're sparse on the details), your problem is that your constraints are still pinned to the start and end.
You will probably need to remove the last item's right constraint before you can scroll anything.
That said, what I usually do in cases like this is wrap everything that's supposed to scroll in a plain UIView. Then I can keep their internal constraints the same, and only the UIView is pinned to the left and right of its superview. To scroll, I simply add a width constraint with the current width, remove the right constraint, and then subtract from the left constraint's constant to scroll it off screen.
That extra view gives me a guarantee that everything stays the size and location it had at the beginning of the animation, and might even allow me to optimize the animation (e.g. I can rasterize the view before I scroll it out, and UIKit then only has to move one layer).

Related

How to set up my constraint perfectly to the bottom in Storyboard

I am using AutoLayout in Storyboard. I have set translateAutoResizingMasksToConstraints to false. I have created a constraint like so:
The superView takes up the whole screen's frame. When I run the App, the bottom bar view doesn't appear. However, if in the picture I change constant to 50, it jumps up to about where it should be expected.
I have had a previous branch where I did not set it to 50 but due to some other constraints it appeared as expected. But it's not exact and I don't know why it's behaving this way all of a sudden. I've used the View Debugger feature and the bottom bar view straight up doesn't appear at all.
How can I set it so that the constraint has a constant of 0 and still appears? What might be a reason for this bug? Thanks!
When you are trying to add constraints to two items, you try an easier way by choosing two of them(even super view) like this:
Then click 'add new constraints' on the right bottom of storyboard/xib,
Then you can choose different types of align constraints as you like.
If you only choose one item to add new constraint, then align will be disabled cause it needs two items.
Try printing the bar's frame in view did appear, if you are not sure whether the bar is just outside the visible field. Have you set constraints to the sides and a height as well? As a rule of thumb you can say that a view needs 4 constraints before iOS knows exactly where you meant for the view to be placed.

Why do autolayout constraints in Xcode cause my subview to disappear off screen?

I'm trying to figure out how to use autolayout, and there seems to be a lack of info about it on the internet. I placed a view within my view controller with three buttons inside it. Before I place any constraints, the buttons show up on the preview. However, as soon as I make ANY constraints, the whole sub view completely stops showing up in the preview. I made a constraint to center vertically, and then one to place it 25 pixels from the left edge. It should know exactly where to place it, but still nothing shows up.
Any ideas on why constraints cause my buttons to not show up?
With Autolayouts the constraints should be as clear as possible. You can try by adding size constraints as well as fix(right, top or bottom) constraints if necessary.
When you don't use auto-layout it positions everything manually. When you enable auto-layout it switches this behaviour off so you have an unconstrained object, which is why it dissappeared.
Turns out I didn't have constraints on the size of the sub view, so it didn't know how to center it. I didn't think I needed that because I thought it would default to what it's already at.

Auto layout constraint breaks when resizing view dynamically (dragging motion)

I have a view that is sandwiched between two other views, and the height of the middle view can be changed through pan gesture.
I'm using a gesture recognizer to get the location of touch and feeding the value to the middle view's height constraint to make it dynamically resizable.
One issue is when the touch location goes beyond the middle view's bounds and overlaps with either the top view or the bottom view, I get the warning:
Unable to simultaneously satisfy constraints ...
Will attempt to recover by breaking constraint
This hasn't really caused any real issues but just in case it might cause a big problem, I'd like to know if
a) it's correct to use the height constraint to dynamically change the height
b) there is any way to avoid getting that warning logged
Thanks!
To answer your question:
a) Yes, this is the correct way to update the height of the view
b) Yes, there is a way to get rid of the warnings
Since your view gets negative values for the height constraints, you could add a check for the height so that you never set a negative value to it. Then, you won't have the error log anymore.
Not sure if you are supporting iOS 7 also, but if you are, the app will most probably crash because of the layout errors.
So, my suggestion would be to add something like this, to where you are updating the constraints:
[self.heightConstraint setConstant:MAX(0, value)];
Good luck with your project!

Auto Layout Not So Auto

I have the most basic set up possible. See pic 1:
Believe it or not this is my first project using AutoLayout, I have created everything prior programatically. This basic set up is literally a UIWebView with 1 custom UIView positioned at the bottom. Previously I was using a tool bar that handled everything for me and had no issues with constraints whatsoever. However, the tool bar created discrepancies for event handling when adding a UILongPressGesture to the subview of the UIBarButtonItem so I decided to convert the tool bar to a UIView (Even inserting a UIView into a tool bar, it naturally converts to a button item) for easier handling. But run-time, the view gets pushed off screen by half of the UIView size (48px) See Pic 2. Then when I add buttons, it just gets worse:
I have reviewed the documents and the support HERE with no results. I've spent about 24 hours in total researching it and learned a lot, so my efforts aren't in vein. I KNOW by 'Adding Missing Constraints', the constraints are just recommendations based on the current set up, they aren't concrete in all cases, so I did try to create my own with control drag after reviewing the documents but my set up concluded with no different results, and exponentially more sloppy. So I decided to include the populated constraints by Xcode below :
UIWebView Constraints
Custom UIView (toolBar) Constraints
Any solid starting point recommendations? Does Intrinsic Size have anything to do with it?
EDIT : WORKING CONSTRAINTS I didn't realize you could simply omit a constraint. It seems the culprit was adding one to the top layout guide.
Just for answerer #Matt :
Constant 0 result : there are small gaps at edges
-16 for leading space/trailing space results as a true toolbar emulation in my case with no outstanding warnings or issues. Thanks
Let's talk about the view at the bottom of your interface and how you would use auto layout to position and size it the way a toolbar would be positioned and sized.
To use auto layout, you need to supply sufficient info to determine both position and size. This view is a subview of the view controller's main view. The main view will be resized depending on the screen, so we want to use auto layout to resize the subview ("toolbar") as well. This is what auto layout is for!
So constrain subview leading edge to the leading edge of the superview, and constrain subview trailing edge to the trailing edge of the superview, both with a constant of 0. Now the right and left edges match the superview!
That takes care of horizontal position and size.
Now let's talk about vertical position. The position should be the bottom. So constrain subview bottom edge to the bottom layout guide of the view controller, again with a constant of 0. Now the bottom of the view is at the bottom!
The only thing we don't know is the top of the subview. This, in our situation, is the same as knowing its height. So give the subview a height constraint, set its constant to a reasonable value like 40, and you're done.

Autolayout - Why does "Vertical Spacing" sometimes attach to the opposite side of a view?

When I select "Vertical Spacing" in interface builder, I expect the bottom of the upper view and the top of the lower view to have a relationship. However, frequently what seems to happen is that the bottom of the lower view gets linked to the bottom of the upper view. Then at runtime the bottom view will have the wrong frame (after resizes, animations, etc.). Is there a way I can ensure that views are consistently linked bottom to top?
[EDIT]
Here's another example. I set a height of 419px. I select "Top space to top layout guide". But instead it puts a constraint for how far the bottom of the imageview should be from the top of the superview. Then I change the height from 419px to 374px, and the view has correct height, but a gap at the top.
I've noticed this many times (usually when attaching the top of something to the topLayoutGuide), and I've put it down to a bug in Interface Builder. It seems like the issue has gone away in the betas of Xcode 5.1
The only workaround I've found is to initially move your view away from the view you're attaching it to, and then create the constraint. In this situation, Xcode will usually do the right thing. Then manually edit the constraint's constant back to 0 (or whatever you want it to be).
Instead of adding vertical spacing, try by adding "Top spacing to nearest neighbor" constraint. Please refer attached image,
Hope this will help.
This issue is fixed in the latest versions of Xcode. You can now select which part of the constraint you want to attach to. It may attach wrong initially, but the constraint editing controls are much better now.

Resources