iOS label富文本解決行間距和不同字號(hào)文案上居中問題

最近的項(xiàng)目開發(fā)過程中,遇到了一個(gè)文案顯示問題,難點(diǎn)是:
1.文案只顯示兩行,但是第一行顯示的寬度不確定,而且部分文案不確定;
2.總共兩行的文案,要顯示3種不一樣字體和2種不一樣的顏色;
3.第1行兩種字號(hào)不一樣的文案還要居中對(duì)齊,居中對(duì)齊。如下圖所示:


文案樣式

針對(duì)這個(gè)問題,從代碼的簡(jiǎn)介性、易讀性以及UI效果上考慮,最好能用一個(gè)label實(shí)現(xiàn)。那么就要解決兩個(gè)問題:
1.顯示2行文案,以及能夠自由控制行間距;
2.第一行文案能夠正確顯示,而且不同字號(hào)的文案能夠居中對(duì)齊。
第一步,解決第一行文案寬度問題,雖然第一行有不確定的文案,但是第二行文案確定,我們可以直接截?。猾@取文案后,計(jì)算文案的寬度,設(shè)置label的寬度。

//通過字號(hào)和文案計(jì)算寬度
- (CGSize)completeTextWidthWithFont:(CGFloat)fontSize text:(NSString *)text
{
    NSDictionary *attrs = @{NSFontAttributeName: [UIFont boldSystemFontOfSize:fontSize]};
    CGSize size = [text sizeWithAttributes:attrs];
    return size;
}

第二步,可以調(diào)整行間距以及第一行上居中問題,代碼如下所示:

    - (void)setupSubview
{
    NSString *str = @"¥3000額度";
    self.label = [[UILabel alloc] init];
    self.label.numberOfLines = 2;
    //基準(zhǔn)線-用來對(duì)齊,可以調(diào)整為其他數(shù)
    CGFloat fontRatio = 0.26;
    //調(diào)整行間距方法2
   // [self.label setValue:@(25) forKey:@"lineSpacing"];
    NSMutableAttributedString *attrStr = [[NSMutableAttributedString alloc] initWithString:str];
    NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
    [paragraphStyle setLineSpacing:8];
    //調(diào)整行間距方法2
    [attrStr addAttribute:NSParagraphStyleAttributeName
                   value:paragraphStyle
                   range:NSMakeRange(0, str.length)];
    NSRange rang = [str rangeOfString:@"額度"];
    [attrStr addAttribute:NSForegroundColorAttributeName value:[UIColor redColor]
                    range:NSMakeRange(0, 1)];
    [attrStr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:12]
                    range:NSMakeRange(0, 1)];
    //24是文案3000的字號(hào) 12是¥的字號(hào) fontRatio-基準(zhǔn)線
    [attrStr addAttribute:NSBaselineOffsetAttributeName value:@(fontRatio * (24-12)) range:NSMakeRange(0, 1)];
    [attrStr addAttribute:NSForegroundColorAttributeName value:[UIColor redColor]
                    range:NSMakeRange(1, rang.location)];
    [attrStr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:24]
                    range:NSMakeRange(1, rang.location)];
    [attrStr addAttribute:NSForegroundColorAttributeName value:[UIColor blueColor]
                    range:rang];
    [attrStr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:18]
                    range:rang];
    self.label.attributedText = attrStr;
    //居中
    self.label.textAlignment = NSTextAlignmentCenter;
    //計(jì)算第一行文案的寬度
    CGSize size1 = [self completeTextWidthWithFont:12 text:@"¥"];
    CGSize size2 = [self completeTextWidthWithFont:24 text:[str substringWithRange:NSMakeRange(1, rang.location)]];
    self.label.frame = CGRectMake(100, 100, size1.width + size2.width,
                                  size1.height + size2.height + 20);
    [self.view addSubview:self.label];
}
最后編輯于
?著作權(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)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

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