Swift3 CollectionViewの中にTableViewを配置
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