はじめに

HUDライブラリとして最も有名なのはSVProgressHUDだと思いますが、今回はSwiftでできているPKHUDを調べてみました。

なぜ`PKHUD`なのか

GitHubでHUDかつ言語がSwiftで検索した結果、のスター数が一番多かったからです。(2018 12/10時点)

ざっくり比較

ライブラリ名	スター数	Swift	Xcode	その他
PKHUD	3,057	4.2	Xcode 10
SwiftNotice	755	4.0	Xcode 9.3	インストール方法がマニュアルのみ
KRProgressHUD	338	4.2	Xcode 10	日本語ドキュメントがある
VHUD	138	4.2	Xcode 10

PKHUDについて

特徴

Appleのデザインをもとに作られている
表示もとのViewを明示的に指定できる
カスタマイズ性が高い

使い方

基本操作

簡単にHUDを表示できるHUDクラスが提供されています。
これを使うことでとても簡単にローディングやステータスを表示することができます。

// HUDを表示
HUD.show(.progress)
HUD.show(.progress, onView: view) // 表示もとのviewを明示的に指定

// HUDを表示して指定時間後に非表示にする
HUD.flash(.progress, delay: 3)
// HUDを出し終わったあとのタイミングが取れる
HUD.flash(.success, onView: view, delay: 2) { _ in
            // HUDを非表示にしたあとの処理
        }

// HUDを非表示にする
HUD.hide()
HUD.hide { _ in
            // HUDを非表示にしたあとの処理
        }

指定できるType


public enum HUDContentType {

    case success

    case error

    case progress

    case image(UIImage?)

    case rotatingImage(UIImage?)

    case labeledSuccess(title: String?, subtitle: String?)

    case labeledError(title: String?, subtitle: String?)

    case labeledProgress(title: String?, subtitle: String?)

    case labeledImage(image: UIImage?, title: String?, subtitle: String?)

    case labeledRotatingImage(image: UIImage?, title: String?, subtitle: String?)

    case label(String?)

    case systemActivity
}

例)
success

error

progress

背景
背景を暗くするかどうかを設定することができます。
デフォルトで暗くなる設定になっています。

HUD.dimsBackground = false
HUD.show(.progress, onView: view)

dimsBackground	true	false

カスタマイズについて

HUDで提供されているもので充分使えますが、カスタマイズしたいということはあると思います。
その場合は、PKHUDを使用します。
PKHUD.sharedHUD.contentViewにカスタマイズしたViewを設定することで実現できます。
PKHUDですでに定義されたView(PKHUDSquareBaseView、PKHUDWideBaseView)を使うと簡単にカスタマイズできます。

例)

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        PKHUD.sharedHUD.contentView = CustomHUDView(image: PKHUDAssets.checkmarkImage, title: "Success!", subtitle: nil)
        PKHUD.sharedHUD.show(onView: view)
    }
}

class CustomHUDView: PKHUDSquareBaseView {

    override init(image: UIImage?, title: String?, subtitle: String?) {
        super.init(image: image, title: title, subtitle: subtitle)

        titleLabel.textColor = UIColor.lightGray
        backgroundColor = UIColor(red: 0xAB/0xFF, green: 0xD2/0xFF, blue: 0xFC/0xFF, alpha: 1.0)
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }
}

注意点
PKHUDSquareBaseViewをカスタマイズしましたが、ローディングを表示したい場合はローディング機能を持ったViewをPKHUD.sharedHUD.contentViewに再度設定します。
表示したい内容によって、PKHUD.sharedHUD.contentViewを都度変える必要があるのでPKHUDを拡張するのがいいかなと思いました。

文字色を変えたいだけとかだと少し手間ですね、、、

まとめ

Swift製のHUDライブラリPKHUDについてでした。
基本的にシンプルで使いやすいなという印象です。
長くSVProgressHUDにお世話になってきましたが、Swiftで作られたPKHUDを使ってみたいと思いました。

Swift製のHUDライブラリ PKHUD

はじめに

なぜPKHUDなのか

PKHUDについて

特徴

使い方

カスタマイズについて

まとめ

なぜ`PKHUD`なのか