WWDC20 đã chính thức kết thúc và iOS 14 đã xuất hiện cùng với rất nhiều tính năng mới. Tạo ứng dụng cho tất cả các nền tảng của Apple giờ đây chỉ cần một cú nhấp chuột.
Bài viết này sẽ hướng dẫn cách thay đổi màu nền của UIView trên cơ sở màu do người dùng chọn.
UIColorPickerViewController là một cách chọn màu đẹp mắt không chỉ trong iOS mà còn trên tất cả các nền tảng của Apple, với vẻ đẹp này, nó rất dễ sử dụng đối với người dùng và chỉ với một vài dòng mã, bạn có thể có bộ chọn màu chạy trong hệ thống.

Bắt đầu

Đầu tiên là tạo một dự án Xcode mới với giao diện là Storyboard chứ không phải SwiftUI.

Mở Main.storyboard và thêm Button vào chính giữa ViewController của bạn.

Tiếp theo, kéo Action cho Button đó và đặt tên cho nó là changeBackground.

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }
    @IBAction func changeBackground(_ sender: Any) {
    }
}

Mã Code

Có hai cách để lấy màu đã chọn từ bộ chọn, một cách với sự trợ giúp của delegate, cách thứ hai với sự trợ giúp của Combine.

Cách 1

Mở ViewController.swift và trong changeBackground, hãy thêm mã được hiển thị bên dưới.

@IBAction func changeBackground(_ sender: Any) {
     // Initializing Color Picker
     let picker = UIColorPickerViewController()

     // Setting the Initial Color of the Picker
     picker.selectedColor = self.view.backgroundColor!

     // Setting Delegate
     picker.delegate = self

     // Presenting the Color Picker
     self.present(picker, animated: true, completion: nil)
 }

Trong đoạn mã trên, tôi đã khởi tạo UIColorPickerViewController màu đặt trước. Vì vậy, bất cứ khi nào bộ chọn màu được hiển thị, màu nền của màu đó UIView sẽ được hiển thị dưới dạng màu đã chọn. Tiếp theo, tôi khởi tạo một delegate và hiển thị nó trên bộ điều khiển chế độ xem hiện tại của tôi.

Khi hoàn thành việc này, chúng ta cần thêm phần mở rộng ở cuối ViewController.swift tệp của mình. Thêm mã hiển thị bên dưới.

extension ViewController: UIColorPickerViewControllerDelegate {
 
 //  Called once you have finished picking the color.
 func colorPickerViewControllerDidFinish(_ viewController: UIColorPickerViewController) {
     self.view.backgroundColor = viewController.selectedColor
     
 }
 
 //  Called on every color selection done in the picker.
 func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) {
         self.view.backgroundColor = viewController.selectedColor
 }
}

Cả hai chức năng giao thức đều là tùy chọn và bạn có thể sử dụng chúng theo ý muốn.

colorPickerViewControllerDidFinish(_:) Chức năng được sử dụng để nhận lệnh gọi lại sau khi người dùng đã hoàn thành hành động chọn màu và muốn quay lại màn hình trước đó.

colorPickerViewControllerDidSelectColor(_:) Được sử dụng để nhận lệnh gọi lại trên mỗi lựa chọn màu được thực hiện trong Bộ chọn màu.

Vì vậy, đây là cách delegate nhận dữ liệu đầu vào của người dùng.

Cách 2

Bây giờ hãy xem cách chúng ta chọn màu với Combine.

Cách này thì không còn cần extension, cũng như không cần đặt delegate trong changeBackground hàm hành động.

Hãy bắt đầu bằng việc thêm import Combine vào đầu ViewController.swift tệp của bạn để chúng ta có quyền truy cập vào các đối tượng của Combinekhung.

Tiếp theo, khớp mã của bạn với mã hiển thị bên dưới.

// Global declaration, to keep the subscription alive.
var cancellable: AnyCancellable?

@IBAction func changeBackground(_ sender: Any) {
 
 let picker = UIColorPickerViewController()
 picker.selectedColor = self.view.backgroundColor!
 
 //  Subscribing selectedColor property changes.
 self.cancellable = picker.publisher(for: \.selectedColor)
     .sink { color in
         
         //  Changing view color on main thread.
         DispatchQueue.main.async {
             self.view.backgroundColor = color
         }
     }
 
 self.present(picker, animated: true, completion: nil)
}

Chúng tôi đã khai báo một biến toàn cục để tiếp tục nhận các thay đổi được xuất bản bởi Publisher, ngay cả khi changeBackground hàm không nằm trong phạm vi.

Tiếp theo, thay đổi mà chúng ta đã thực hiện trong changeBackground hàm là đăng ký thuộc selectedColor tính với sự trợ giúp của KeyPath.

Đến đây thì bạn có thể chạy thử, nhấn vào button để có thể chọn màu bạn muốn cho màu nền.

Với sự trợ giúp của Combine, chúng tôi có thể giảm nhu cầu về chức năng đại biểu và điều này cũng giúp bạn duy trì mã dễ dàng.

Nguồn: https://www.swiftpal.io/articles/how-to-use-uicolorpickerviewcontroller-in-swift