[Swift] Slider사용해보기

Swift에서 제공하는 Slider 컨트롤에 대해 알아보겠습니다.

Slider를 사용하여 해당 뷰의 백그라운드 컬러를 변경하는 어플을 만들어 보겠습니다.

장점으로는 직접 입력하지 않고 Slider조절로 간단하게 값을 변경할 수 있습니다.

---

1. 프로젝트 생성 & Slider도입

Slider도입은 스토리보드 [+] Slider를 입력하여 간단히 사용할 수 있습니다. 

2. 디자인 구성

어플의 디자인을 구성합니다.

(디자인과 제약에 관해서는 자유롭게 진행합니다.)

 

3. Slider설정

Slider의 값을 설정해줍니다. 이번에 만들 어플은 컬러의 RGB 값을 활용하는 것이기 때문에 최소치를 0, 최대치를 255로 지정해 줍니다. 

(저는 초기설정을 하얀색으로 하기 위해 255로 지정해주었습니다.)

Value의 값은 최솟값과 최댓값에 대해서 지정할 수 있는 범위가 변동됩니다.

4. ViewController.swift의 베이스 작성

ViewController의 베이스를 작성해 줍니다.

(IBOutlet, IBAction설정 등)

Slider의 값 변동 이벤트인 Value Changed를 사용합니다.

5. 내부 작성하기

마무리 단계인 내부를 작성합니다. 

class ViewController: UIViewController {

    @IBOutlet weak var changeView: UIView!
    @IBOutlet weak var rLabel: UILabel!
    @IBOutlet weak var gLabel: UILabel!
    @IBOutlet weak var bLabel: UILabel!

    @IBOutlet weak var rSlider: UISlider!
    @IBOutlet weak var gSlider: UISlider!
    @IBOutlet weak var bSlider: UISlider!

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    @IBAction func rSliderChange(_ sender: UISlider) {
        self.rLabel.text = String(Int(rSlider.value))
        self.changeViewBackgroundColor()
    }

    @IBAction func gSliderChange(_ sender: UISlider) {
        self.gLabel.text = String(Int(gSlider.value))
        self.changeViewBackgroundColor()
    }

    @IBAction func bSliderChange(_ sender: UISlider) {
        self.bLabel.text = String(Int(bSlider.value))
        self.changeViewBackgroundColor()
    }

    private func changeViewBackgroundColor() {
        self.changeView.backgroundColor = UIColor(red: CGFloat(rSlider.value / 255.0),
                                                  green: CGFloat(gSlider.value / 255.0),
                                                  blue: CGFloat(bSlider.value / 255.0),
                                                  alpha: 1)
    }
}

여기서 Slider.value는 Float형식이기 때문에 배경색을 지정해 주기 위해서는 CGFloat으로 형 변환을 해주어야 합니다.

그리고 여기서 / 255.0을 한 이유는 UIColor의 RGB설정은 최대 1.0으로 되어 있기 때문입니다.

6. 실행

어플을 실행해 확인해 봅니다.

 

이번 글에서는 Slider컨트롤에 대해 알아보았습니다.

어려운 작업은 아니지만 도움이 되었으며 좋겠습니다.

지적이나 추가사항은 댓글로 알려주시면 감사하겠습니다.

---

환경 

Xcode 11.3

swift 5