iOS NSAttributedString 圖文混排 UILabel 可折疊 展開(kāi)

RZColorful

NSAttributedString 富文本方法 (圖文混排、多樣式文本)
UILabel 可折疊 展開(kāi) 可點(diǎn)擊文本

Installation

pod 'RZColorful'

Author

rztime, rztime@vip.qq.com

swift版本RZColorfulSwift

UITextView實(shí)現(xiàn)的富文本編輯器RZRichTextView

  • NSAttributedString 的多樣化設(shè)置(文字字體、顏色、陰影、段落樣式、url、下劃線，以及圖文混排等等)
  • 添加UITextField、UITextView、UILabel的attributedText的富文本設(shè)置。
  • 擴(kuò)展：添加一個(gè)刷新界面時(shí)保持文本框焦點(diǎn)的方法 demo查看
  • 富文本方法內(nèi)容可單獨(dú)抽出來(lái),在下邊這個(gè)文件夾中
#import "NSAttributedString+RZColorful.h"

關(guān)于RZColorful

  • 支持UILabel、UITextView、UITextField的attributedText的設(shè)置。
  • 支持獲取NSAttributedString中的圖片
  • 支持 HTML 與 NSAttributedString互換（支持圖片）
  • 包含的屬性快捷設(shè)置：
    • 段落樣式
    • 陰影
    • 文本字體、顏色
    • 文本所在區(qū)域?qū)?yīng)的背景顏色
    • 連體字
    • 字間距
    • 刪除線、下劃線，及其線條顏色
    • 描邊，及其顏色
    • 斜體字
    • 拉伸
    • 上下標(biāo)
    • 書(shū)寫(xiě)方向（從左到右，從右到左）
    • 通過(guò)html源碼加載富文本
    • 通過(guò)url添加圖片到富文本

How to use

  • 請(qǐng)?jiān)谛枰褂玫牡胤郊由?/li> 
#import "RZColorful.h"
  • 主要的功能：

    • RZColorfulConferrer

      • text -- 添加文本
      • htmlText -- 添加html源碼
      • image -- 添加圖片
      • imageByUrl -- 添加圖片（通過(guò)圖片的URL添加）
      • paragraphStyle -- 全局的段落樣式
      • shadow -- 全局的陰影樣式

    • RZColorfulAttribute -- 設(shè)置文本的所有的屬性

    • RZImageAttachment -- 設(shè)置圖片的所有的屬性

講解

  • RZColorfulConferrer 中 paragraphStyle 和 shadow 屬于全局的設(shè)置，在block中任何位置都可設(shè)置
  • 文字和圖片都可設(shè)置paragraphStyle 和 shadow，對(duì)齊方式是paragraphStyle 的alignment，設(shè)置后，當(dāng)前行文字圖片的全局樣式將被此覆蓋，即全局樣式無(wú)效，不影響其他行。

基本的簡(jiǎn)單使用方法

    [cell.textLabel rz_colorfulConfer:^(RZColorfulConferrer * _Nonnull confer) {
        confer.paragraphStyle.paragraphSpacing(15); // 設(shè)置段落之間的行距

        confer.text(@"日常用處:(圖片+標(biāo)題+描述)\n").font(rzFont(17)).textColor([UIColor redColor]);

        confer.appendImage([UIImage imageNamed:@"test.jpg"]).bounds(CGRectMake(0, -2, 15, 15)); // 圖片
        confer.text(@" 姓        名: ").font(rzFont(15)).textColor(RGBA(151, 151, 151, 11));
        confer.text(@"rztime").font(rzFont(15)).textColor(RGBA(51, 51, 51, 1));

        confer.text(@"\n");
        confer.appendImage([UIImage imageNamed:@"test.jpg"]).bounds(CGRectMake(0, -2, 15, 15));
        confer.text(@" 時(shí)        間: ").font(rzFont(15)).textColor(RGBA(151, 151, 151, 11));
        confer.text([NSString stringWithFormat:@"%@", [NSDate new]]).font(rzFont(15)).textColor(RGBA(51, 51, 51, 1));

        confer.text(@"\n");
        confer.appendImage([UIImage imageNamed:@"test.jpg"]).bounds(CGRectMake(0, -2, 15, 15));
        confer.text(@" 當(dāng)次消費(fèi): ").font(rzFont(15)).textColor(RGBA(151, 151, 151, 11));
        confer.text(@"￥").font(rzFont(15)).textColor(RGBA(51, 51, 51, 1));
        confer.text(@"100").font(rzFont(15)).textColor(RGBA(251, 51, 51, 1));
        confer.text(@"元").font(rzFont(15)).textColor(RGBA(51, 51, 51, 1));
    }];

段落樣式、陰影（局部與全局統(tǒng)一的區(qū)別）

如果設(shè)置有局部樣式，則全局樣式無(wú)效

    [cell.textLabel rz_colorfulConfer:^(RZColorfulConferrer * _Nonnull confer) {
        confer.paragraphStyle.lineSpacing(5).paragraphSpacingBefore(5).alignment(NSTextAlignmentCenter); // 段落全局樣式
        confer.shadow.color(RGBA(255, 0, 0, 0.3)).offset(CGSizeMake(1, 1));   // 陰影全局
        
        // 此部分顯示全局樣式的風(fēng)格 （紅色陰影，居中對(duì)齊，段落行距等）
        confer.appendImage([UIImage imageNamed:@"test.jpg"]).bounds(CGRectMake(0, -2, 15, 15));
        confer.text(@" 姓名: ").font(rzFont(15)).textColor(RGBA(151, 151, 151, 11));
        confer.text(@"rztime").font(rzFont(15)).textColor(RGBA(51, 51, 51, 1));
        
        confer.text(@"\n");
        confer.appendImage([UIImage imageNamed:@"test.jpg"]).bounds(CGRectMake(0, -2, 15, 15));
        confer.text(@" 時(shí)間: ").font(rzFont(15)).textColor(RGBA(151, 151, 151, 11));
        confer.text([NSString stringWithFormat:@"%@", [NSDate new]]).font(rzFont(15)).textColor(RGBA(51, 51, 51, 1));
        
        // 此部分顯示全局樣式的風(fēng)格 （居中對(duì)齊，段落行距等）  陰影將被局部覆蓋（灰色）
        confer.text(@"\n地址: ").font(rzFont(15)).textColor(RGBA(151, 151, 151, 11)).paragraphStyle.paragraphSpacingBefore(20).and.shadow.color(GRAY(151)).offset(CGSizeMake(3, 3));;
        confer.text(@"成都-軟件園").font(rzFont(15)).textColor(RGBA(51, 51, 51, 1)).shadow.color(GRAY(151)).offset(CGSizeMake(3, 3));
        
        // 此部分段落樣式被局部覆蓋  陰影顯示全局的
        confer.text(@"\n愛(ài)好: ").font(rzFont(15)).textColor(RGBA(151, 151, 151, 11)).paragraphStyle.paragraphSpacingBefore(20);
        confer.text(@"游山、").font(rzFont(15)).textColor(RGBA(151, 51, 51, 1));
        confer.text(@"玩水、").font(rzFont(10)).textColor(RGBA(51, 151, 51, 1));
        confer.text(@"聽(tīng)歌、").font(rzFont(18)).textColor(RGBA(51, 51, 151, 1));
        confer.text(@"美食、").font(rzFont(17)).textColor(RGBA(51, 151, 51, 1));
        confer.text(@"看電影、").font(rzFont(16)).textColor(RGBA(151, 51, 51, 1));
        confer.text(@"擼代碼、").font(rzFont(15)).textColor(RGBA(51, 151, 51, 1));
        confer.text(@"等等\n\n").font(rzFont(15)).textColor(RGBA(251, 51, 51, 1));
    }];

通過(guò)url加載圖片

    [cell.textLabel rz_colorfulConfer:^(RZColorfulConferrer * _Nonnull confer) {
        confer.appendImageByUrl(@"http://pic28.photophoto.cn/20130830/0005018667531249_b.jpg").bounds(CGRectMake(0, 0, 200, 0)).paragraphStyle.alignment(NSTextAlignmentLeft); // 寬或高為0時(shí)，即自動(dòng)寬/高按照?qǐng)D片比例來(lái)
    }];

通過(guò)html源碼加載文本

    NSString *resourcePath = [[NSBundle mainBundle] resourcePath];
    NSString *filePath =[resourcePath stringByAppendingPathComponent:@"test.html"];
    NSString *htmlstring=[[NSString alloc] initWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil];
[cell.textLabel rz_colorfulConfer:^(RZColorfulConferrer * _Nonnull confer) {
    confer.htmlText(htmlstring);
}];

給UILabel添加富文本可點(diǎn)擊功能 給文本添加tapActionByLable屬性

[_label rz_colorfulConfer:^(RZColorfulConferrer * _Nonnull confer) {
    confer.text(@"可點(diǎn)擊的：").font([UIFont systemFontOfSize:17]).textColor(UIColor.blackColor);
    confer.text(@"文本").font([UIFont systemFontOfSize:17]).textColor(UIColor.redColor).tapActionByLable(@"1");
}];
[_label rz_tapAction:^(UILabel * _Nonnull label, NSString * _Nonnull tapActionId, NSRange range) {
    NSLog(@"%@", tapActionId); // print: 1
}];

給UILabel添加超行之后的折疊、展開(kāi)功能

UILabel

/// 設(shè)置富文本（超過(guò)行數(shù)后，自動(dòng)追加“展開(kāi)” “收起”）
/// @param attr 原文
/// @param line 最大顯示行數(shù)
/// @param width 最大顯示寬度，這個(gè)寬度用于計(jì)算文本行
/// @param fold 當(dāng)前是否折疊
/// @param allText 超過(guò)了行數(shù)之后，折疊狀態(tài)顯示的文本 如”展開(kāi)“  需要給文本設(shè)置NSTapActionByLabel屬性  (tapActionByLable)
/// @param foldText 超過(guò)行數(shù)之后，全部展開(kāi)狀態(tài)顯示的文本  如”收起“  需要給文本設(shè)置NSTapActionByLabel屬性 (tapActionByLable)
- (void)rz_setAttributedString:(NSAttributedString * _Nullable)attr maxLine:(NSInteger)line maxWidth:(CGFloat)width isFold:(BOOL)fold showAllText:(NSAttributedString *_Nullable)allText showFoldText:(NSAttributedString *_Nullable)foldText;

備注：

  • 多種屬性使用名請(qǐng)參考對(duì)應(yīng)的文件。
  • UILabel、UITextFile是同樣的使用方法。
  • 在UILabel、UITextFiled上url點(diǎn)擊方法無(wú)效。
  • 在UITextView中若要設(shè)置文本和圖片的點(diǎn)擊事件（即對(duì)文本和圖片設(shè)置附帶URL的屬性），請(qǐng)先設(shè)置其editable = NO, 并實(shí)現(xiàn)代理。
    • 設(shè)置了URL屬性的文本，內(nèi)部自帶藍(lán)色和下劃線，若要去掉，可設(shè)置 textView.linkTextAttributes = @{}; 
// 實(shí)現(xiàn)下列方法 （二選一、或都可以實(shí)現(xiàn)，當(dāng)都返回YES時(shí)，可能會(huì)打開(kāi)safari瀏覽器）
textView.rzDidTapTextView = ^BOOL(id  _Nullable tapObj) {
    NSString *url = tapObj;
    if ([tapObj isKindOfClass:[NSURL class]]) {
        url = [(NSURL *)tapObj absoluteString];
    }
    url = url.rz_decodedString;
            
    NSLog(@"rzDidTapTextView：tapObj:%@  \n如果url中包含了有中文,URL將會(huì)進(jìn)行編碼，所以請(qǐng)rz_decodedString解碼之后查看:%@", tapObj, url);
    return NO;
};

- (BOOL)textView:(UITextView *)textView shouldInteractWithURL:(NSURL *)URL inRange:(NSRange)characterRange interaction:(UITextItemInteraction)interaction {
    NSLog(@"URL:%@", URL);
    // return NO;則不跳轉(zhuǎn)，這里可以做一些基本判斷在執(zhí)行是否跳轉(zhuǎn)瀏覽器打開(kāi)url
    return YES; 
}

注意

  • 盡管我已經(jīng)在代碼中已經(jīng)處理過(guò)（弱）引用問(wèn)題，但是在實(shí)際運(yùn)用寫(xiě)入text時(shí)，還是請(qǐng)盡量檢查避免循環(huán)引用

最后

  • 在使用過(guò)程中，如果您發(fā)現(xiàn)有什么問(wèn)題，歡迎向我反饋，謝謝
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容