LoginSignup
6
3

More than 1 year has passed since last update.

【Swift】UILabelテキストの色・サイズ・行間・整列… NSAttributedStringとおすすめextension関数

Last updated at Posted at 2020-05-01

NSAttributedStringとは

 テキストにいろんな属性を関連付けることができるもの。また、その属性を持つテキストのこと。属性の例としては、表示スタイル、ハイパーリンク、ユーザー補助データなどが挙げられます。
(Apple公式: https://developer.apple.com/documentation/foundation/nsattributedstring)

はじめに

 アプリ開発をしていると、テキストのサイズや色、フォントや行間隔などを変更したい場合があります。
 多くの場合、StoryBoard上で設定すると思いますが、コードで行いたい場合もあるでしょう。(StoryBoard上でattributedテキストをいじる→「あれ、うまくいかない…」という経験をされた方いませんか? 動作が変な時ありますよね、attributedTextにすると…汗)

 **本稿では、NSAttributedStringを使ってテキストの表示を変更する例を示します。**また、私が便利だと思うextension(装飾したテキストを返す独自関数の例)も紹介します。

環境

macOS Catalina 10.15.4
Xcode 11.4.1

そのまま使えるextension例

Stringクラスを拡張して、attributedString関数を作りました。
5つの引数をとり、String型の文字列に色々と属性をつけて、それを返すものです。
一応、デフォルトで引数を入れてます。

sampleStringExtension.swift
extension String {
    func attributedString(
        _ color: UIColor = UIColor.black,
        font: UIFont = UIFont.systemFont(ofSize: 20),
        align: NSTextAlignment = .center,
        lineSpace: CGFloat = 10,
        kern: CGFloat = 0
    ) -> NSAttributedString {
        let paragraph = NSMutableParagraphStyle()
        paragraph.lineSpacing = lineSpace
        paragraph.alignment = align
        
        return NSAttributedString(string: self, attributes: [
            NSAttributedString.Key.paragraphStyle: paragraph,
            NSAttributedString.Key.font: font,
            NSAttributedString.Key.foregroundColor: color,
            NSAttributedString.Key.kern: kern,
        ])
    }
}

実際に使ってみましょう↓↓

text.swift
// String型の文字列 text
var text: String = "Text"
// UILabel型のインスタンス label
var label: UILabel = UILabel()

// labelのテキストに、装飾したtextを代入
label.attributedText = text.attributedString(
    UIColor.red,
    font: UIFont(name: "HiraginoSans-W6", size: 30)!,
    align: NSTextAlignment.center,
    lineSpace: 5,
    kern: 3)

上記中のUIFont(name: String, size: CGFloat)はStringにフォント名を入れることで、文字のフォントを指定します。
ここで!をつけて強制アンラップしているのは、iOSでHiraginoSans-W6フォントが使えるからです。
iOSに標準で入っていないフォントを入れてしまうと、強制アンラップできずにここでエラーが発生し、アプリがクラッシュします。
それを避けるために、下のようにフォントがなかった場合のデフォルトのフォントを指定しておくといいかもしれません。(これがいいのかはわかりません)

UIFont(name: "HiraginoSans-W6", size: 30) ?? UIFont.systemFont(ofSize: 30)

また、標準で入ってるフォントは、こちらの記事にまとめられています。(@lovee さん失礼します。)
https://qiita.com/lovee/items/6048bf780558517e72e6

ここで、 lineSpaceてなに? kernてなに? てなった方へ

  • lineSpace:行間。
    複数行になったさいに、行の間隔をどれくらい広げるか指定できます。
  • kern:字間。
    文字同士の間隔をどれくらい広げるか指定できます。カーニングってやつですね。

UIで確認してみる

StoryBoard上にUILabelを配置してみました。

画像1.png

この画像のUI(StoryBoardで作ったもの)対し、以下のようなコーディングをします。

ViewController.swift
class ViewController: UIViewController {
    @IBOutlet weak var textLabel: UILabel! // これが配置されてるラベル
    
    override func viewDidLoad() {
        super.viewDidLoad()
        textLabel.attributedText = textLabel.text?.attributedString(
        UIColor.red,
        font: UIFont(name: "HiraginoSans-W6", size: 30)!,
        align: NSTextAlignment.right,
        lineSpace: 5,
        kern: 3)
    }
}

すると、下のようになりました。
画像2.png

まとめ

NSAttributedStringは、コードで文字の属性を指定できます。便利ですね。
ですが、コードで毎回指定するが大変だと思い、今回はStringクラスを拡張し、一部の属性を簡単に付与できるようにしました。
便利なので使ってみてくださいね。

また、記事の中でおかしな点がございましたら、ご指摘お願いします🙌

6
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
3