20210713 BMI calculator project -1

 

지금까지는 Main.storyboard에 1개의 스크린만 있는 어플만 다루었다면

BMI caculator는 2개의 스크린이 존재한다.

 

 

BMI를 측정하기 위한 데이터를 입력하는 화면과 결과화면이 따로 존재한다.

입력화면에는 키와 몸무게, 계산버튼이 있고 결과화면에는 BMI 결과가 나타나게 할 것이며, 재측정버튼이 있다.

 

 

먼저 입력화면을 보면

키와 몸무게를 입력하는 곳에 이전까지는 사용하지 않았던 'UISlider'가 있는 것을 확인할 수 있다.

 

Library - 'Slider'으로 등록할 수 있고,

Attribute inspector에서 MIN/MAX 값을 정할 수 있다.

 

 

---

 

Challenge )

 

Height Slider/Weight Slider를 IBAction(name: height slider / weight slider)으로 연결시켜서,

슬라이더를 이동시키면 이동된 위치에 해당하는 값이 출력되도록 만들 것

 

 

 

    @IBOutlet weak var heightValue: UILabel!
    @IBOutlet weak var weightValue: UILabel!
    
    @IBAction func heightslider(_ sender: UISlider) {
        heightValue.text = "\(sender.value)"
        
    }
    @IBAction func weightslider(_ sender: UISlider) {
        weightValue.text = "\(sender.value)"
    }

 

 

위와 같이 연결을 만들고 코드를 입력해서

우선 의도한대로 슬라이더를 움직였을 때 우측 상단에 해당 값이 출력되도록 만들었다.

 

 

 

하지만 너무 많은 자릿수가 출력되기 때문에...

키는 소수점 이하 2자리까지만, 몸무게는 소수점 부분을 제외하고 출력되도록 수정했다.

 

'String formatting' 방법을 사용해서 코드를 수정했다.

 

 

    @IBAction func heightSlider(_ sender: UISlider) {
        heightValue.text = String(format: "%.2f", sender.value)
        
    }
    @IBAction func weightSlider(_ sender: UISlider) {
        weightValue.text = String(format: "%.0f", sender.value)
    }

 

위와 같이 IBAction 코드블럭을 수정했고,

원하는 자릿수만큼만 출력되는 것을 확인했다.

 

단위(m, kg)는 어느새 사라져있어서...

단위를 뒤에 붙여줄 수 있도록 코드를 수정했다.

 

 

    @IBAction func heightSlider(_ sender: UISlider) {
        heightValue.text =  String(format: "%.2f", sender.value) + "m"
// 아래와 동일
// let height = String(format: "%.2f", sender.value)
// heightValue.text = "\(height)m"
        
        
    }
    @IBAction func weightSlider(_ sender: UISlider) {
        weightValue.text = String(format: "%.0f", sender.value) + "Kg"
// 아래와 동일
// let weight = String(format: "%.0f", sender.value)
// weightValue.text = "\(weight)Kg"
        
    }

 

 

---