【デザイナーが喜ぶ】コンテンツが空のときのユーザビリティを向上させる【DZNEmptyDataSet】

DZNEmptyDataSetが便利

DZNEmptyDataSetというライブラリが便利だった。これはtableView,collectionViewが空だったときに、画像や文字、ボタンを表示できるライブラリだ。これがあると、ユーザビリティが向上する気がする。なぜコンテンツが空なのか説明したり、「コンテンツは0件です」みたいな表示ができる。

使ったらデザイナーが喜びそうだ

以下、主な使い方です。(install,Delegateの設定は省略)

画像を表示

func imageForEmptyDataSet(scrollView: UIScrollView!) -> UIImage! {
    return UIImage(named: "sample.png")
}

画像の色を変更

func imageTintColorForEmptyDataSet(scrollView: UIScrollView!) -> UIColor! {
    return UIColor.grayColor()
}

タイトルを表示

func titleForEmptyDataSet(scrollView: UIScrollView!) -> NSAttributedString! {
    let text = "コンテンツは0件です"
    let font = UIFont(name: "Sample Font Name", size: 30)!
    return NSAttributedString(string: text, attributes: [NSFontAttributeName: font])
}

説明文を表示

func descriptionForEmptyDataSet(scrollView: UIScrollView!) -> NSAttributedString! {
    let text = "最大100件まで表示できます"
    let font = UIFont(name: "Sample Font Name", size: 14)!
    return NSAttributedString(string: text, attributes: [NSFontAttributeName: font])
}

ボタンを表示

func buttonImageForEmptyDataSet(scrollView: UIScrollView!, forState state: UIControlState) -> UIImage! {
    return UIImage(named: "button.png")
}

ボタンのアクション

func emptyDataSetDidTapButton(scrollView: UIScrollView!) {
    //buttonを押したときの処理
}

参考

Xcode - NSAttributedStringでCSSの各プロパティの再現方法あれこれ - Qiita
http://qiita.com/inuscript/items/fdfa69515e74506134a3