前文

昨天教大家要如何拉約束 那今天終於要開始製作調色盤了
先給大家看一下最後的完成品

第一步

我們將各個UI元件進行綁定 才可以知道我們的Code是要控制哪一個元件
這邊我們可以分成兩個視窗 對著UI元件按下control 拉到左邊
再定義好變數的名稱就可以囉

然後設置textfield的text初始值是 0

第二步

一樣我們要對UI進行綁定
這邊注意 Connection 需要是Action 代表我的UI有動作才執行

先到 xib 把slider的最大值設成255

點擊slider右邊就可以設定了

我們要讓 View 可以被 slider控制顏色

這邊要注意是要每個slider的值是要除255

因為對於ＲＧＢ取值的範圍通常是 0 ~ 255

然後alpha意思是顏色的透明度

1表示 完全不透明 0表示 完全透明

第三步

再來我們也要Textfield可以控制View的顏色

這邊我們要使用if let 判斷他有沒有可能是 nil

這邊如果不知道nil是什麼意思的可以看一下我前幾天的文章噢

然後 textfield.text 回傳的是一個 String 要把它轉成 Float

我們可以用組合鍵 command + R 去看模擬

第四步

讓 Slider 可以透過 Textfield 去看現在拉的值是多少

將slider的value轉成Int 確保我們要的是 0 ~ 255

第五步

最後要讓textfield可以去控制slider的值

把textfield.text轉成float

在使用.setValue() 這個function改變slider值

然後animated ＝ true 表示想要使用動畫的效果

結語

今天教各位要怎麼刻一個簡易的調色盤

上面的Code 還是可以做優化的 明天會教大家如何去優化