241114 iOS프로그래밍기초 11주차
Outlet과 Action 추가하기
BMI를 계산하는 소스를 작성한 뒤, Simulator로 돌려보면 console창에 결과가 뜨는 것을 알 수 있다.
위의 코드에 다음과 같은 코드를 추가하여 Simulator화면의 결과창에 결과가 뜨도록 수정한 모습
lblResult.text = "BMI:\(shortenedBmi), 판정:\(body)"
아래 코드에서 느낌표(!)가 두 번 사용되는 이유
let height = Double(txtHeight.text!)!
let weight = Double(txtWeight.text!)!
1. 첫 번째 느낌표 (`txtHeight.text!`):
- `UITextField`의 `text` 속성은 옵셔널 문자열(`String?`)입니다.
- 첫 번째 느낌표는 이 옵셔널 문자열을 강제 언래핑합니다.
2. 두 번째 느낌표 (`Double(...)!`):
- `Double()` 이니셜라이저는 문자열을 Double로 변환할 때 옵셔널 Double(`Double?`)을 반환합니다.
- 두 번째 느낌표는 이 옵셔널 Double을 강제 언래핑합니다.
코드의 문제점이라고 할 수 있던, 값을 넣지 않았을 때 오류가 나는 부분을 다음과 같이 수정하여 다시 작성하였다.
실행화면
판정 결과에 따라 출력 레이블에 다른 배경색 지정
최종적인 소스
import UIKit
class ViewController: UIViewController {
@IBOutlet weak var txtHeight: UITextField!
@IBOutlet weak var txtWeight: UITextField!
@IBOutlet weak var lblResult: UILabel!
@IBAction func calcBmi(_ sender: UIButton) {
if txtHeight.text == "" || txtWeight.text == "" {
// 입력값이 비어있는지 확인
lblResult.textColor = .yellow
lblResult.text = "키와 체중을 입력하세요!"
return
} else {
let height = Double(txtHeight.text!)! // 강제 언래핑 사용 - 주의 필요
let weight = Double(txtWeight.text!)! // 강제 언래핑 사용 - 주의 필요
print(height, weight)
let bmi = weight / (height * height * 0.0001) // BMI 계산 (키를 m 단위로 변환)
let shortenedBmi = String(format: "%.1f", bmi) // BMI를 소수점 첫째 자리까지 표시
var body = ""
var color = UIColor.white
// BMI 값에 따른 비만도 판정 및 색상 설정
if bmi >= 40 {
color = UIColor(displayP3Red: 1.0, green: 0, blue: 0, alpha: 1)
lblResult.textColor = .white
body = "3단계 비만"
}
else if bmi >= 30 && bmi < 40 {
color = UIColor(displayP3Red: 0.7, green: 0, blue: 0, alpha: 1)
lblResult.textColor = .white
body = "2단계 비만"
}
else if bmi >= 25 && bmi < 30 {
color = UIColor(displayP3Red: 0.4, green: 0, blue: 0, alpha: 1)
body = "1단계 비만"
}
else if bmi >= 18.5 && bmi < 25 {
color = UIColor(displayP3Red: 0, green: 0, blue: 1, alpha: 1)
lblResult.textColor = .white
body = "정상"
}
else {
color = UIColor(displayP3Red: 1, green: 1, blue: 0, alpha: 1)
lblResult.textColor = .black
body = "저체중"
}
// 결과 레이블의 모서리를 둥글게 설정
lblResult.clipsToBounds = true
lblResult.layer.cornerRadius = 10
// 결과 레이블의 배경색 설정
lblResult.backgroundColor = color
// 결과 텍스트 설정
lblResult.text = "BMI:\(shortenedBmi), 판정:\(body)"
}
}
override func viewDidLoad() {
super.viewDidLoad()
// 뷰가 로드된 후 추가적인 설정을 할 수 있음
}
}
segment controller와 switch를 추가하고,
메인 스토리보드에 view를 클릭하고 Editor -> Embed in -> Tab Bar Controller를 클릭하게되면 아래 화면처럼 뜬다.
Tab Bar item 이미지 변경하는 방법
새로운 View Controller를 추가 후, Tab Bar Controller와 연결한 모습
Add to targets 부분에 꼭 체크가 되어있어야한다.
참고자료 :
- 한성현 교수님 수업자료