將 CheckBox 嵌入 TableView 中使用

這是一個標準的 Column 設計。

首先把紅色的部份移除，換成 CheckBox，如下圖。

註：其實還有一種方法，就是不移除 Table Cell View，只移除 Table View Cell，然後用 CheckBox 取代 Table View Cell。底下程式也會需要修改。

然後設定 CheckBox 的 Identifier，本例為 tableCheck。

底下是程式呈現的片段。

// 資料來源

var data1: [String] = ["abc","123","xyz"]

@IBOutlet weak var table: NSTableView!

override func viewDidLoad() {

    super.viewDidLoad()

    table.dataSource = self

    table.delegate = self

}

...略...

// 傳回有多少資料

func numberOfRows(in tableView: NSTableView) -> Int {

   return data1.count

}

// 傳回資料

func tableView(_ tableView: NSTableView, viewFor tableColumn: NSTableColumn?, row: Int) -> NSView? {

   let view = table.makeView(withIdentifier: NSUserInterfaceItemIdentifier(rawValue: "tableCheck") , owner: self) as! NSButton

    view.title = data1[row]

    return view

}

註：如果沒有移除 Table Cell View，而 CheckBox 是在它的下層，則上面的程式變成如下，也就是利用 subviews[0] 找到下層的 CheckBox。最底下程式也是類似處理，就不一一說明了。

// 傳回資料

func tableView(_ tableView: NSTableView, viewFor tableColumn: NSTableColumn?, row: Int) -> NSView? {

    let view = table.makeView(withIdentifier: NSUserInterfaceItemIdentifier(rawValue: "tableCheck") , owner: self) as! NSTableCellView

    let checkbox = view.subviews[0] as! NSButton

    checkbox.title = data1[row]

    return view

}

這是呈現畫面。

此時有一個問題，若點選 CheckBox，CheckBox 會有作用，但不會有選擇到 TableView 該列的事件發生。同樣的，若點選 CheckBox 文字後面的空間，雖然會發生 TableView 該列被選取，但 CheckBox 不會有點選的反應。

如果要解決這二件事，就要分別處理 TableView Click 和 CheckBox Click。

這一段是處理 TableView Click，先找到點選該行的 CheckBox，然後更改 CheckBox 的狀態。

@IBAction func tableClick(_ sender: Any) {

    let i = table.selectedRow

    if i == -1 { return }

    let checkBox = table.view(atColumn: 0, row: i, makeIfNecessary: false) as! NSButton

    if checkBox.state == .on {

        checkBox.state = .off

    } else {

        checkBox.state = .on

    }

}

這一段是處理 CheckBox 的 Click，點選之後會先找到所在的列數，再轉換成 index，再將此 index 所在列設定為選取狀態。

@IBAction func checkBoxClick(_ sender: Any) {

    let row = table.row(for: sender as! NSView)

    let index = NSIndexSet(index: row)

    table.selectRowIndexes(index as IndexSet, byExtendingSelection: false)

}

最後，若只想操作 CheckBox，不想看選取列有突顯的顏色，將 TableView 的 Highlight 選擇 None 即可。如此一來，也不用處理上面提到 CheckBox Click 之後選取列的設定了。