Autolayout - 2 Labels with dynamic length - ios

I have a question about Autolayout - normally i dont have any problems using autolayout, if a cell label has a dynamic length - but it this case ill got 2 labels, 1 top label with a dynamic length, and a second one under the first label.
Ill tried to set to the top label a leading, trailing, a fixed width (its an ipad landscape app, so i want to have and exact with) - and to the second one a bottom, trailing, and set the leading to the first label. Like here:
But i am unable to bring that to work that:
Both labels should have an dynamic length - so update the cell height automatically. Width of both Labels is 700px, width an margin top, right and bottom is 8.
Ill forgot to say, but the left label should have a dynamic height too.
Any ideas? Thanks in advance!
Errors after using "Lukas" Tipp:

By default, both labels will have a same hugging and resistance priority, making one of them less than the other would fix the problem. Ps, I'd avoid using magic numbers like 8 in your auto layout, instead use standard value

Related

ios swift custom uitablecell how to put several items (labels, images)

I have custom cell as shown in image below :
I want to make an indentation from leading and trailing edges, like below
Is it possible to do it by using autolayout?
I tried adding +5 to leading constraint with decrease Compression Resistance Priority like but it does not work.
So you need padding of 5 pt on the left ? Yes, you can do it with auto-layout. You may remove the constraint you marked in the image, and instead add another leading constraint form the stack view to the cell content view.
Another option would be to add a dummy view (or even better, a UILayoutGuide) with width as 5 pt, right to the left of this day label.

iOS AutoLayout - Label overlaps nearby label

I have a problem with a label constraint.
My goal is to have 2 labels on the same Y coordinate of a tableViewCell. One of the labels is pinned on the left side and the other is pinned on the right side.
Like that:
[This is the first label] [Second]
The first label should have a dynamic width based on the text which it has to display, BUT it should end about 20 points to the second label.
I tried that with numerous constraints, but sometimes the first label seem to push the second label out of the view and sometimes the first label just overlaps the second label like in this example:
The first label has constraints for:
Top Space to Superview
Leading Space to Superview
Bottom Space to a third label
Trailing Space to THE second Label (<= 20)
What is the correct way to display the two labels correctly?
Thanks in advance, appreciate your help!
EDIT
Tried the solution with giving the second label a maxwidth. Now, it is randomly working or not working. I don't get this at all.
Like others have said, you need to set the trailing constraint from the left label to the right label as greater than or equal to, so that there is a gap of at least 20 between the two.
But, you also need to designate which label truncates first. By not doing this, iOS will take it upon itself to choose, which is probably why your current solution works only some of the time. This is where Content Compression Resistance Priority comes into play. Set the value lower for the label you want to truncate first.
You can do this on your storyboard under the size inspector.
I'm assuming you want your left label to truncate first. In that case, make sure the left label has a lower horizontal content compression resistance priority than the right label. Notice how above I just dropped it to 749, as the default is 750.
Check out this answer for a good explantation on content compression and content hugging.
if your second label on the right side has fixed width or max width :) here is what you can do :)
Set the distance between left label and right label to >= 20
set the width of the right label with some value using [yourvalue] or [>=your value]
SO overall here is how label's constraints should appear
|-(distance_to_left_Label)-[left-label]-(>=20)-[right_lable(your_value)]-(distance_to_right)-|
Hope my answer helped :)

UIScrollView with multiple multi-line labels and AutoLayout?

Is there a way to achieve this? I have tried literally everything and nothing has worked for me yet.
So basically what i want to do is the following: I have a scroll view with some labels in it. All the labels get their text from a server and I have set their number of lines to 0 so that they change their height according to the amount of text. However, this does not affect the scrollview content size(even though my labels have constraints set up to the bottom,top,leading and trailing of the scrollview) and the labels go off screen and I am unable to scroll down. Can someone point me in the right direction to how I would set up my constraints, my view hierarchy and etc?
Any help is much appreciated! :)
Late, but this solved it for me:
Set leading (I have a 32pt inset), trailing and top constraints. The trailing will not actually seemingly do anything..
Make the trailing Greater Than or Equal to avoid localization alert.
Finally, add a new Equal Width constraint to the label matching the scrollview. Use the constant to subtract the required padding (I used 64 due to mirror my leading inset).
And voilĂ ! The Label will align correctly both in IB and in-app.
In Scrollview the last view's bottom constraint is so important. You should set its priority to 250 and put it to Greater than or equal.
Remember you should only change the bottom constraint of the last view, which in my case it's the continue button.
I would consider using UITableView instead, it has several benefits:
It allows for reuse of cells, if all the cells look the same
It manages recycling of cells when the number of values you're getting from the server increases (decreases memory pressure when number of cells becomes substantial)
It allows for more flexibility with the content (it's quite often for design to change last second or to evolve over the course of the project)
Most importantly, UITableView support auto sizing cells (as of iOS8), you need to specify the constraints between the label and the borders of the cell
There are several resources to start with:
http://www.raywenderlich.com/73602/dynamic-table-view-cell-height-auto-layout
https://www.captechconsulting.com/blogs/ios-8-tutorial-series-auto-sizing-table-cells
http://www.appcoda.com/self-sizing-cells/
Use a container view in a scrollView
Add constraints to superview (leading, trailing, top, bottom, height,width)
Make IBOutlet of constraints that you are going to update.
Add you all labels inside that view.
Update constrains/frame of your label so that it fits the text.
How much you increase the label height you should increase the container height too.
If the label count is not fixed use custom label class to add subview.
Perhaps you should need to understand how ScrollView works in Storyboard with autolayout.

Auto-layout making the same width for each element

I am using auto-layout for my screen but despite I set the same width, same hugging priority and compression resistance(for all the textfield). I am having many warnings to ask me to set them differently but it looks different from what I want.
What I want:
1st row: The X seems to be hidden a part from the edges
2nd row: The textfields to
be the same width and the dash can be shrink if space is running
out(but visible).
Warnings:
It seems you just have the constraints a little bit off. This is how they should look like:
Add a leading constraint from the first textField to the superview
Add horizontal constraints between the textFields (from the first one to the second and so on)
Add trailing constraint from the last one to the superview
Select all 3 textFields and add an equal width constraint to them
This should work, so you can achieve what you need. Let me know if you need more help

Autolayout multi line label in a table cell with fix height

I have a table view with fixed height cells. In the cell there are 3 labels; name, address and type. The name label can be 1 or 2 lines while other 2 labels are only 1 line. I want to come up with something as in the screenshot. When the name label is 2 lines, it decreases the padding on the top and bottom of the cell.
So, I set the constraints between labels to be equal to some constant number. And also used inequality constraints between the name label and the cell's contentView. It actually worked and produced the screen below. But it gives me ambiguous layout in autolayoutTrace for the all 3 labels. I guess my inequality constraints are causing the problem.
How can I achieve this screen properly?
If you are sure that height of all labels are fixed and will not change in future then it seems you are doing in correct way. For ambiguous layout you may have sent some constraint that are not required or conflicting, you can debug constraints and make necessary changes. Reference :Debug Constraints
put the two labels in a container. Then set left margin, right margin, and center Y alignment constraints on the container.

Resources