일전에 배운 화면 전환과 데이터 전달을 통해
간단한 BMI 계산기를 만듦
모든 UI는 코드로 작성
BMI 계산기는 간단한 로직으로 구성
사용자가 키와 몸무게를 입력 -> 계산 버튼 누름 ->
화면전환과 동시에 계산된 값을 전환된 화면에 보여줌
여기서 화면 전환, 데이터전달과 BMI 계산 관련된 함수는 각각 구현할 것
1개의 함수는 1개의 기능만 하도록 할 것
데이터를 전달할 때는 변수를 통해서 할 것
BMI 계산식
BMI 계산 함수를 통해 반환된 bmi를 통해
bmi 치수에 따른 글자 배경색과 문구를 설정
DetailViewController에 데이터를 전달할 때 사용할 변수
DetailVeiwController로 화면전환하면서 데이터 전달하는 함수
ViewController에서 온 데이터를 DetailViewController에서 받기 위한 변수
DetailViewController 파일에 결과값 표시
ViewController.swift
import UIKit
class ViewController: UIViewController {
var bmi: Double?
var bmiBackgroundColor: UIColor?
var bmiText: String?
private let mainTitle: UILabel = {
let label = UILabel()
label.text = "BMI 계산기"
label.font = .systemFont(ofSize: 35, weight: .bold)
label.textColor = .label
label.translatesAutoresizingMaskIntoConstraints = false
return label
}()
private let heightLabel: UILabel = {
let label = UILabel()
label.text = "키"
label.font = .systemFont(ofSize: 22, weight: .bold)
label.translatesAutoresizingMaskIntoConstraints = false
return label
}()
private let heightTextField: UITextField = {
let textField = UITextField()
textField.borderStyle = .bezel
textField.font = .systemFont(ofSize: 22, weight: .regular)
textField.translatesAutoresizingMaskIntoConstraints = false
return textField
}()
private let weightLabel: UILabel = {
let label = UILabel()
label.text = "몸무게"
label.font = .systemFont(ofSize: 22, weight: .bold)
label.translatesAutoresizingMaskIntoConstraints = false
return label
}()
private let weightTextField: UITextField = {
let textField = UITextField()
textField.borderStyle = .bezel
textField.font = .systemFont(ofSize: 22, weight: .regular)
textField.translatesAutoresizingMaskIntoConstraints = false
return textField
}()
private lazy var calculateButton: UIButton = {
let button = UIButton(type: UIButton.ButtonType.custom)
button.translatesAutoresizingMaskIntoConstraints = false
button.setTitle("계산", for: .normal)
button.titleLabel?.font = UIFont.systemFont(ofSize: 20, weight: .bold)
button.setTitleColor(.label, for: .normal)
button.tintColor = .label
button.layer.masksToBounds = true
button.layer.cornerRadius = 5
button.backgroundColor = .systemCyan
button.addTarget(self, action: #selector(moveToDetailButtonTapped), for: .touchUpInside)
return button
}()
@objc func moveToDetailButtonTapped() {
let detailVC = DetailViewController()
detailVC.modalPresentationStyle = .fullScreen
guard let height = heightTextField.text,
let weight = weightTextField.text else { return }
bmi = calculateBMI(height: height, weight: weight)
bmiBackgroundColor = getBackgroundColor()
bmiText = getBMIAdviceString()
detailVC.bmiResult = bmi
detailVC.bmiBackground = bmiBackgroundColor
detailVC.bmiTitleText = bmiText
present(detailVC, animated: true)
}
func calculateBMI(height: String, weight: String) -> Double {
guard let height = Double(height),
let weight = Double(weight) else { return 0.0 }
var bmi = weight / (height * height) * 10000
bmi = round(bmi * 10) / 10
print("BMI결과값: \(bmi)")
return bmi
}
// 색깔 얻는 메서드
func getBackgroundColor() -> UIColor {
guard let bmi = bmi else { return UIColor.black }
switch bmi {
case ..<18.6:
return UIColor.systemGreen
case 18.6..<23.0:
return UIColor.systemPurple
case 23.0..<25.0:
return UIColor.systemPink
case 25.0..<30.0:
return UIColor.systemOrange
case 30.0...:
return UIColor.systemRed
default:
return UIColor.black
}
}
// 문자열 얻는 메서드
func getBMIAdviceString() -> String {
guard let bmi = bmi else { return "" }
switch bmi {
case ..<18.6:
return "저체중"
case 18.6..<23.0:
return "표준"
case 23.0..<25.0:
return "과체중"
case 25.0..<30.0:
return "중도비만"
case 30.0...:
return "고도비만"
default:
return ""
}
}
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
view.backgroundColor = .systemBackground
view.addSubview(mainTitle)
view.addSubview(heightLabel)
view.addSubview(heightTextField)
view.addSubview(weightLabel)
view.addSubview(weightTextField)
view.addSubview(calculateButton)
configureConstraints()
}
func configureConstraints() {
let mainTitleConstraints = [
mainTitle.centerXAnchor.constraint(equalTo: view.centerXAnchor),
mainTitle.topAnchor.constraint(equalTo: view.topAnchor, constant: 150)
]
let heightLabelConstraints = [
heightLabel.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 40),
heightLabel.topAnchor.constraint(equalTo: mainTitle.bottomAnchor, constant: 30)
]
let heightTextFieldConstraints = [
heightTextField.centerYAnchor.constraint(equalTo: heightLabel.centerYAnchor),
heightTextField.leadingAnchor.constraint(equalTo: heightLabel.trailingAnchor, constant: 15),
heightTextField.widthAnchor.constraint(equalToConstant: 300)
]
let weightLabelConstraints = [
weightLabel.trailingAnchor.constraint(equalTo: heightLabel.trailingAnchor),
weightLabel.topAnchor.constraint(equalTo: heightLabel.bottomAnchor, constant: 20)
]
let weightTextFieldConstraints = [
weightTextField.leadingAnchor.constraint(equalTo: weightLabel.trailingAnchor, constant: 15),
weightTextField.centerYAnchor.constraint(equalTo: weightLabel.centerYAnchor),
weightTextField.widthAnchor.constraint(equalToConstant: 300)
]
let calculateButtonConstraints = [
calculateButton.leadingAnchor.constraint(equalTo: weightLabel.leadingAnchor),
calculateButton.topAnchor.constraint(equalTo: weightLabel.bottomAnchor, constant: 20),
calculateButton.trailingAnchor.constraint(equalTo: weightTextField.trailingAnchor)
]
NSLayoutConstraint.activate(heightLabelConstraints)
NSLayoutConstraint.activate(mainTitleConstraints)
NSLayoutConstraint.activate(heightTextFieldConstraints)
NSLayoutConstraint.activate(weightLabelConstraints)
NSLayoutConstraint.activate(weightTextFieldConstraints)
NSLayoutConstraint.activate(calculateButtonConstraints)
}
}
DetailViewController.swift
import UIKit
class DetailViewController: UIViewController {
var bmiResult: Double? = 0
var bmiBackground: UIColor?
var bmiTitleText: String?
private let resultTitleLabel: UILabel = {
let label = UILabel()
label.translatesAutoresizingMaskIntoConstraints = false
label.text = "결과"
label.font = .systemFont(ofSize: 30, weight: .bold)
return label
}()
private let bmiText: UILabel = {
let label = UILabel()
label.translatesAutoresizingMaskIntoConstraints = false
label.text = "과체중"
label.font = .systemFont(ofSize: 30, weight: .bold)
label.textColor = .systemRed
return label
}()
private let bmiLabel: UILabel = {
let label = UILabel()
label.translatesAutoresizingMaskIntoConstraints = false
label.text = "BMI 결과값 표시"
label.font = .systemFont(ofSize: 30, weight: .bold)
label.textColor = .systemRed
return label
}()
private let backToMainButton: UIButton = {
let button = UIButton(type: .custom)
button.translatesAutoresizingMaskIntoConstraints = false
button.setTitle("Back", for: .normal)
button.setTitleColor(.label, for: .normal)
button.titleLabel?.font = .systemFont(ofSize: 22, weight: .bold)
button.addTarget(self, action: #selector(backToMainButtonTapped), for: .touchUpInside)
return button
}()
@objc func backToMainButtonTapped() {
dismiss(animated: true)
}
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .systemBackground
bmiLabel.text = "\(bmiResult!)"
bmiLabel.backgroundColor = bmiBackground
bmiText.text = bmiTitleText
view.addSubview(resultTitleLabel)
view.addSubview(bmiLabel)
view.addSubview(bmiText)
view.addSubview(backToMainButton)
configureConstraints()
}
func configureConstraints() {
let backToMainButtonConstraints = [
backToMainButton.centerXAnchor.constraint(equalTo: view.centerXAnchor),
backToMainButton.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -150)
]
let resultTitleLabelConstraints = [
resultTitleLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor),
resultTitleLabel.topAnchor.constraint(equalTo: view.topAnchor, constant: 200)
]
let bmiTextConstraints = [
bmiText.centerXAnchor.constraint(equalTo: view.centerXAnchor),
bmiText.topAnchor.constraint(equalTo: bmiLabel.bottomAnchor, constant: 20)
]
let bmiLabelConstraints = [
bmiLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor),
bmiLabel.topAnchor.constraint(equalTo: resultTitleLabel.bottomAnchor, constant: 30)
]
NSLayoutConstraint.activate(backToMainButtonConstraints)
NSLayoutConstraint.activate(resultTitleLabelConstraints)
NSLayoutConstraint.activate(bmiLabelConstraints)
NSLayoutConstraint.activate(bmiTextConstraints)
}
}
'UIKIT' 카테고리의 다른 글
테이블 만들기 (0) | 2024.01.21 |
---|---|
네비게이션컨트롤러 및 네비게이션바 (0) | 2024.01.18 |
화면 이동과 데이터 전달 1편 (0) | 2024.01.14 |
ViewController의 라이프 사이클 (1) | 2024.01.10 |
TabBar 만들어보기 (기본 설정) (0) | 2024.01.10 |