Place Text in Top part of UIlabel - ios

I have a UILabel that covers most of the view. When I place text in the label, the text is center in the middle of the label. I have tried everything by playing around with the options in the attributes inspector, however the text wont start in the top area of the label, instead it appears in the middle of the label.
Is there any way to places the text in the top part of the label??
(If someones is wondering, yes I want the UILabel to cover most of the view because some texts are longer then others, and some are shorter, and I would prefer the text to be placed on the top part and not the middle of the UIlLabel.)

UILabel has an intrinsicContentSize matching the text contents. If you don't constrain the height, then it will automatically adjust. So you don't need to make it cover the entire view.
Instead, tag it onto the top with a fixed distance. Specify the bottom distance with greater-than-or-equal. This way the label can grow until it reaches the lower limit and then the text will begin to be truncated.

Related

Swift Storyboard - Centring an Icon and multi-line text horizontally

I am trying to create an Android-esque Snackbar. All the behaviour is correct but I am left with a layout issue. I have actually broken this out into a test app to simplify things a bit.
The bar is pinned to the bottom of the view and contains an Icon (UIImageView) along with some text (UILabel). This text can be up to 2 lines max.
For example, it should be able to exand out like this:-
However to further complicate things, i need it so that the icon and text are centred within the red bar and then spread out from the centre until such point that it needs to wrap. Note that there is a padding to the start of the icon and end of the text to prevent it touching the sides. An example of centred content would be..
I haven't been able to get the correct layout. I think the issue has been trying to centre the two items whilst simultaneously conforming to a width that doesn't exceed the edge bounds, causing a constraint conflict. I have also tried embedding the icon and label in a horizontal stack view but couldn't seem to find the correct fill option whilst centring everything.
I have even tried using NSAttributed string and adding the image to the text itself but when the text wrapped, the icon was being resized and/or misplaced.
As you can see, i have been doing this in Storyboard but i am more than happy to do this programmatically if it serves this purpose better.
Created this Demo for reference , it's a simple task of making a nested view inside the red view with a centerX constraint of priority 1000 and a leading constraint with 999 priority
Now you have this effect

UIButton with two titles one on left another on right

I have a situation where a button title has two parts with different strings, and need to display one on the right and one on the left. Text will change dynamically every time based on response. I have to place this button in a tableview cell. Attaching an image below for reference.
The requirement is as follows:
.
But I managed to do the following:
I am unable to place text on two different sides of a button.
The easiest solution for you may be to place a UILabel on the left and anchor it to the left with a constraint, then place a UILabel on the right, and anchor it to the right with a constraint. - this is mentioned in the comments by #Alejandro Iván.
I would then choose a set value for the right label width and set that label. Add a constraint from the left label to the right label, so it will dynamically fill as much space as is available.
Last I would place a clear, no text button with the border on top, wrapping both labels. You can then confidently change the left label content and know that it will be encompassed in the button border.
Image attached to help you see what I'm saying although I've left the "button" text and added coloration to demonstrate.

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.

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.

Truncate UILabel before it runs into another UILabel dynamically

Basically, I have this situation:
Two UILabels in a UITableViewCell. They're both constrained to the top of the cell. One is constrained to the left of the cell, and one is constrained to the right of the cell.
There exists a change that the UILabel on the left can run into the UILabel on the right. Is there anyway to truncate the text x points before it gets to the UILabel on the right?
Right now, I handle this by giving the UILabel on the left an explicit width that ensures it will truncate before reaching the UILabel, but the explicit width is not dynamic based on screen size. If there is a larger screen size, it might not need to be truncated. I'm new to iOS development and am not sure how to do this.
The best way to achieve this is in auto-layout. Make sure the label on the right is a fixed size, you can even change it programatically if you need to accommodate to screen size. But the thing is this one needs a width constraint. The label on the left does not have a width constraint, instead do a horizontal spacing in front of it to the cell border and from it's trailing end to the start of the label view on the right. It will widen and shrink to fit the size that's left for it.

Resources