UILabel 垂直对齐

作者: RyanYuan | 来源:发表于2019-06-12 00:29 被阅读11次

    新建 UILabel 子类,重写部分 UILabel 方法

    RYVerticalAlignmentLabel.h

    
    typedef NS_ENUM(NSUInteger, RYTextVerticalAlignment) {
        RYTextVerticalAlignmentTop = 0, // 顶部对齐
        RYTextVerticalAlignmentMiddle,  // 垂直居中
        RYTextVerticalAlignmentBottom   // 底部对齐
    };
    
    IB_DESIGNABLE
    @interface RYVerticalAlignmentLabel : UILabel
    
    #if TARGET_INTERFACE_BUILDER
    @property (nonatomic, assign) IBInspectable NSUInteger textVerticalAlignment;
    #else
    @property (nonatomic, assign) RYTextVerticalAlignment textVerticalAlignment;
    #endif
    
    @end
    
    

    RYVerticalAlignmentLabel.m

    
    @implementation RYVerticalAlignmentLabel
    
    /**
     设置文本垂直对齐方式后调用 setNeedsDisplay ,系统会自动调用 drawTextInRect
    
     @param textVerticalAlignment 垂直对齐方式枚举类型
     */
    - (void)setVerticalAlignment:(RYTextVerticalAlignment)textVerticalAlignment {
        _textVerticalAlignment = textVerticalAlignment;
        [self setNeedsDisplay];
    }
    
    /**
     重写父类 textRectForBounds 方法,修改并返回 textRect
    
     @param bounds 文本 bounds
     @param numberOfLines 行数
     @return 修改后文本 bounds
     */
    - (CGRect)textRectForBounds:(CGRect)bounds limitedToNumberOfLines:(NSInteger)numberOfLines {
        CGRect textRect = [super textRectForBounds:bounds limitedToNumberOfLines:numberOfLines];
        switch (self.textVerticalAlignment) {
            case RYTextVerticalAlignmentTop:
                textRect.origin.y = bounds.origin.y;
                break;
            case RYTextVerticalAlignmentBottom:
                textRect.origin.y = bounds.origin.y + bounds.size.height - textRect.size.height;
                break;
            case RYTextVerticalAlignmentMiddle:
            default:
                textRect.origin.y = bounds.origin.y + (bounds.size.height - textRect.size.height) / 2.0;
        }
        return textRect;
    }
    
    /**
      重写父类 drawTextInRect 方法,调用本类 textRectForBounds 方法
    
     @param requestedRect 文本 bounds
     */
    -(void)drawTextInRect:(CGRect)requestedRect {
        CGRect actualRect = [self textRectForBounds:requestedRect limitedToNumberOfLines:self.numberOfLines];
        [super drawTextInRect:actualRect];
    }
    
    @end
    
    

    IBInspectable

    IBInspectable关键字,可以使自定义 UIView 的属性出现在 IB 中的 Attributes inspector

    如 RYVerticalAlignmentLabel.h 中为对应属性添加关键字

    #if TARGET_INTERFACE_BUILDER
    @property (nonatomic, assign) IBInspectable NSUInteger textVerticalAlignment;
    #else
    @property (nonatomic, assign) RYTextVerticalAlignment textVerticalAlignment;
    #endif
    

    在 xib / storyboard 中拖入 UIlabel 对象视图后,修改 Class

    效果

    IB_DESIGNABLE

    IB_DESIGNABLE关键字 可以让自定义 UIView 在 IB 中预览

    如 RYVerticalAlignmentLabel.h 中为类添加关键字

    IB_DESIGNABLE
    @interface RYVerticalAlignmentLabel : UILabel
    

    效果

    参考

    [爆栈热门 iOS 问题] 让 UILabel 顶端对齐

    IB_DESIGNABLE 和 IBInspectable 的用法

    相关文章

      网友评论

        本文标题:UILabel 垂直对齐

        本文链接:https://www.haomeiwen.com/subject/gzuhfctx.html