UISliderでUIColorのRGBの値を表示するApp

完成形はこんな感じ

• UILabelとUISliderの色はMain.storyboardで設定してます。

機能説明　

• 画面のUISliderでRGBの値を変化させてViewの.backgroundColorを変えます。

コードと簡単解説

• UISliderの最初の位置を一番左にしたいので、3つのUISliderの.valueを0.00にしています。

• UISliderの最小値はもちろん0（RGBには0~1の値が入ります）なので、3つのUISliderの.minimumValueを0.00にしてます。

• UISliderの最大値はもちろん1（RGBには0~1の値が入ります）なので、3つのUISliderの.maximumValueを1.00にしてます。

• 最初にcolorDebugView.backgroundColor = UIColor.blackなのはUISliderの値が0.00だからです。

ViewController

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var colorDebugView: UIView!
    @IBOutlet weak var redSlider: UISlider!
    @IBOutlet weak var greenSlider: UISlider!
    @IBOutlet weak var blueSlider: UISlider!
    @IBOutlet weak var redValueLabel: UILabel!
    @IBOutlet weak var greenValueLabel: UILabel!
    @IBOutlet weak var blueValueLabel: UILabel!

    let colorConverterModel = ColorConvertModel()

    override func viewDidLoad() {
        super.viewDidLoad()

    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)

        colorDebugView.backgroundColor =  UIColor.black

        redSlider.value = 0.00
        redSlider.minimumValue = 0.00
        redSlider.maximumValue = 1.00

        greenSlider.value = 0.00
        greenSlider.minimumValue = 0.00
        greenSlider.maximumValue = 1.00

        blueSlider.value = 0.00
        blueSlider.minimumValue = 0.00
        blueSlider.maximumValue = 1.00

    }

    @IBAction func redSlide(_ sender: UISlider) {

        colorConverterModel.colorConvert(redValue: CGFloat(sender.value), greenValue: CGFloat(greenSlider.value), blueValue: CGFloat(blueSlider.value), targetView: colorDebugView)

        redValueLabel.text = String(floor(sender.value * 100) / 100)

    }

    @IBAction func greenSlide(_ sender: UISlider) {

        colorConverterModel.colorConvert(redValue: CGFloat(redSlider.value), greenValue: CGFloat(sender.value), blueValue: CGFloat(blueSlider.value), targetView: colorDebugView)

        greenValueLabel.text =  String(floor(sender.value * 100) / 100)

    }

    @IBAction func blueSlide(_ sender: UISlider) {

        colorConverterModel.colorConvert(redValue: CGFloat(redSlider.value), greenValue: CGFloat(greenSlider.value), blueValue: CGFloat(sender.value), targetView: colorDebugView)

        blueValueLabel.text =  String(floor(sender.value * 100) / 100)

    }        
}

• 昨日に引き続き、UIColor(red: CGFloat, green: CGFloat, blue: CGFloat, alpha: CGFloat)を用いて色を変えていきます。

• alphaは1で固定します。

ColorConvertModel

import Foundation
import UIKit

class ColorConvertModel{

    func colorConvert(redValue:CGFloat,greenValue:CGFloat,blueValue:CGFloat,targetView:UIView){

        targetView.backgroundColor = UIColor(red: redValue, green: greenValue, blue: blueValue, alpha: 1)

    }
}

終わり

ご指摘、ご質問などありましたら、コメントまでお願い致します。