iT邦幫忙

2022 iThome 鐵人賽

DAY 12
0
Mobile Development

從零開始的IOS開發日常系列 第 12

[鐵人賽 Day 12] Swift 調色盤( Slider 練習 )

  • 分享至 

  • xImage
  •  

這篇調色盤的文章主要是來練習 Slider 和 View 的顏色轉換!

Storyboard 拉介面 UI

  • 畫面上方分別放置 3 個 3 原色的 label,分別代表 3 原色所給的值
  • 畫面下方給出三個 TextView,可以直接在 TextView 給出 3 原色的值
  • 在 TextView 下方分別放置 3 個 3 原色的 Slider


開始撰寫程式碼內容

Slider 使用說明

我們必須在屬性設置滑桿的最大值和最小值,才能使用這個元件

設定好之後我們可以在後續的程式碼直接取得 Slider 的值


在滑動 Slider 的同時,要改變背景顏色、 TextView 、 Label

 @IBAction func r_move(_ sender: Any) {
        rl.text="R:"+String(Int(rs.value))
        view.backgroundColor=UIColor(red:CGFloat(rs.value/255),green:CGFloat(gs.value/255),blue:CGFloat(bs.value/255),alpha:1)
        rtf.text = "\(Int(rs.value))"
    }

依此類推將另外 2 個原色的程式碼打上去

我們在改變 TextView 的同時,也要改變 Slider 和 Label

@IBAction func rtf_move(_ sender: Any) {
        if rtf.text == "" || Float(rtf.text!) == nil {
            rtf.text = "255"
        }
        rs.value = Float(rtf.text!)!
        rl.text="R:"+String(Int(rs.value))    view.backgroundColor=UIColor(red:CGFloat(rs.value/255),green:CGFloat(gs.value/255),blue:CGFloat(bs.value/255),alpha:1)
        rtf.text = "\(Int(rs.value))"    
    }

一樣以此類推將另外 2 個原色的程式碼打上去

這樣簡易的調色盤就完成了!


上一篇
[鐵人賽 Day 11] Git ( MAC ) 初入門-2
下一篇
[鐵人賽 Day 13] Swift TabBar 初入門
系列文
從零開始的IOS開發日常30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言