[IOS] align the bottom of the text with different font sizes, and the ios font size.

[IOS] align the bottom of the text with different font sizes, and the ios font size.

I switched from WP to IOS, but I still cannot put it ......

 

In a project, you must align the bottom of multiple texts of different sizes as follows:

(Desired effect)

We thought we could use three UIFont different UILabel to align them at the bottom, but the effect is as follows:

(Unwanted results)

The bottom is not aligned at all. Why is "1314" so much higher than the two sides !!!! Obsessive-compulsive disorder cannot be tolerated !!!

--------------------------------------------------------------------------------

Comparison:

1. Controls are relatively laid out in Windows Phone

In Windows Phone, you need to set a fixed width and height for TextBlock (at least I did this)

TextBlock not only can set the text to horizontal center, left, or right, but also can use the attribute

Text. VerticalContentAlignment = Top/Center/Bottom place the text at the Top/Center/Bottom.

2. Controls are absolute layout in IOS: for a control, you need to set its frame (including the starting position, height, and width)

You can use the following method to directly obtain the adaptive height and width of a string: (this is better than WindowsPhone)

CGSize labelSize = [@ "1314" sizeWithAttributes: @ {NSFontAttributeName: kLabelFont}];

The native UIlabel can only set the horizontal offset attribute of the textAlignment text, but cannot directly change the vertical offset.

 

To achieve the above effect in WindowsPhone, you only need to set the three textblocks to the bottom and the TextBlock content to align.

(I am suddenly unsure about this. It seems that many times I directly set the margin to manually align it. If I have time, go back to WindowsPhone and try again .)

 

Detours:

So when IOS handles this problem, I thought that since the bottom of the three controls are aligned, but the height is different, can it be like WindowsPhone,

Vertical offset of the content ("1314") with a higher UILabel to the bottom?

After checking UILabel, we found these:

It cannot be called directly. It can only be rewritten through inheritance.

// Override points. can adjust rect before calling super. (You can adjust the text content location before calling the parent class TextRect)

// Label has default content mode of UIViewContentModeRedraw

-(CGRect) textRectForBounds :( CGRect) bounds limitedToNumberOfLines :( NSInteger) numberOfLines; // rewrite to repaint the text area

-(Void) drawTextInRect :( CGRect) rect; // you can call super to repaint text by default when rewriting.

To change the position of text, we only need to change the returned value rect of textRectForBounds, and redraw the text based on this rect.

1. For contentMode, this mode provides multiple modes for the view to apply the frame rectangle. If none of the modes except UIVewContentModeRedraw (such as UIViewContentModeScaleToFill) meet the requirements, or you need to customize the view, you can set this value. SetNeedsDispllay or setNeedsDisplayInRect: will be automatically called by default when the view adapts to the frame rectangle change, so as to redraw the view.
2. When the setNeedsDisplay (or setNeedsDisplayInRect :) message is sent to the view, the drawRect is forcibly called regardless of the contentMode mode:

Main Code: (this code can be found on the Internet)

-(CGRect) regression :( CGRect) bounds limitedToNumberOfLines :( NSInteger) the parameter bounds in numberOfLines {// indicates the UILabel bounds CGRect rc = [super limit: bounds limit: numberOfLines]; // The bounds switch (_ verticalignment) of text {case verticalignmenttop: rc. origin. y = bounds. origin. y; break; case verticalignmentbottom: rc. origin. y = bounds. origin. y + bounds. size. height-rc. size. height; break; case verticalignmentmiddle: default: rc. origin. y = bounds. origin. y + (bounds. size. height-rc. size. height)/2; break;} return rc;}-(void) drawTextInRect :( CGRect) rect {CGRect rc = [self textRectForBounds: rect limitedToNumberOfLines: self. numberOfLines]; [super drawTextInRect: rc];}

However, it is found that the verticalignment attribute is not much different for the Label of the adaptive width and height (CGSize ).

Origin. x origin. y is zero and there are almost no differences in SIZE.

Here I made a comparison: For the string @ "1314", set different UIFont to observe the size difference between UILabel and the internal textRect

UIFont 1 50 100

Rc (text) 1.000000, 2.333333 105.666667, 61.000000 208.666667, 120.666667

Bounds (label)1.000000, 2.193359105.541992, 60.667969208.349609, 120.335938

Difference 0, 0.139974 0.124675, 0.332031 0.317058, 0.330729

Rc is a little bigger than bounds,I think the text size is smaller than its border to prevent text being intercepted,

In addition, for UIFont or Font types of different sizes, the degree of small size is still different.

So even if you set the verticalignment attribute, there is no difference.

If you only set the text size to a greater value, causing the rc to be larger than the bounds, the text part may be truncated;

If only the UILabel size is increased, and the rc is smaller than the bounds, the redundant blank areas except the text are displayed;

For the latter two, set the verticalignment attribute to clearly see the up and down offsets.

Therefore, this solution is ineffective for implementation.

 

Endpoint:

Find another method. You can use the attributedText attribute to display rich text in UILabel.

Implement a string containing different colors, font sizes, and so on.

I encapsulated a method:

// Get text content with different styles // stringArray String Array // attributeAttay style array-(NSAttributedString *) attributedText :( NSArray *) stringArray attributeAttay :( NSArray *) attributeAttay {// define the text content NSString * string = [stringArray componentsJoinedByString: @ ""]; // concatenate the input string array // create an Attribute-style string object NSMutableAttributedString * result = [[NSMutableAttributedString alloc] initWithString: string] through the text content to be displayed; for (NSInteger I = 0; I <stringArray. count; I ++ ){
// Set the style of the string within a certain range [result setAttributes: attributeAttay [I] range: [string rangeOfString: stringArray [I];} // return the set text with a style. return [[NSAttributedString alloc] initWithAttributedString: result];}

And Its Usage

NSDictionary * attributesExtra ={ character: kLabelFont, // font size 12 character: [UIColor orangeColor]}; NSDictionary * attributesPrice =@{ NSFontAttributeName: [UIColor orangeColor]}; NSAttributedString * attributedString = [self attributedText: @ [@ "￥", @ "1314", @ ""] attributeAttay: @ [attributesExtra, attributesPrice, attributesExtra]; UILabel * price = [[UILabel alloc] init];
Price. attributedText = attributedString; CGRect rect = [attributedString boundingRectWithSize: CGSizeMake (self. width/2,100) options: NSStringDrawingUsesLineFragme ntOrigin context: nil]; // This methodAdaptive Rect instead of CGSize is obtained.The maximum Size is CGSizeMake (self. width/2,100)
Price. frame = CGRectMake (0, 0, rect. size. width, rect. size. height );