iOS開發封裝一個能夠響應超連接的label——基於RCLabel的交互擴展

iOS開發封裝一個能夠響應超連接的label——基於RCLabel的交互擴展

1、引言

        iOS系統是一個十分注重用戶體驗的系統，在iOS系統中，用戶交互的方案也十分多，然而要在label中的某部分字體中添加交互行爲確實不容易的，若是使用其餘相似Button的控件來模擬，文字的排版又將是一個解決十分困難的問題。這個問題的由來是項目中的一個界面中有一些廣告位標籤，而這些廣告位的標籤倒是嵌在文本中的，當用戶點擊文字標籤的位置時，會跳轉到響應的廣告頁。

        CoreText框架和一些第三方庫能夠解決這個問題，但直接使用CoreText十分複雜，第三方庫多注重於富文本的排版，對相似文字超連接的支持亦不是特別簡潔，咱們能夠藉助一些第三方的東西進行鍼對性更強，更易用的封裝。

        RCLabel是一個第三方的將html字符串進行文本佈局的工具，代碼十分輕巧，而且其是基於CoreText框架的，其原生性和擴展性十分強。在之前的一篇博客中，我將RCLabel進行了一些改進，使其支持異步加載遠程圖片，而且提供了更加簡潔的面向應用的方法，博客地址以下：

擴展於RCLabel的支持異步加載網絡圖片的富文本引擎的設計:http://my.oschina.net/u/2340880/blog/499311 。

        本篇博文，將在其基礎上，完成設計一個能夠支持文本超連接的文字視圖。

2、視圖類與模型類的設計

        RCLabel的核心之處在於將HTML文本轉換爲富文本佈局視圖，所以咱們能夠將要顯示的文本編程html字符串，將其能夠進行用戶交互的部分進行html超連接關聯，RCLabel就檢測到咱們點擊的區域進行響應邏輯的回調。設計類以下：

.h文件

//文本與超連接地址關聯的model類 後面會說
@class YHBaseLinkingLabelModel;

@protocol YHBaseLinkingLabelProtocol <NSObject>

@optional
/**
 *點擊超連接後出發的代理方法 model中有連接地址和文字
 */
-(void)YHBaseLinkingLabelClickLinking:(YHBaseLinkingLabelModel *)model;
/**
 *尺寸改變後出發的方法
 */
-(void)YHBaseLinkingLabelSizeChange:(CGSize)size;
@end

@interface YHBaseLinkingLabel : YHBaseView
/**
 *文字數組 裏面存放這文字對應的超連接對象
 */
@property(nonatomic,strong)NSArray<YHBaseLinkingLabelModel *> * textArray;
@property(nonatomic,weak)id<YHBaseLinkingLabelProtocol>delegate;
/**
 *設置文字顏色
 */
@property(nonatomic,strong)UIColor * textColor;
/**
 *設置超連接文字顏色
 */
@property(nonatomic,strong)UIColor * linkColor;
/**
 *設置字體大小
 */
@property(nonatomic,assign)NSUInteger fontSize;
/**
 *設置超連接字體大小
 */
@property(nonatomic,assign)int linkingFontSize;
/**
 *設置是否顯示下劃線
 */
@property(nonatomic,assign)BOOL isShowUnderLine;
@end

 

.m文件

@interface YHBaseLinkingLabel()<YHBaseHtmlViewProcotop>
@end

@implementation YHBaseLinkingLabel
{
    //之前博客中 封裝的顯示HTML字符串富文本的視圖
    YHBaseHtmlView * _label;
}
/*
// 重載一些初始化方法
- (instancetype)init
{
    self = [super init];
    if (self) {
        _label = [[YHBaseHtmlView alloc]init];
        [self addSubview:_label];
        [_label mas_makeConstraints:^(MASConstraintMaker *make) {
            make.leading.equalTo(@0);
            make.trailing.equalTo(@0);
            make.top.equalTo(@0);
            make.bottom.equalTo(@0);
        }];
         _label.delegate=self;
    }
    return self;
}
- (instancetype)initWithCoder:(NSCoder *)coder
{
    self = [super initWithCoder:coder];
    if (self) {
        _label = [[YHBaseHtmlView alloc]init];
        [self addSubview:_label];
        [_label mas_makeConstraints:^(MASConstraintMaker *make) {
            make.leading.equalTo(@0);
            make.trailing.equalTo(@0);
            make.top.equalTo(@0);
            make.bottom.equalTo(@0);
        }];
         _label.delegate=self;
    }
    return self;
}
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        _label = [[YHBaseHtmlView alloc]init];
        [self addSubview:_label];
        [_label mas_makeConstraints:^(MASConstraintMaker *make) {
            make.leading.equalTo(@0);
            make.trailing.equalTo(@0);
            make.top.equalTo(@0);
            make.bottom.equalTo(@0);
        }];
        _label.delegate=self;
    }
    return self;
}
//設置文本數組
-(void)setTextArray:(NSArray<YHBaseLinkingLabelModel *> *)textArray{
    _textArray = textArray;
    //進行html轉換
    NSString * htmlString = [self transLinkingDataToHtmlStr:textArray];
    //進行佈局
    [_label reSetHtmlStr:htmlString];
    
}
-(void)setTextColor:(UIColor *)textColor{
    _textColor = textColor;
    _label.fontColor = textColor;
}
-(void)setLinkColor:(UIColor *)linkColor{
    _linkColor = linkColor;
    _label.linkingColor = linkColor;
}
-(void)setFontSize:(NSUInteger)fontSize{
    _fontSize = fontSize;
    [_label setFontSize:(int)fontSize];
}
-(void)setLinkingFontSize:(int)linkingFontSize{
    _linkingFontSize = linkingFontSize;
    [_label setLinkingSize:linkingFontSize];
}
-(void)setIsShowUnderLine:(BOOL)isShowUnderLine{
    _isShowUnderLine = isShowUnderLine;
    [_label setShowUnderLine:isShowUnderLine];
}
-(NSString *)transLinkingDataToHtmlStr:(NSArray<YHBaseLinkingLabelModel *> *)data{
    NSMutableString * mutStr = [[NSMutableString alloc]init];
    for (int i=0; i<data.count; i++) {
    //這個model中存放的是超連接部分的文字和對應的url
        YHBaseLinkingLabelModel * model = data[i];
        if (!model.linking) {
            [mutStr appendString:model.text];
        }else {
            [mutStr appendString:@"<a href="];
            [mutStr appendString:model.linking];
            [mutStr appendString:@">"];
            [mutStr appendString:model.text];
            [mutStr appendString:@"</a>"];
        }
    }
    return mutStr;
}

#pragma mark delegate
//點擊的回調
-(void)YHBaseHtmlView:(YHBaseHtmlView *)htmlView ClickLink:(NSString *)url{
    for (YHBaseLinkingLabelModel * model in _textArray) {
        if ([model.linking isEqualToString:url]) {
            if ([self.delegate respondsToSelector:@selector(YHBaseLinkingLabelClickLinking:)]) {
                [self.delegate YHBaseLinkingLabelClickLinking:model];
                return;
            }
        }
    }
}
//佈局尺寸改變的回調
-(void)YHBaseHtmlView:(YHBaseHtmlView *)htmlView SizeChanged:(CGSize)size{
    if ([self.delegate respondsToSelector:@selector(YHBaseLinkingLabelSizeChange:)]) {
        [self.delegate YHBaseLinkingLabelSizeChange:size];
    }
}
@end

 

上面咱們有用到一個YHBaseLinkingLabelModel類，這個類進行了連接與字符的映射，設計以下：

@interface YHBaseLinkingLabelModel : YHBaseModel
/**
 *文字內容
 */
@property(nonatomic,strong)NSString * text;
/**
 *超連接地址 nil則爲無
 */
@property(nonatomic,strong)NSString * linking;

@end

 

        YHBaseHtmlView類是對RCLabel的一層封裝，其中也對RCLabel進行了一些優化和改動，代碼較多且在上篇博客中有介紹，這裏再也不多作解釋了。

        在ViewController中寫以下代碼進行使用：

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
   YHBaseLinkingLabel * label = [[YHBaseLinkingLabel alloc]initWithFrame:CGRectMake(100, 100, 200, 100)];
    NSMutableArray * array = [[NSMutableArray alloc]init];
    for (int i=0; i<6; i++) {
        YHBaseLinkingLabelModel * model = [[YHBaseLinkingLabelModel alloc]init];
        if (!(i%2)) {
            model.text =[NSString stringWithFormat:@"第%d個標籤",i];
            model.linking = [NSString stringWithFormat:@"第%d個標籤",i];
        }else{
            model.text = @",不能點得文字,";
        }
        [array addObject:model];
    }
    label.textColor = [UIColor blackColor];
    label.linkColor = [UIColor purpleColor];
    label.fontSize = 15;
    label.linkingFontSize = 17;
    label.isShowUnderLine=YES;
    label.delegate=self;
    label.textArray = array;
    [self.view addSubview:label];
   
}
-(void)YHBaseLinkingLabelClickLinking:(YHBaseLinkingLabelModel *)model{
    NSLog(@"%@",model.linking);
}

 

運行效果以下：

效果不錯，而且十分簡單易用，對吧。

        我將這部分的相關代碼集成進了之前寫的一個項目開發框架中，git地址是：https://github.com/ZYHshao/YHBaseFoundationTest 。整體看來，這個框架並非乾貨，只是我開發中的一些積累，若是能夠幫到你，擇優而用，若是須要和我交流，QQ316045346，對視歡迎。

 

專一技術，熱愛生活，交流技術，也作朋友。

——琿少 QQ羣：203317592