實作畫面

我們今天來做關於RGB三原色調色的專案，先給各位看成品圖！
成品圖如下：

元件

首先我們要在 MainViewController.xib 中拉好畫面需要的元件！

• 1 個 View 用來顯示目前的顏色
• 3 個 Label 用來區分 R G B 的顏色的行
• 3 個 Slide 用來調整以及顯示 R G B 分別的顏色數值
• 3 個 TextField 用來調整以及顯示目前的 R G B 分別的顏色數值

接著要設定 UI 元件 的 IBOutlet

[!Important] 記得不是直接打程式而是要從xib拉連結過來！

    // MARK: - IBOutlet
    
    @IBOutlet weak var vRGB: UIView!
    @IBOutlet weak var sldRedValue: UISlider!
    @IBOutlet weak var sldGreenValue: UISlider!
    @IBOutlet weak var sldBlueValue: UISlider!
    @IBOutlet weak var lbRed: UILabel!
    @IBOutlet weak var lbGreen: UILabel!
    @IBOutlet weak var lbBlue: UILabel!
    @IBOutlet weak var txfRedText: UITextField!
    @IBOutlet weak var txfGreenText: UITextField!
    @IBOutlet weak var txfBlueText: UITextField!

代理

接下來我們需要設定元件的 delegate 代理給 MainViewController

    // MARK: - LifeCycle
    
    override func viewDidLoad() {
        super.viewDidLoad()
        txfRedText.delegate = self
        txfGreenText.delegate = self
        txfBlueText.delegate = self
    }