[swift]UITableViewを画面の一部にする。

相変わらず演劇感想文リンクのアプリを開発しています。

まずは、完成イメージ。

前回までに作成した公演情報の下に劇評の一覧を表示します。UITableViewを使いたいのですが、色々なサンプルの殆どが、画面全体をUITableViewにするものしか見つけられませんでした。試行錯誤をしてなんとか形にできたので、共有です。

とはいえ、結局は以下の手順で実現することができました。

・UITableViewを画面の部品クラスとして実装

・その部品を親画面にaddSubviewで追加

・位置設定を行い、画面上に正しく表示する。

■別のファイルで、TableViewのクラスを設定

ネットで見つけたサンプルだと、ViewControllerにTableViewのDelegate等をもたせている例が多かったのですが、VCではなくViewそのものにもたせることにして、別ファイルでClassを作成しました。

劇評画面

import UIKit

class 劇評集画面型:UITableView,UITableViewDataSource,UITableViewDelegate {
  var numberOfCells=0
  var 劇評集:[劇評型]=[]
  var selected: Int?
  var 親画面:公演画面型?

  override init(frame:CGRect,style: UITableViewStyle){
    super.init(frame: frame,style: style)
    self.dataSource=self
    self.delegate=self
  }
  required init(coder aDecoder:NSCoder){
    fatalError("init(coder:)has not been implemented")
  }
  
  func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 劇評集.count
  }
  func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) ->  UITableViewCell {
   let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Subtitle, reuseIdentifier: "Cell") as UITableViewCell
    cell.textLabel?.text="\(劇評集[indexPath.row].劇評者)(\(劇評集[indexPath.row].観劇日)),"
    return cell
  }
  func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
    print("\(劇評集[indexPath.row].劇評者)")
  }
  override func layoutSubviews() {
    super.layoutSubviews()
    
  }
  
  
}

■addSubViewで親画面に追加。

UITableViewもUIViewのサブクラスなので、普通にaddSubViewで親画面に追加できます。

    //劇評者集画面
    lazy var 劇評集画面:劇評集画面型=self.劇評集画面生成()
  
    override func 共通初期化(){
      super.共通初期化()

〜中略〜
      
      self.addSubview(劇評集画面)
    }

  private func 劇評集画面生成() -> 劇評集画面型{
    let 画面 = 劇評集画面型(frame:CGRectZero)
    return 画面;
  }

■位置設定を行い、画面上に正しく表示する。

本来的には、Autolayout等を利用して制約をきちんとかけるべきなのですが、とりあえず簡単にすませてしまいました。

  private func 劇評集画面配置(){
    let 劇評集画面頂点=値ラベル集[値ラベル集.count-1].frame.origin.y+値ラベル集[値ラベル集.count-1].frame.size.height
    劇評集画面.frame.size=CGSizeMake(self.frame.size.width-20,self.frame.size.height-劇評集画面頂点-20)
    劇評集画面.frame.origin.y=劇評集画面頂点+10
    劇評集画面.frame.origin.x=10
    劇評集画面.backgroundColor=UIColor(white: 0.9,alpha:1.0)
  }

この画面のサイズ及び位置を決定する関数「劇評集画面配置」をlayoutSubViews()の中でコールすれば、縦/横のサイズ変更にも対応してくれました。