Cách tạo nút mũi tên trái (Back button) trên Toolbar iPhone/iPad

Để tạo nút có hình mũi tên trái (back arrow) trên Toolbar, cần dùng 2 component: Toolbar (thanh công cụ dưới cùng) và Bar Button Item (nút trên Toolbar/Navigation Bar), cùng một hình ảnh mũi tên.

Các bước trên Storyboard

1. Tạo project mới, set màu nền cho ViewController.
2. Kéo Toolbar từ Object Library vào dưới cùng View Controller.
3. Toolbar tự động có 1 Bar Button Item. Chọn Toolbar, thêm constraint: Bottom/Leading/Trailing = 0, Height = 44-50.
4. Tải ảnh mũi tên trái (back arrow), thêm vào Assets.xcassets.
5. Chọn Bar Button Item trên Toolbar, vào Attribute Inspector:
   • Image: Chọn ảnh mũi tên vừa thêm.
   • Tint Color: Màu sắc nút (mặc định system blue).
   • Style: Plain / Done.
6. Kết nối Action cho Bar Button Item (Ctrl-drag ra code).

Kết quả

Toolbar tự động căn khoảng cách đều các item tùy số lượng.

Làm bằng Code (Programmatically)

let toolbar = UIToolbar()
toolbar.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(toolbar)

NSLayoutConstraint.activate([
    toolbar.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    toolbar.trailingAnchor.constraint(equalTo: view.trailingAnchor),
    toolbar.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
    toolbar.heightAnchor.constraint(equalToConstant: 44)
])

let backButton = UIBarButtonItem(
    image: UIImage(named: "back_arrow"),
    style: .plain,
    target: self,
    action: #selector(backTapped)
)

let flexibleSpace = UIBarButtonItem(barButtonSystemItem: .flexibleSpace, target: nil, action: nil)
toolbar.items = [backButton, flexibleSpace]  // Nút back bên trái

@objc func backTapped() {
    navigationController?.popViewController(animated: true)
}

Mẹo: Dùng UIBarButtonItem.SystemItem có sẵn (.reply, .action, .bookmarks...) thay vì ảnh custom nếu phù hợp.