【swift】tableViewに何もなければ、吉岡里帆ちゃんが出現する

• 今回は、UITabaleViewやUICollectionViewに表示する要素が0であれば、吉岡里帆さん が出現するようにします。
• アプリ作りのときに毎回お世話になっているライブラリで dzenbot/DZNEmptyDataSet という、UITabaleViewやUICollectionViewに表示する要素が何もなければ任意の画像や文字を設定してくれます。

完成形はこんな感じです(要素が０のとき)

---

要素があれば普通にインデックスを表示します

---

実装してみる

cocoapodかcarthageでdzenbot/DZNEmptyDataSetを入れる

cocoapod

  pod 'DZNEmptyDataSet'

$ pod install

carthage

github "dzenbot/DZNEmptyDataSet"

$ carthage update --platform iOS

ソースコードはこれだけ

• 画像はriho1でAssets.xcassets に入れてあります。
• numberOfRowsInSectionを0にすると吉岡里帆ちゃんが出現するはずです。
• ポイントとして今回delegateの設定は、Storyboardだけで行います。

viewController.swift

import UIKit
import DZNEmptyDataSet

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
    }
}

extension ViewController: UITableViewDataSource, UITableViewDelegate {
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
        cell.textLabel?.text = "\(indexPath.row)"
        return cell
    }
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 10 // <= ここを0にしたときに、吉岡里帆ちゃんが出現すれば成功
    }
}

extension ViewController: DZNEmptyDataSetSource, DZNEmptyDataSetDelegate {
    func image(forEmptyDataSet scrollView: UIScrollView!) -> UIImage! {
        return UIImage(named: "riho1")
    }
}

Storyboardの設定

UITableViewとDZNEmptyDataSetのdelegateをStoryboardで設定する <- ポイント！！

• referencing Outlets に

  • UITableViewDataSource
  • UITableViewDelagate
  • DZNEmptyDataSetSource
  • DZNEmptyDataSetDelegate が設定されています。

• このとき、viewControllerにDZNEmptyDataSet がimportされていることと、StoryboardにviewControllerがcustom classに設定されていれば、設定できます。

• 下図のように、tableViewをControllを押しながらViewControllerのところで離すと、delegateの設定ができます。ソースコードの中でいちいち ????.delegate = self としなくて良くなります。

---

---

完成形はこちら

まとめ

• DZNEmptyDataSetを使えば、tableViewやcolelctionView scrollViewに何もないときに画像やテキストをかんたんに表示することができます。
• おすすめです！