UILabel that has unnecessary padding in a cell - ios

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.

Related

UILabel height depending on font size

I am using a UILabel in a UITableViewCell to display a title. Normally the text is not too long and therefore the font size can be large. Notice how the text fills the height of theUILabel like normal.
However, when there is a larger title, I want the UILabel height to reduce to accommodate the smaller font size and not leave a blank gap in its place. Currently, my configuration produces this effect.
I am using constraints in my storyboard and have deliberately not set a fixed height constraint. Here are the relevant constraints added:
I may have made a rookie error in my configuration as I can't remember this effect happening before, but it is giving me real headaches (and a bad looking UI).
When UILabel is set to auto-adjust font size to fit, it does NOT auto-adjust the height of itself.
You have a couple options:
set Baseline to Align Centers, and just accept that you will have top and bottom padding
use code to calculate the "scaled font size" and update the font size of the label
Remove either the Top Space or Bottom Space constraints (depending on where you want the label to be anchored).
This will cause the label to automatically use fit itself to the text size.
Try this and see, it should work according to your need:
Set Top and Bottom constraints attribute Greater Than or Equal To and add horizontal center (Alight Center Y to superview) and show in this image.

Subview greater than its superview in ios / objective c

I have a view of limited width, lets say it 100.
I have multiple labels of same width inside that view and its text is centre aligned. So that text seems to be center aligned always.
Problem is when I got long text label it shows ellipses at the end of the text but I want to show whole text in one time while keeping superview width unchanged. Is it possible to attain this? If not then show how can I wrap that text if it is larger than its width. I'm new to IOS programming.
There is an issue with UILabel and autolayout. If you using it - check this answer: iOS: multiline uilabel only shows one line with autolayout
Also, check actual size of label and insure clipsToBound of superview is set to NO.

Stop UITextField from expanding horizontally

I have a UITextField positioned in a view next to a button. It has a trailing constraint of 8 to the button (which has a trailing constraint of 8 to the superview) and when I type long text in it, it simply scrolls along, which is I want. However, in order to retain the text typed in the field if the view is switched to another one (it's in a tab controller), I save the text in a holder variable and when it switches back to that view, I set the text in the field to the saved text.
The problem is that this causes the field to expand horizontally if the text is long enough, sometimes pushing the button off-screen, even with the trailing 8 constraint. I have tried to save the original frame of the field in a holder variable, and then after setting the text, set the frame to the saved original frame like so:
fieldFrame = messageField.frame
println(messageField.frame.width)
messageField.text = holderMessage
println(messageField.frame.width)
messageField.frame = fieldFrame
However, the field still expands, and it printed out 502.0 twice. My current thought is that the frame hasn't registered the change in width after the setting of the text in time for the println, but I'm not sure if this is correct.
Also, I've read some similar questions that suggested using a width constraint. If I use a less than or equal to width constraint on the field, will it still expand if on a device that's thinner? That is to say, since I'm currently using an any width and any height storyboard, it's wider than, say, an iPhone 6. So if I set a less than or equal to width constraint on the current width of the field, it seems possible that the field can still expand on a smaller device and not break that constraint.
Is there a better way to do such a width constraint? If not, how else can I keep the field from expanding and pushing the button offscreen?
Here's the problem. The text field has a tendency to size itself horizontally to its contents. The button has a tendency to size itself horizontally to its contents. Thus you have an ambiguity: those tendencies have the same priority, so the runtime doesn't know which one to collapse as the text field's text gets too long.
The solution is to adjust those priorities. You must lower the horizontal compression and hugging priorities for the text field - one point lower should be sufficient. Now the button will have a stronger tendency to match its own size to its contents, and the text field will clip its contents.
You can also lower the Content Compression Resistance programmatically (this also works if you are using a UIViewRepresentable in SwiftUi):
uiTextField.setContentCompressionResistancePriority(.defaultLow, for: .horizontal)
For more info on this topic please refer to:
https://medium.com/#dineshk1389/content-hugging-and-compression-resistance-in-ios-35a0e8f19118
Selecting the Text view, then within Size inspector:
1) Set "Layout Margins" to "Fixed".
2) Under "Content Compression Resistance Priority", set the "Horizontal" to be "Low (250)".

UILabel writing over another UILabel when to long text

I stumbled on to a problem to which i am not sure how to fix.
As you can see here the Label where the name is supposed to be,(i get the name from a user input meaning its dynamic). If it is written to long, it just writes over the other labels.
Also in the storyboard the UILabels are not set to be longer than another label. Each label ends right before the other one starts.
FYI i have already used constraints to make them have the position that they should. Any suggestions?
EDIT1
Also the name label to the right(the last cell) there should be more text but it is not visible. As if it is continuing to write over the edge?
EDIT2
Here is an image showing the constraints i have on the label and some other useful info.
EDIT3
Here is an image after i tried to remove the constraints and i even made the label so small but the results are still the same. The text is going all the way to the score label
Your constraint of the label width is set to 221, so its width will be 221 no matter what screen it is on. Thats why on simulator it behaves like this(different screen size than storyboard). Your constraints are wrong, thats why its overlapping, your label is bigger than its suppose to be.
EDIT
Set score label width constraint, set score label center horizontally and vertically in superview. Now right text label attach to this score label and superview, and left text label attach to this score label and time label, also set this time label width contraint so it doesnt change, its a small text and u know the size of it all the time, so you can keep it at width like 30. Now you are done, your text labels are adjusting their size according to screen.
If its still not working, check your superview has set constraint to adjust to screen size, as well as tableview.

Allow UILabel to grow dynamically using auto layout

I have a label which is going to contain a big description. I want the label to continue growing on new lines. In the image, its the label which starts with event_venue.....
The even_venue.. label has 3 constraints for now:
Vertical space with eventt_title
a horizantal space with the leading of the superview
a width constraints which defines that the label width is always less than the superview.width.
What I want to acheive is to make the event_venue.width less than superview.width, but if it has more text, it should display in new lines. Is this possible using autolayout?
This are possible steps which can create expandable UILabel
Set layouts for UILabel fixing its position
Set number of lines = 0
Set content vertical compression resistance to 1000 (this will allow text to push the label)
Since you want UILabel to expand you cannot give it fixed height constraint or its parent fixed height constraint. Sometimes depending upon condition giving height constraint is necessary to avoid error then you need to set its priority lower than vertical compression resistance
Yes, this totally is possible. I see answers here that are close to solution but not complete. Here is a solution which works with auto layout in Storyboard, no coding of sizeToFit or anything. Your modified steps would be:
Vertical space with eventt_title
A horizontal space with the leading of the superview
A horizontal space with the trailing of the superview
Set UILabel's Line Breaks as Word Wrap.
Set UILabel's lines property as 0.
I have solved a similar problem. I had to make a label that had a variable amount of text. Here's what I did:
In the storyboard, place your label with the origin where you want it.
In the Attributes Inspector, "Label" section, set the Line Breaks = Word Wrap
Fill the label with random placeholder text to the maximum shape you want. For example, if you wanted to fill the whole width and have room for a maximum of three lines of text, you could do:
abcdefghijklmnopqrstu
abcdefghijklmnopqrstu
abcdefghijklmnopqrstu
In the code, set the text of the label using setText:
[self.myLabel setText:#"MyLabelText"];
This did it for me. Your situation may be a little different in that I wasn't changing the width of the superview and it sounds like you might be. But if the width constraint is set on the label then I would expect this to work in your case, too.
I had a similar question about label resizing, and the answer that I found that was useful to me is here: UILabel Auto Size Label to Fit Text. This is a good starting source for code on how to resize your label programmatically.
I would recommend that you also add a horizontal trailing auto layout constraint from the label to the edge of the superview. Do that and you can then get rid of your current width constraint.
AutoLayout facilitate you for orientation purpose. I don think it will give you automatic expansion. You have to define label with width and height completely, otherwise you will see dots at the end of label. So you may use UITextView expanding it all over the screen. And set textView.backgroundcolot = clearColor.

Resources