Just My Life & My Work

[iOS] Label 文字分散對齊 (Label Text Decentralized Alignment)

2017 年 03 月 17 日

原本使用的元件UILabel只有置左、中、右三種選擇，然而有時候我們想要Label文字分散對齊，原本我想要找第三方套件，不過想起上個月研蘋果有在粉絲團上分享解法，於是就拿來嘗試，果真用內建的CATextLayer就能做到！

[iOS] Label 文字分散對齊 (Label Text Decentralized Alignment)

程式碼就是一些屬性設定，最後一行的「換行」和「空白」符號是關鍵！

/**
 Theme: Label Text Decentralized Alignment
 IDE: Xcode 8
 Language: Objective C
 Date: 106/03/08
 Author: HappyMan
 Blog: https://cg2010studio.wordpress.com/
 */
    CATextLayer *textLayer = [CATextLayer layer];
    textLayer.frame = memberCardNumberLabel.bounds;
    [memberCardNumberLabel.layer addSublayer:textLayer];
    // 讓 layer 屬性與 label 一致
    textLayer.foregroundColor = memberCardNumberLabel.textColor.CGColor;
    textLayer.backgroundColor = memberCardNumberLabel.backgroundColor.CGColor;
    textLayer.font = (__bridge CFTypeRef _Nullable)(memberCardNumberLabel.font);
    textLayer.fontSize = memberCardNumberLabel.font.pointSize;
    // 設定 layer 分散對齊
    textLayer.alignmentMode = kCAAlignmentJustified;
    // 設定文字戒溪度與螢幕解析度一致
    textLayer.contentsScale = [UIScreen mainScreen].scale;

    // 關鍵在於字串後的換行以及換行後的空白鍵
    textLayer.string = [cardNumber stringByAppendingString:@"\n "];

結果真的令人驚艷！

[iOS] Label 文字分散對齊 (Label Text Decentralized Alignment)2

參考：研蘋果粉絲團、iOS核心動畫高級技巧。

分類：

iOS, 教學

發表留言

Tagged with:

隨意留個言吧：）～

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料。

標籤雲