Swift3 CollectionViewの中にTableViewを配置

f:id:happy_teeth_ago:20180711223527p:plain

CollectionViewは横向きに並べるのが得意

TableViewは縦向きに並べるのが得意

最近のはやりでフリックで横方向に、画面遷移するにはCollectionViewの中にTableViewを配置しなくてはいけない。
ではまず、イメージしましょう? collectionViewのインスタンス作ってそこにどのようにTableを配置するのか?

//collectionのセルを生成 ifの条件2つ   
if let cell = mainCollectionView.dequeueReusableCell(withReuseIdentifier: R.nib.mainCollectionViewCell,for: indexPath),
                let viewController: NewsListViewController = tabInfo.viewController as? NewsListViewController {
                //ここから条件が真のときの処理、ちなみに必ず条件は真になる。                 
                viewController.delegate = self
                cell.setView(viewController: viewController)
                return cell
            }

tabInfoの宣言は
let tabInfo = viewModel.sourceTabInfo[indexPath.row]

viewModel

var viewModel = UpTabViewControllerViewModel()

class UpTabViewControllerViewModel {
    /// タブ情報
    var sourceTabInfo:[(viewController: UIViewController, title: String)] = []  

sourceTabInfoはタプルで宣言。
辞書型とは違う。
タプルのほうが、型を決めれるので、優れている。
特別な理由がなければ、必ずタプルを利用すること。

つまりtabInfoは, UIViewController型のviewControllerとString型のtitleの配列で構成されている。

そのviewControllerをNewsListViewController にキャストしなさいといっている。

ここがポイント

class NewsListViewController: UIViewController, UITableViewDelegate, UITableViewDataSource, NewsListCellDelegate, ArticleDetailViewControllerDelegate, SpeechModelDelegate {
   
   var viewModel: NewsListViewModel?
   
   override func viewDidLoad() {
        super.viewDidLoad()
        
        guard let viewModel = viewModel else { return }
        viewModel.bind {
            self.refreshView()
        }
    }

viewModelは

やっとここで出てきました。しかし、拡張性の高いコードです。かっこいいですね。

class NewsListViewModel {
    
    var newsListCellViewModel: [NewsListCellViewModel]! {
        didSet {
            didChange?()
        }
    }
    
    /// ジャンル
    var genre: String = ""
    /// ニュース一覧
    var newsList: [Article] = []
    /// 最大読み込み件数
    let maxNewsList = 100
    // 1ページあたりの読み込み件数
    let numReadOfPage = 25
    /// 現在のページ
    var page = 1

なお参考にさせていただいているソースはRyutaMiyamotoさんのものです。

Copyright (c) RyutaMiyamoto Released under the MIT license

github.com