UITableView의 구분선을 화려하게 만들고 싶습니다!
8999 단어 iOSSwifttableViewtableViewcell우이
이런 식으로 하고 싶다!
모든 구분선이 같은 색으로 좋다면
모두 동일하고 좋은 경우에는 tableView.separatorColor
로 대응할 수 있습니다.
예를 들어, 다음 예에서 구분선은 빨간색입니다.
swift override func viewDidLoad() {
super.viewDidLoad()
tableView.separatorColor = .red
}
그럼 각 셀마다 다른 색상을 만들려면 어떻게해야합니까 ...
사용자 정의 셀로 할!
사실, 사용자 정의 셀에서도 구분선의 색상을 개별적으로 변경할 수 없다고 생각합니다.
그래서 스스로 구분선 (같은 UIview
) 을 만드는 것으로 대응합니다.
아래와 같이 셀의 하단에 구분선으로 보이는 UIView
를 배치하여 구분선에 표시합니다.
swiftclass CustomTableViewCell: UITableViewCell {
// 区切り線に見せかける view
private let separator: UIView = {
let view = UIView()
return view
}()
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
contentView.addSubview(separator)
// contentView の最下部に高さの値を小さくして配置することで、区切り線に見せかける
separator.translatesAutoresizingMaskIntoConstraints = false
separator.heightAnchor.constraint(equalToConstant: 1).isActive = true
separator.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
separator.leadingAnchor.constraint(equalTo: contentView.leadingAnchor).isActive = true
separator.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).isActive = true
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func setColor(color: UIColor) {
separator.backgroundColor = color
}
}
그리고는 TableViewController
안에서…
tableView
의 구분선을 숨깁니다 ( tableView.separatorStyle = .none
).
swift override func viewDidLoad() {
super.viewDidLoad()
tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: "CustomTableViewCell")
tableView.separatorStyle = .none
}
커스텀 셀을 사용하도록 한다.
swift override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "CustomTableViewCell") as! CustomTableViewCell
cell.textLabel?.text = String(indexPath.row + 1)
cell.setColor(color: colors[indexPath.row]) // 好きな色を設定する
return cell
}
이제 마치 화려한 구분선이 생긴 것처럼 보일 수 있습니다!
끝에
이번 예와 같이 구분선을 커스터마이즈하고 싶다는 요망은 적을지도 모릅니다.
그렇지만, 아무래도 그러한 디자인으로 하고 싶지만, 제공되고 있는 프로퍼티에서는 대처할 수 없는 때에는,
스스로 그렇게 보이도록 궁리한다고 하는 선택사항이 머리 속에 있으면, 해결에 한 걸음 다가갈 것인가라고 생각하고 있습니다.
Reference
이 문제에 관하여(UITableView의 구분선을 화려하게 만들고 싶습니다!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/taka4/items/362b0015ef21946415ea
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
모두 동일하고 좋은 경우에는
tableView.separatorColor
로 대응할 수 있습니다.예를 들어, 다음 예에서 구분선은 빨간색입니다.
swift
override func viewDidLoad() {
super.viewDidLoad()
tableView.separatorColor = .red
}
그럼 각 셀마다 다른 색상을 만들려면 어떻게해야합니까 ...
사용자 정의 셀로 할!
사실, 사용자 정의 셀에서도 구분선의 색상을 개별적으로 변경할 수 없다고 생각합니다.
그래서 스스로 구분선 (같은 UIview
) 을 만드는 것으로 대응합니다.
아래와 같이 셀의 하단에 구분선으로 보이는 UIView
를 배치하여 구분선에 표시합니다.
swiftclass CustomTableViewCell: UITableViewCell {
// 区切り線に見せかける view
private let separator: UIView = {
let view = UIView()
return view
}()
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
contentView.addSubview(separator)
// contentView の最下部に高さの値を小さくして配置することで、区切り線に見せかける
separator.translatesAutoresizingMaskIntoConstraints = false
separator.heightAnchor.constraint(equalToConstant: 1).isActive = true
separator.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
separator.leadingAnchor.constraint(equalTo: contentView.leadingAnchor).isActive = true
separator.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).isActive = true
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func setColor(color: UIColor) {
separator.backgroundColor = color
}
}
그리고는 TableViewController
안에서…
tableView
의 구분선을 숨깁니다 ( tableView.separatorStyle = .none
).
swift override func viewDidLoad() {
super.viewDidLoad()
tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: "CustomTableViewCell")
tableView.separatorStyle = .none
}
커스텀 셀을 사용하도록 한다.
swift override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "CustomTableViewCell") as! CustomTableViewCell
cell.textLabel?.text = String(indexPath.row + 1)
cell.setColor(color: colors[indexPath.row]) // 好きな色を設定する
return cell
}
이제 마치 화려한 구분선이 생긴 것처럼 보일 수 있습니다!
끝에
이번 예와 같이 구분선을 커스터마이즈하고 싶다는 요망은 적을지도 모릅니다.
그렇지만, 아무래도 그러한 디자인으로 하고 싶지만, 제공되고 있는 프로퍼티에서는 대처할 수 없는 때에는,
스스로 그렇게 보이도록 궁리한다고 하는 선택사항이 머리 속에 있으면, 해결에 한 걸음 다가갈 것인가라고 생각하고 있습니다.
Reference
이 문제에 관하여(UITableView의 구분선을 화려하게 만들고 싶습니다!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/taka4/items/362b0015ef21946415ea
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
class CustomTableViewCell: UITableViewCell {
// 区切り線に見せかける view
private let separator: UIView = {
let view = UIView()
return view
}()
override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
contentView.addSubview(separator)
// contentView の最下部に高さの値を小さくして配置することで、区切り線に見せかける
separator.translatesAutoresizingMaskIntoConstraints = false
separator.heightAnchor.constraint(equalToConstant: 1).isActive = true
separator.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
separator.leadingAnchor.constraint(equalTo: contentView.leadingAnchor).isActive = true
separator.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).isActive = true
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func setColor(color: UIColor) {
separator.backgroundColor = color
}
}
override func viewDidLoad() {
super.viewDidLoad()
tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: "CustomTableViewCell")
tableView.separatorStyle = .none
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "CustomTableViewCell") as! CustomTableViewCell
cell.textLabel?.text = String(indexPath.row + 1)
cell.setColor(color: colors[indexPath.row]) // 好きな色を設定する
return cell
}
이번 예와 같이 구분선을 커스터마이즈하고 싶다는 요망은 적을지도 모릅니다.
그렇지만, 아무래도 그러한 디자인으로 하고 싶지만, 제공되고 있는 프로퍼티에서는 대처할 수 없는 때에는,
스스로 그렇게 보이도록 궁리한다고 하는 선택사항이 머리 속에 있으면, 해결에 한 걸음 다가갈 것인가라고 생각하고 있습니다.
Reference
이 문제에 관하여(UITableView의 구분선을 화려하게 만들고 싶습니다!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/taka4/items/362b0015ef21946415ea텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)