-
UI section 1 UIsection 1
더보기import UIKit class ViewController: UIViewController { // UI 요소 private let titleLabel: UILabel = { let label = UILabel() label.text = "Select your coffee:" label.font = .boldSystemFont(ofSize: 25) label.textColor = .black label.translatesAutoresizingMaskIntoConstraints = false return label }() private let segmentedControl: UISegmentedControl = { let segmentedControl = UISegmentedControl(items: ["Espresso - $3", "Latte - $4", "Cappuccino - $5"]) segmentedControl.selectedSegmentIndex = 0 segmentedControl.translatesAutoresizingMaskIntoConstraints = false return segmentedControl }() private let quantityLabel: UILabel = { let label = UILabel() label.text = "Enter quantity:" label.font = .boldSystemFont(ofSize: 25) label.textColor = .black label.translatesAutoresizingMaskIntoConstraints = false return label }() private let textField: UITextField = { let textField = UITextField() textField.placeholder = "수량을 입력해주세요." textField.borderStyle = .roundedRect textField.keyboardType = .numberPad textField.translatesAutoresizingMaskIntoConstraints = false return textField }() private lazy var orderButton: UIButton = { let button = UIButton() button.setTitle("order", for: .normal) button.setTitleColor(.systemBlue, for: .normal) button.translatesAutoresizingMaskIntoConstraints = false button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside) return button }() private let orderedLabel: UILabel = { let label = UILabel() label.text = "You orderd 3 Espresso(s). Total: $9" // 추후 바꾸기 label.textAlignment = .center label.translatesAutoresizingMaskIntoConstraints = false return label }() override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .white // 뷰 생성 [ titleLabel, segmentedControl, quantityLabel, textField, orderButton, orderedLabel ].forEach { view.addSubview($0) } configureUI() } private func configureUI() { // 제약 조건 NSLayoutConstraint.activate([ // 타이틀 라벨 레이아웃 titleLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), titleLabel.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 40), // 세그먼트 컨트롤 레이아웃 segmentedControl.heightAnchor.constraint(equalToConstant: 40), segmentedControl.topAnchor.constraint(equalTo: titleLabel.bottomAnchor, constant: 25), segmentedControl.centerXAnchor.constraint(equalTo: view.centerXAnchor), // 수량 라벨 레이아웃 quantityLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), quantityLabel.topAnchor.constraint(equalTo: segmentedControl.bottomAnchor, constant: 40), // 주문 수량 텍스트 필드 레이아웃 textField.centerXAnchor.constraint(equalTo: view.centerXAnchor), textField.topAnchor.constraint(equalTo: quantityLabel.bottomAnchor, constant: 20), textField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20), // 주문 버튼 레이아웃 orderButton.centerXAnchor.constraint(equalTo: view.centerXAnchor), orderButton.topAnchor.constraint(equalTo: textField.bottomAnchor, constant: 50), // 주문 결과 라벨 레이아웃 orderedLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), orderedLabel.topAnchor.constraint(equalTo: orderButton.bottomAnchor, constant: 50), orderedLabel.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20) ]) } // order button을 눌렀을 때 액션과 이벤트를 담당하는 메서드 // 메뉴당 단가, 선택한 메뉴, 총 금액(메뉴당 단가 * 입력한 수량) @objc private func buttonTapped() { // 각 메뉴의 단가 배열 let prices = [3, 4, 5] // 선택된 세그먼트의 인덱스를 가져와서 해당하는 메뉴의 단가를 가져옴 let selectedMenuIndex = segmentedControl.selectedSegmentIndex // 선택된 커피 : 옵셔널 체이닝이나 널 병합 연산자라고 불리며, 옵셔널 값이 nil일 경우 대체할 기본 값을 설정 let selectedMenu = segmentedControl.titleForSegment(at: selectedMenuIndex)?.components(separatedBy: " - ").first ?? "Unknown" let menuPrice = prices[selectedMenuIndex] // 텍스트 필드에서 입력된 수량 가져오기 guard let quantityText = textField.text, let quantity = Int(quantityText) else { return } // totalPrice 구하기 let totalPrice = menuPrice * quantity // buttonTapped 후 이벤트로 결과값 문구 출력 // 디버깅용 print("You ordered \(quantity) \(selectedMenu)(s). Total Price: $\(totalPrice).") // 화면에 띄우기 orderedLabel.text = "You ordered \(quantity) \(selectedMenu)(s). Total Price: $\(totalPrice)." } }튜터님
더보기class ViewController: UIViewController { // UI 요소 선언 let coffeeLabel: UILabel = { let label = UILabel() label.translatesAutoresizingMaskIntoConstraints = false label.text = "Select your coffee:" label.font = UIFont.systemFont(ofSize: 18, weight: .bold) label.textAlignment = .center return label }() let coffeeSegmentedControl: UISegmentedControl = { let items = ["Espresso - $3", "Latte - $4", "Cappuccino - $5"] let segmentedControl = UISegmentedControl(items: items) segmentedControl.translatesAutoresizingMaskIntoConstraints = false segmentedControl.selectedSegmentIndex = 0 return segmentedControl }() let quantityLabel: UILabel = { let label = UILabel() label.translatesAutoresizingMaskIntoConstraints = false label.text = "Enter quantity:" label.font = UIFont.systemFont(ofSize: 18, weight: .bold) label.textAlignment = .center return label }() let quantityTextField: UITextField = { let textField = UITextField() textField.translatesAutoresizingMaskIntoConstraints = false textField.placeholder = "Quantity" textField.borderStyle = .roundedRect textField.keyboardType = .numberPad return textField }() let orderButton: UIButton = { let button = UIButton(type: .system) button.translatesAutoresizingMaskIntoConstraints = false button.setTitle("Order", for: .normal) button.addTarget(self, action: #selector(orderButtonTapped), for: .touchUpInside) return button }() let resultLabel: UILabel = { let label = UILabel() label.translatesAutoresizingMaskIntoConstraints = false label.text = "Your order will appear here." label.textAlignment = .center label.numberOfLines = 0 return label }() override func viewDidLoad() { super.viewDidLoad() // 뷰 설정 view.backgroundColor = .white // 서브 뷰 추가 view.addSubview(coffeeLabel) view.addSubview(coffeeSegmentedControl) view.addSubview(quantityLabel) view.addSubview(quantityTextField) view.addSubview(orderButton) view.addSubview(resultLabel) // 레이아웃 설정 setupLayout() } func setupLayout() { NSLayoutConstraint.activate([ // 커피 레이블 레이아웃 coffeeLabel.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 40), coffeeLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), // 세그먼트 컨트롤 레이아웃 coffeeSegmentedControl.topAnchor.constraint(equalTo: coffeeLabel.bottomAnchor, constant: 20), coffeeSegmentedControl.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20), coffeeSegmentedControl.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20), // 수량 레이블 레이아웃 quantityLabel.topAnchor.constraint(equalTo: coffeeSegmentedControl.bottomAnchor, constant: 20), quantityLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), // 수량 텍스트 필드 레이아웃 quantityTextField.topAnchor.constraint(equalTo: quantityLabel.bottomAnchor, constant: 10), quantityTextField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20), quantityTextField.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20), // 주문 버튼 레이아웃 orderButton.topAnchor.constraint(equalTo: quantityTextField.bottomAnchor, constant: 20), orderButton.centerXAnchor.constraint(equalTo: view.centerXAnchor), // 결과 레이블 레이아웃 resultLabel.topAnchor.constraint(equalTo: orderButton.bottomAnchor, constant: 20), resultLabel.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20), resultLabel.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20) ]) } @objc func orderButtonTapped() { let coffeePrices = [3, 4, 5] let selectedCoffeeIndex = coffeeSegmentedControl.selectedSegmentIndex let selectedCoffee = coffeeSegmentedControl.titleForSegment(at: selectedCoffeeIndex)?.components(separatedBy: " - ").first ?? "Unknown" let pricePerCoffee = coffeePrices[selectedCoffeeIndex] guard let quantityText = quantityTextField.text, let quantity = Int(quantityText), quantity > 0 else { resultLabel.text = "Please enter a valid quantity." return } let totalPrice = pricePerCoffee * quantity resultLabel.text = "You ordered \(quantity) \(selectedCoffee)(s). Total: $\(totalPrice)." } }UIsection 2까지 구현
UI section 2 더보기// // ViewController.swift // basicUIPractice // // Created by 단예진 on 7/9/24. // import UIKit class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource { // UI 요소 private let titleLabel: UILabel = { let label = UILabel() label.text = "Select your coffee:" label.font = .boldSystemFont(ofSize: 25) label.textColor = .black label.translatesAutoresizingMaskIntoConstraints = false return label }() private let segmentedControl: UISegmentedControl = { let segmentedControl = UISegmentedControl(items: ["Espresso - $3", "Latte - $4", "Cappuccino - $5"]) segmentedControl.selectedSegmentIndex = 0 segmentedControl.translatesAutoresizingMaskIntoConstraints = false return segmentedControl }() private let quantityLabel: UILabel = { let label = UILabel() label.text = "Enter quantity:" label.font = .boldSystemFont(ofSize: 25) label.textColor = .black label.translatesAutoresizingMaskIntoConstraints = false return label }() private let textField: UITextField = { let textField = UITextField() textField.placeholder = "수량을 입력해주세요." textField.borderStyle = .roundedRect textField.keyboardType = .numberPad textField.translatesAutoresizingMaskIntoConstraints = false return textField }() private lazy var orderButton: UIButton = { let button = UIButton() button.setTitle("order", for: .normal) button.setTitleColor(.systemBlue, for: .normal) button.translatesAutoresizingMaskIntoConstraints = false button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside) return button }() // private let orderedLabel: UILabel = { // let label = UILabel() // label.text = "You orderd 3 Espresso(s). Total: $9" // 추후 바꾸기 // label.textAlignment = .center // label.translatesAutoresizingMaskIntoConstraints = false // return label // }() private let tableView: UITableView = { let tableView = UITableView() tableView.translatesAutoresizingMaskIntoConstraints = false tableView.register(UITableViewCell.self, forCellReuseIdentifier: "orderCell") return tableView }() private let totalLabel: UILabel = { let label = UILabel() label.text = "Total: $0" label.textColor = .black label.textAlignment = .center label.font = .boldSystemFont(ofSize: 30) label.translatesAutoresizingMaskIntoConstraints = false return label }() private var orders: [(coffee: String, quantity: Int, price: Int)] = [] override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .white // 테이블뷰 델리게이트 및 데이터소스 설정 tableView.delegate = self tableView.dataSource = self // 뷰 생성 [ titleLabel, segmentedControl, quantityLabel, textField, orderButton, // orderedLabel, tableView, totalLabel ].forEach { view.addSubview($0) } configureUI() } private func configureUI() { NSLayoutConstraint.activate([ // titleLabel 레이아웃 titleLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), titleLabel.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 40), // segmentedControl 레이아웃 segmentedControl.topAnchor.constraint(equalTo: titleLabel.bottomAnchor, constant: 20), segmentedControl.centerXAnchor.constraint(equalTo: view.centerXAnchor), segmentedControl.widthAnchor.constraint(equalToConstant: 300), // quantityLabel 레이아웃 quantityLabel.topAnchor.constraint(equalTo: segmentedControl.bottomAnchor, constant: 40), quantityLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), // textField 레이아웃 textField.topAnchor.constraint(equalTo: quantityLabel.bottomAnchor, constant: 20), textField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20), textField.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20), // orderButton 레이아웃 orderButton.topAnchor.constraint(equalTo: textField.bottomAnchor, constant: 50), orderButton.centerXAnchor.constraint(equalTo: view.centerXAnchor), // tableView 레이아웃 tableView.topAnchor.constraint(equalTo: orderButton.bottomAnchor, constant: 20), tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor), tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor), tableView.bottomAnchor.constraint(equalTo: totalLabel.topAnchor, constant: -20), // totalLabel 레이아웃 totalLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), totalLabel.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -20) ]) } // order button을 눌렀을 때 액션과 이벤트를 담당하는 메서드 // 메뉴당 단가, 선택한 메뉴, 총 금액(메뉴당 단가 * 입력한 수량) @objc private func buttonTapped() { guard let quantityText = textField.text, let quantity = Int(quantityText) else { print("수량이 올바르게 입력되지 않았습니다.") return } // 각 메뉴의 단가 배열 let prices = [3, 4, 5] // 선택된 세그먼트의 인덱스를 가져와서 해당하는 메뉴의 단가를 가져옴 let selectedMenuIndex = segmentedControl.selectedSegmentIndex // 선택된 커피 : 옵셔널 체이닝이나 널 병합 연산자라고 불리며, 옵셔널 값이 nil일 경우 대체할 기본 값을 설정 let selectedMenu = segmentedControl.titleForSegment(at: selectedMenuIndex)?.components(separatedBy: " - ").first ?? "Unknown" let menuPrice = prices[selectedMenuIndex] // 텍스트 필드에서 입력된 수량 가져오기 guard let quantityText = textField.text, let quantity = Int(quantityText) else { return } // totalPrice 구하기 let totalPrice = menuPrice * quantity // 주문 내역에 추가 let order = (coffee: selectedMenu, quantity: quantity, price: totalPrice) orders.append(order) // buttonTapped 후 이벤트로 결과값 문구 출력 // 디버깅용 print("You ordered \(quantity) \(selectedMenu)(s). Total Price: $\(totalPrice).") // 화면에 띄우기 // orderedLabel.text = "You ordered \(quantity) \(selectedMenu)(s). Total Price: $\(totalPrice)." // 테이블뷰 데이터 리로드 및 총금액 업데이트 tableView.reloadData() updateTotalLabel() } func updateTotalLabel() { let totalAmount = orders.reduce(0) { $0 + $1.price } totalLabel.text = "Total: $\(totalAmount)" } // 테이블뷰 데이터 소스 메서드 func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return orders.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "orderCell", for: indexPath) let order = orders[indexPath.row] cell.textLabel?.text = "\(order.quantity) x \(order.coffee) - $\(order.price)" return cell } }튜터님
더보기class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource { // UI 요소 선언 let coffeeLabel: UILabel = { let label = UILabel() label.translatesAutoresizingMaskIntoConstraints = false label.text = "Select your coffee:" label.font = UIFont.systemFont(ofSize: 18, weight: .bold) label.textAlignment = .center return label }() let coffeeSegmentedControl: UISegmentedControl = { let items = ["Espresso - $3", "Latte - $4", "Cappuccino - $5"] let segmentedControl = UISegmentedControl(items: items) segmentedControl.translatesAutoresizingMaskIntoConstraints = false segmentedControl.selectedSegmentIndex = 0 return segmentedControl }() let quantityLabel: UILabel = { let label = UILabel() label.translatesAutoresizingMaskIntoConstraints = false label.text = "Enter quantity:" label.font = UIFont.systemFont(ofSize: 18, weight: .bold) label.textAlignment = .center return label }() let quantityTextField: UITextField = { let textField = UITextField() textField.translatesAutoresizingMaskIntoConstraints = false textField.placeholder = "Quantity" textField.borderStyle = .roundedRect textField.keyboardType = .numberPad return textField }() let orderButton: UIButton = { let button = UIButton(type: .system) button.translatesAutoresizingMaskIntoConstraints = false button.setTitle("Order", for: .normal) button.addTarget(self, action: #selector(orderButtonTapped), for: .touchUpInside) return button }() let tableView: UITableView = { let tableView = UITableView() tableView.translatesAutoresizingMaskIntoConstraints = false tableView.register(UITableViewCell.self, forCellReuseIdentifier: "orderCell") return tableView }() let totalLabel: UILabel = { let label = UILabel() label.translatesAutoresizingMaskIntoConstraints = false label.text = "Total: $0" label.font = UIFont.systemFont(ofSize: 18, weight: .bold) label.textAlignment = .center return label }() var orders: [(coffee: String, quantity: Int, price: Int)] = [] override func viewDidLoad() { super.viewDidLoad() // 뷰 설정 view.backgroundColor = .white // 테이블 뷰 델리게이트 및 데이터 소스 설정 tableView.delegate = self tableView.dataSource = self // 서브 뷰 추가 view.addSubview(coffeeLabel) view.addSubview(coffeeSegmentedControl) view.addSubview(quantityLabel) view.addSubview(quantityTextField) view.addSubview(orderButton) view.addSubview(tableView) view.addSubview(totalLabel) // 레이아웃 설정 setupLayout() } func setupLayout() { NSLayoutConstraint.activate([ // 커피 레이블 레이아웃 coffeeLabel.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 20), coffeeLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), // 세그먼트 컨트롤 레이아웃 coffeeSegmentedControl.topAnchor.constraint(equalTo: coffeeLabel.bottomAnchor, constant: 10), coffeeSegmentedControl.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20), coffeeSegmentedControl.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20), // 수량 레이블 레이아웃 quantityLabel.topAnchor.constraint(equalTo: coffeeSegmentedControl.bottomAnchor, constant: 20), quantityLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor), // 수량 텍스트 필드 레이아웃 quantityTextField.topAnchor.constraint(equalTo: quantityLabel.bottomAnchor, constant: 10), quantityTextField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20), quantityTextField.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20), // 주문 버튼 레이아웃 orderButton.topAnchor.constraint(equalTo: quantityTextField.bottomAnchor, constant: 20), orderButton.centerXAnchor.constraint(equalTo: view.centerXAnchor), // 테이블 뷰 레이아웃 tableView.topAnchor.constraint(equalTo: orderButton.bottomAnchor, constant: 20), tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor), tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor), tableView.bottomAnchor.constraint(equalTo: totalLabel.topAnchor, constant: -10), // 총 금액 레이블 레이아웃 totalLabel.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -20), totalLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor) ]) } @objc func orderButtonTapped() { let coffeePrices = [3, 4, 5] let selectedCoffeeIndex = coffeeSegmentedControl.selectedSegmentIndex let selectedCoffee = coffeeSegmentedControl.titleForSegment(at: selectedCoffeeIndex)?.components(separatedBy: " - ").first ?? "Unknown" let pricePerCoffee = coffeePrices[selectedCoffeeIndex] guard let quantityText = quantityTextField.text, let quantity = Int(quantityText), quantity > 0 else { showAlert(message: "Please enter a valid quantity.") return } let totalPrice = pricePerCoffee * quantity orders.append((coffee: selectedCoffee, quantity: quantity, price: totalPrice)) tableView.reloadData() updateTotalLabel() } func showAlert(message: String) { let alert = UIAlertController(title: "Error", message: message, preferredStyle: .alert) alert.addAction(UIAlertAction(title: "OK", style: .default, handler: nil)) present(alert, animated: true, completion: nil) } func updateTotalLabel() { let totalAmount = orders.reduce(0) { $0 + $1.price } totalLabel.text = "Total: $\(totalAmount)" } // 테이블 뷰 데이터 소스 메서드 func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return orders.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "orderCell", for: indexPath) let order = orders[indexPath.row] cell.textLabel?.text = "\(order.quantity) x \(order.coffee) - $\(order.price)" return cell } // 테이블 뷰 델리게이트 메서드 func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { tableView.deselectRow(at: indexPath, animated: true) } }