ใช้ tableView(_:viewForFooterInSection:) สร้าง Footer View พร้อมปุ่ม Submit
โค้ดตัวอย่างเต็ม
import UIKit
class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
override func viewDidLoad() {
super.viewDidLoad()
setupTableView()
}
func setupTableView() {
let tableView = UITableView(frame: view.bounds, style: .plain)
tableView.dataSource = self
tableView.delegate = self
tableView.register(UITableViewCell.self, forCellReuseIdentifier: "Cell")
tableView.backgroundColor = .systemGray6
view.addSubview(tableView)
// Auto Layout
tableView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
tableView.topAnchor.constraint(equalTo: view.topAnchor),
tableView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor)
])
}
// DataSource
func numberOfSections(in tableView: UITableView) -> Int { return 1 }
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 5
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
cell.textLabel?.text = "Item \(indexPath.row + 1)"
cell.backgroundColor = .systemBackground
return cell
}
// Footer Height
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 100
}
// Footer View with Button
func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
let footerView = UIView()
footerView.backgroundColor = .systemGroupedBackground
let submitButton = UIButton(type: .system)
submitButton.setTitle("Submit", for: .normal)
submitButton.titleLabel?.font = .boldSystemFont(ofSize: 18)
submitButton.backgroundColor = .systemBlue
submitButton.setTitleColor(.white, for: .normal)
submitButton.layer.cornerRadius = 8
submitButton.translatesAutoresizingMaskIntoConstraints = false
submitButton.addTarget(self, action: #selector(submitTapped), for: .touchUpInside)
footerView.addSubview(submitButton)
NSLayoutConstraint.activate([
submitButton.centerXAnchor.constraint(equalTo: footerView.centerXAnchor),
submitButton.centerYAnchor.constraint(equalTo: footerView.centerYAnchor),
submitButton.widthAnchor.constraint(equalToConstant: 200),
submitButton.heightAnchor.constraint(equalToConstant: 50)
])
return footerView
}
@objc func submitTapped() {
print("✅ Submit tapped")
// Handle Submit Logic
}
}
Alternative: Table Footer View (Single Footer สำหรับทั้ง Table)
override func viewDidLoad() {
super.viewDidLoad()
let footerView = createSubmitFooter()
tableView.tableFooterView = footerView // ไม่ใช่ Section Footer
}
func createSubmitFooter() -> UIView {
let view = UIView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 100))
// Add Button like above...
return view
}
จุดแตกต่าง
| คุณสมบัติ | Section Footer | Table Footer View |
|---|---|---|
| หลาย Section | มี Footer ต่อ Section | มีแค่ท้าย Table |
| Scroll Behavior | Scroll ตาม Section | ติดท้าย Table เสมอ |
| เหมาะสำหรับ | Grouped Data | Form Submit, Load More |
Load More Pattern
func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
if isLoadingMore {
let indicator = UIActivityIndicatorView(style: .medium)
indicator.startAnimating()
let view = UIView(frame: CGRect(x: 0, y: 0, width: tableView.bounds.width, height: 50))
indicator.center = view.center
view.addSubview(indicator)
return view
}
return createSubmitFooter()
}