UIKit/テーブル

Tag: UIKit/テーブル/セルのカスタマイズ

目次

関連ページ

参考情報

ストーリーボードで設定したプロトタイプセルを利用する

手順

  • ストーリーボードでUITableViewにUITableViewCellをドロップ(これがプロトタイプセルと呼ばれる)。
  • UITableViewCellのセルを自作のクラスに変更。例MyCell。
  • ストーリーボード上でセルにラベルなどを配置して、MyCellにアウトレットなどを設定。
    class MyCell: UITableViewCell {
    
        @IBOutlet weak var titleLabel: UILabel!
        @IBOutlet weak var descriptionLabel: UILabel!
        
        override func awakeFromNib() {
            super.awakeFromNib()
            // Initialization code
        }
    
        override func setSelected(selected: Bool, animated: Bool) {
            super.setSelected(selected, animated: animated)
    
            // Configure the view for the selected state
        }
    
    }
    
  • このセルを呼び出す。
        func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
            let cell = tableView.dequeueReusableCellWithIdentifier("myCell", forIndexPath: indexPath) as! MyCell
            cell.titleLabel?.text = rows[indexPath.row]
    //        cell.textLabel?.text = rows[indexPath.row]
            return cell
        }
    

カスタマイズしたセルのマージンを調節する

UILabelを設置する場合

UITextViewを設置する場合

  • 基本的にUILabelの場合と同じだが、内部の隙間が存在する。以下の設定で揃えられる
    textView.textContainer.lineFragmentPadding = 0

その他

セルの背景色を変更する

  • cellForRowAtで変更で以下のように変更するサンプルコードが多数見つかる。
        override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
            let cell = tableView.dequeueReusableCell(withIdentifier: "myCell", for: indexPath)
            cell.textLabel?.text = rows[indexPath.row]
            cell.textLabel?.backgroundColor = UIColor.gray
            return cell
        }
    
  • しかしこのコードではスクロールしないと、背景がうまく変更できない場合がある(Initial View Controllerの場合これで良いが、そこからモーダル表示した場合はだめ?)
  • その場合以下のようにwillDisplayで設定しないとだめらしい。
       override func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
            cell.textLabel?.backgroundColor = UIColor.lightGray
        }
        
    

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2018-02-07 (水) 13:47:55