Skip to content

Customize the layout of TableVIew using CustumTableViewCell and accessoryView.

   

By creating CustumTableViewCell, you can use cells of your favorite layout in TableView.
And the TableViewCell accessory view can be equipped with accessories such as UISwitches and checkmarks.
Here is a sample code that uses both.

Reference: [Swift]UITableViewCellのaccessoryViewでaccessoryButtonTappedForRowWithIndexPathが来ない件の対応

import UIKit
class CustumTableViewCell: UITableViewCell {
var timeLabel:UILabel!
var alarmNameLabel:UILabel!
var weekLabel:UILabel!
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
timeLabel = UILabel()
alarmNameLabel = UILabel()
weekLabel = UILabel()
}
required init(coder aDecoder: NSCoder) {
fatalError("init(coder: ) has not been implemented")
}
override func prepareForReuse() {
super.prepareForReuse()
}
override func layoutSubviews() {
super.layoutSubviews()
//let cellWidth:CGFloat = self.frame.width
//let cellHeight:CGFloat = self.frame.height
//timeLabel
timeLabel.frame = CGRect(x: 16, y: 8, width: 200, height: 24)
timeLabel.text = "07:00"
timeLabel.font = UIFont.boldSystemFont(ofSize: 24)
timeLabel.textColor = UIColor.gray
timeLabel.textAlignment = NSTextAlignment.left
self.addSubview(timeLabel)
//timeLabel
alarmNameLabel.frame = CGRect(x: 16, y: 36, width: 200, height: 18)
alarmNameLabel.text = "アラーム名"
alarmNameLabel.font = UIFont.systemFont(ofSize: 18)
alarmNameLabel.textColor = UIColor.gray
alarmNameLabel.textAlignment = NSTextAlignment.left
self.addSubview(alarmNameLabel)
//timeLabel
weekLabel.frame = CGRect(x: 16, y: 56, width: 200, height: 18)
weekLabel.text = "毎日"
weekLabel.font = UIFont.systemFont(ofSize: 18)
weekLabel.textColor = UIColor.gray
weekLabel.textAlignment = NSTextAlignment.left
self.addSubview(weekLabel)
}
}
import UIKit
class ViewController: UIViewController,UITableViewDelegate, UITableViewDataSource {
//テーブルビューインスタンス
private var myTableView: UITableView!
override func viewDidLoad() {
super.viewDidLoad()
//テーブルビューの初期化
myTableView = UITableView()
//デリゲートの設定
myTableView.delegate = self
myTableView.dataSource = self
//テーブルビューの大きさの指定
myTableView.frame = view.frame
//テーブルビューの設置
myTableView.register(CustumTableViewCell.self, forCellReuseIdentifier: NSStringFromClass(CustumTableViewCell.self))
myTableView.rowHeight = 80
self.view.addSubview(myTableView)
}
//MARK: テーブルビューのセルの数を設定する
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
//テーブルビューのセルの数は10とした
return 10
}
//MARK: テーブルビューのセルの中身を設定する
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
//myItems配列の中身をテキストにして登録した
let cell:UITableViewCell = tableView.dequeueReusableCell(withIdentifier: NSStringFromClass(CustumTableViewCell.self))! as! CustumTableViewCell
//以下の行を追加するとセル選択時にハイライトしなくなる
cell.selectionStyle = .none
//cellのアクセサリービューに追加する
if cell.accessoryView == nil{
let switchView = UISwitch()
switchView.isOn = false
switchView.tag = indexPath.row
switchView.addTarget(self, action: #selector(switchTriggered), for: .valueChanged)
cell.accessoryView = switchView
}
return cell
}
//Mark: テーブルビューのセルが押されたら呼ばれる
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
print("\(indexPath.row)番のセルを選択しました! ")
}
//cellのアクセサリービューに追加したUISwitchが変化すると呼ばれる
@objc func switchTriggered(sender: UISwitch){
print(sender.tag)
print(sender.isOn)
}
}

  1. Adding a TextField to UIAlertController
  2. Implementing NavigationController
  3. Generating a QR code from a string or URL
  4. Display an alert with UIAlertController
  5. UIAlertController(UIActionSheet)
  6. Enumerated Type
  7. How to learn how to program iPhone apps