【Swift】UITableViewのセルの区切り線を消す方法

記事内に商品プロモーションを含む場合があります

デフォルトの状態だと、下の写真のように各セルに区切り線が表示されます。

このページでは、この区切り線を消す方法を紹介します。

Contents

区切り線を全て消す方法
- 1. storyboard上で設定する場合
- 2. コードを書いて設定する場合
空のセルの区切り線だけを消す方法

区切り線を全て消す方法

1. storyboard上で設定する場合

TableViewを選択して属性の設定項目を開くと「Separator」という項目が「Default」になっているのを確認できると思います。

こちらをクリックし、「None」に変更してあげれば区切り線が消えます。

実際に画面を確認するとこんな感じです。

2. コードを書いて設定する場合

次のように書けばOKです。

class ViewController: UIViewController, UITableViewDataSource {

  @IBOutlet weak var tableView: UITableView!

  override func viewDidLoad() {
    super.viewDidLoad()

    tableView.dataSource = self
    tableView.separatorStyle = .none  //　区切り線を消す
  }
}

空のセルの区切り線だけを消す方法

データがある箇所のみ区切り線を表示するようにしたい場合は、次のように書けばOKです。

class ViewController: UIViewController, UITableViewDataSource {

  @IBOutlet weak var tableView: UITableView!

  override func viewDidLoad() {
    super.viewDidLoad()

    tableView.dataSource = self
    tableView.tableFooterView = UIView()  //　空のセルの区切り線だけ消す。
  }
}

実際に画面を確認すると次のようになります。