Mac·iOS开发ios开发记录

iOS-文字竖排

2020-07-04  本文已影响0人  芮淼一线

方案一:

思路:字符串直接单字换行
缺点:只能显示一列文字

#import <UIKit/UIKit.h>

NS_ASSUME_NONNULL_BEGIN

@interface UILabel (Extension)
@property (nonatomic) NSString *verticalText;

@end

NS_ASSUME_NONNULL_END

#import "UILabel+Extension.h"
#import "objc/Runtime.h"


@implementation UILabel (Extension)
- (NSString *)verticalText{
    // 利用runtime添加属性
    return objc_getAssociatedObject(self, @selector(verticalText));
}

- (void)setVerticalText:(NSString *)verticalText{
    objc_setAssociatedObject(self, &verticalText, verticalText, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
    NSMutableString *str = [[NSMutableString alloc] initWithString:verticalText];
    NSInteger count = str.length;
    for (int i = 1; i < count; i ++) {
        [str insertString:@"\n" atIndex:i*2-1];
    }
    self.text = str;
    self.numberOfLines = 0;
}
@end

方案二:

三方库:YYText

- (void)verticalText
{
    YYLabel *lab = [[YYLabel alloc] init];
    lab.frame = CGRectMake(100, 420, 200, 200);
    lab.backgroundColor = UIColor.grayColor;
    lab.textColor = UIColor.redColor;
    lab.numberOfLines = 0;
    lab.verticalForm = YES;
    lab.textVerticalAlignment = YYTextVerticalAlignmentTop;
//    lab.textContainerPath = [UIBezierPath bezierPathWithRect:CGRectMake(0, 0, 200, 200)];
    lab.exclusionPaths    = @[[UIBezierPath bezierPathWithRect:CGRectMake(0, 0, 0, 0)]];
//    lab.textContainerInset = UIEdgeInsetsMake(20, 40, 40, 140);
    lab.text = @"1.第一列文字\n 2.第二列文字";
    [self.view addSubview:lab];
}

三方库:CoreTextView
这个功能没有YYText强大,不过这个框架是专门为了实现文字的竖向排列的

- (void)verticalCoreTextView
{
    CoreTextView *lab = [[CoreTextView alloc] init];
    lab.frame = CGRectMake(100, 420, 200, 200);
    lab.backgroundColor = UIColor.grayColor;
    lab.textColor = UIColor.redColor;
    lab.font = [UIFont systemFontOfSize:18];
    lab.numberOfLines = 0;
    lab.lineSpace = 2;
    lab.wordSpace = 2;
    lab.baseLine = CoreTextBaseLineRight|CoreTextBaseLineTop;
    lab.text = @"1.第一列文字\n 2.第二列文字";
    [self.view addSubview:lab];
}
上一篇下一篇

猜你喜欢

热点阅读