minimum number of lines UILabel in iOS development - ios

I was trying to make a cell in uicollectionview. please see these two images
Thats the cell of a collectionview and the first uilabel's number of line is 2. what I am trying to do is the uilabel will always take 2 lines of height regardless of the content of the uilabel, is it possible? if the text is short, second line will be blank.
If I add height constraint, the text is vertically centred. How to make it top-aligned?

There are 2 steps.
First select your label, click the add new constraints, and check the height constraints, as grow4gaurav said.
Next, go to the attributes inspector and set the number of lines to 0. This makes it so that the text uses as many lines as it wants. So, if the text is short, and it only uses one line, it will just use the top line. If it is longer, it will use the bottom line too.
Hope this helps

Related

How to build a layout of single line and multi line labels in iOS autolayout?

I have an application in swift,and have encountered an autolayout issue. I've come up with the solution to it, but it doesn't seem to work as expected.
So, here's the issue:
I have two labels in a table view cell. The first one should only have one line, and the second one must have as many lines as needed and take up as much vertical space as needed. The first label should always be shown fully and, therefore, determine the position, the size, and the number of lines of the second label. Texts for both are set programmatically when drawing the cell, of course.
The solution seems to be pretty simple: Anchor the first label to the left, center it vertically, anchor the second label to the parent top, right, bottom and the right side of the first one. Set the number of lines to 0 for the second label. The editor shows no warnings or errors.
This is how it looks like:
In most cases it looks good, like on the picture below, but sometimes not (red arrows at the picture below):
The first label should have absolute priority and never be truncated, wrapped, or cut, but this happens. What am I doing wrong?
UPD: For the question to be more clear, the first label is so called 'margin label', it represents the margin and the indicator of the cell. This is done to imitate a tree structure. The second is, of course, the text itself. '>' is for the closed comment, 'v' is for the opened.
Select the first label (the >) and go into the measurements panel in Interface Builder.
Near the bottom it will have a value for "Content Compression Resistance". Currently it will be 251 or 751 (I can't remember which) and it will be equal to the other label.
Change this value to 1000. This will stop it from compressing and make the second label compress instead.
set height constraint for first label and set 1 for 'lines' attribute
you can set the trailing of the first label is >= to the leading of the second label
Increase the content compression resistance priority of the first label. If needed increase the horizontal content hugging priority of the second label.

Moving item after constraint has been applied

I have a table cell, and it has a label (which has the username), and a button (which takes to a location). There are constraints set to be the same on the y axis (center vertically to each other) and 5 px trailing/leading to each other. Works great. What doesnt work great, is if the label text is extremely long. It will push the text off the screen. How do I make the button go down to below the label? Similar to float in css?
^^This is the cell, and as you can see it goes off the screen. I need "San Francisco, CA" to be pushed below the label "#VeryReallyReallyLongUsername". I know you can do dynamic cell resizing using AutomaticDimension...
For that you should manage many thing programmatically. You can take outlet of constraint by ctrl + dragging from constraint to class file.
Then you can manipulate it's constant.
So if you want to let your button goes down when text is large then you can take outlet of top constraint of button and then increase it's constant by some pixels that you want and do same for label take outlet of it's width constraint and increase it's constant by some pixels that you want to increase width.
Second thing if you don't want to manage stuff like mentioned above then you can use multi line label. just set the numberOfLines property of your label to 0.
So if text size will be large then label distributes in two line or three line.
Or you can set Autoshrink property from attribute inspector from IB(story board) to minimum font size and set minimum font size with it. so if text is larger then it reduce font size that it fits exactly to label but not reduce more than that minimum size that we have set.
Hope this will help :)
Not easily. It may be possible to set up constraints which would do this, but I wouldn't know where to start.
I would pick another option such as having the label truncate the long value (it will put ... at the end), or to have the label scale the text smaller, or to have the label grow vertically and wrap the text.

Two uilabels on uitable with dynamic height

I am trying to implement one English to Swedish learning app for Swift/IOS there I want to have two dynamic rows, data is coming from array and I tried my best to fix it out. I have seen approx. all stack overflow links as well but no success at all.
See the screenshot, as the text is long, I cannot see it on the screen and the text is not coming on the second line as well. As, I add any constraint, both lines sometimes disappeared or only one lines comes.
I have seen this tutorial link as well but cannot get any success.
Can any please see the code and fix it.
Here is the complete code
You have to use UITableViewAutomaticDimension to manage the cell height as per the content. For that you have to set the constraint of your labels from all the sides, ie Click on the PIN and then uncheck the 'Constraint from margin' check box and for both of your labels add constraints from Top, bottom, Left and Right side.As it is required if you want to use UITableViewAutomaticDimension.
Now in the ViewController in viewDidLoad method add this two line
self.tableView.estimatedRowHeight = 44.0
self.tableView.rowHeight = UITableViewAutomaticDimension
and then you your labels will display full text.

UIScrollView and variable text size

I'm creating an app with quite a lot of text. It will be of variable size, so I was wondering if there is a way to adapt my ScrollView to the size of the UILabel, not knowing in the IB what will be the number of lines of that label. I'm doing it from the IB, drag n dropping it, then I'm putting 4 elements inside : an image for the logo, a title, another image, and then the label.
My question is : how can I tell my ScrollView to adapt to the text ? With constraints ? In the code ? I'm sooooo lost with that scrolling thing…
I think I need a very very good tutorial about autolayout…
Here's some screenshots of my project
The project on simulator
The layout
Thanks a lot!
You have to add the constraints to your label so that it will always have the same spacing to the scroll view. Also, you will have to set your labels lines to 0.
Don't press Add Missing Constraints because it will probably set your height and you don't want that to happen. Use the Pin button to set the spacing to nearest neighbor.
These are the buttons you will have to use, they are bottom right.
First of all, press the one in the right and select All Views > Clear Constraints.
Then, select your label in the storyboard and press the button with a square Pin, here you will have to select everything until you have something like this with different values... Also click in the red lines so that you get a continuous red line. Don't check any of the boxes you see.
After this, you have to do the same process for your Scroller.
It should be enough. I will also need to know where your scroller is.
If you have anything else in your view, do the same.

UILabel that has unnecessary padding in a cell

I'm trying to make a Facebook clone for practicing iOS and I can't see why a label I have on my news feed gets unnecessary padding.
It only occurs on some labels, others on my news feed turn out fine. However for a select few there's a block of white pace above and below. At first I thought it was an alignment issue so I changed the labels background to green to show that the constraints hold out.
Anyone know as to why it's placing the padding, only for a select few?
By default UILabel will center its content vertically. Therefore, if label.bounds.size.height is greater than size of the text, the label's instinct is to center the content vertically, which will results in the vertical padding that you see in the attached image. Ensure that the label's height is being set according to the height of the text it contains and the problem should go away.
As dbart pointed out your label's frame is likely higher than the text needed. You can fix this by calling -sizeToFit. You can also check the amount of space the label is actually using for text by using +textRectWithBounds:maximumNumberOfLines:
If your cell is using autolayout to determine the height of the label you should set the preferredmaxlayoutwidth to an appropriate value (for example table width) before laying out the cell.

Resources