職人が教える!iOSアプリ開発で使いこなしたいとっておきのOSS

第4回 UILabelでのテキスト表示をリッチにする機能拡張サブクラス3種

この記事を読むのに必要な時間:およそ 4 分

UILabelは,iOSアプリ開発において使用頻度の高いクラスですが,カユいところに手が届かなかったりします。たとえばテキストの一部だけ強調表示するといった使い方はできませんし,動的に更新されるテキストを上寄せにしようと思ったら,そのテキストがちょうど納まるUILabelのサイズを算出するメソッドをコールしてサイズを指定する必要があります。

今回はそんなUILabelの機能を拡張してくれるサブクラス3種を紹介します。

OHAttributedLabel

特徴

NSAttributedStringをラップしてUILabelに持たせたもので,テキストの一部だけフォントや色を変えたりといった指定が簡単にできるようになります。

またリンクの付与,テキスト上寄せといったことも簡単にできます。

OHAttributedLabelの使用例

OHAttributedLabelの使用例

使用準備

  1. ソースコードを以下のURLよりダウンロード

  2. CoreText.frameworkをプロジェクトに追加

  3. OHAttributedLabel.hとNSAttributedString+Attributes.hをインポート

    #import "OHAttributedLabel.h"
    #import "NSAttributedString+Attributes.h"
    

テキストの一部を赤字にする

  1. NSMutableAttributedStringのインスタンスを生成します。引数には表示する文字列を渡します。

    NSString *txt = @"『モンスターを集めてまいれ』というアプリをリリースしました。無料ですのでぜひお試しください!";
    NSMutableAttributedString *attrStr = [NSMutableAttributedString attributedStringWithString:txt];
    
  2. setTextColor:range:メソッドで,変更するフォントカラーと,変更する範囲を指定します。

    NSRange range = [txt rangeOfString:@"無料"];
    UIColor *color = [UIColor colorWithRed:0.5f green:0.f blue:0.f alpha:1.f];
    [attrStr setTextColor:color range:range];
    
  3. OHAttributedLabelオブジェクトのattributedTextプロパティにNSMutableAttributedStringオブジェクトをセットして適用完了です。

    self.ohLabel.attributedText = attrStr;
    

    ちなみに,setTextColor:range:の代わりにrange引数のないsetTextColor:メソッドを用いると,文字列全体に適用されます。

    [attrStr setFont:[UIFont fontWithName:@"Helvetica" size:18]];
    [attrStr setTextColor:[UIColor grayColor]];
    

    また,太字指定はsetTextBold:range:メソッドでYESをセットするだけです。

    [attrStr setTextBold:YES range:range];
    

その他の使い方

リンクを貼る場合は,addCustomLink:inRange:メソッドにURLと範囲を指定します。

NSRange linkRange = [txt rangeOfString:@"モンスターを集めてまいれ"];
NSURL *linkUrl = [NSURL URLWithString:@"http://itunes.apple.com/jp/app/id491657299?mt=8"]; 
[self.ohLabel addCustomLink:linkUrl inRange:linkRange];

OHAttributedLabelのソースコードに付属しているサンプルプロジェクトには,デリゲートメソッドを実装してアラートを出したり,タップ済みのリンクの文字色を変えたりといったサンプルも入っています。

centerVerticallyプロパティにYESをセットすると中央揃え,NOで上寄せになります。

self.ohLabel.centerVertically = YES;

UILabelのtextAlignmentに指定できる値として,UITextAlignmentJustifyが追加されています。

これは

#define UITextAlignmentJustify ((UITextAlignment)kCTJustifiedTextAlignment)

このようにCoreTextで定義されているアライメントタイプであるkCTJustifiedTextAlignmentをUITextAlignment型にキャストしたもので,これを指定するとパラグラフの末尾が自然に揃えられます。

self.ohLabel.textAlignment = UITextAlignmentJustify;

著者プロフィール

堤修一(つつみしゅういち)

1978年生まれ。京都大学工学部を卒業後,同大学院修了。その後,NTTデータにて音声認識技術の研究開発,キヤノンにて画像処理機能の設計に携わる。

2010年より面白法人カヤックに入社。3年間ほぼiOSアプリ開発に専念し,フルスクラッチで開発しリリースしたアプリは30本以上。代表作は150万ユーザを突破した「バウンドモンスターズ」,AppStore Best of 2012を獲得した「タップ忍者」,カンヌ国際広告祭でブロンズを獲得した「Domino's App」など。

現在は,米国シリコンバレーのマウンテンビューにあるAppSocially社の一員として活躍中。

著書=『iOSアプリ開発 達人のレシピ100―開発現場で実証された実用コード集』

ブログ=Over&Outその後

Github=shu223

Twitter=shu223

コメント

コメントの記入