상세 컨텐츠

본문 제목

[코드베이스UI] iOS 입문 개인과제_간단한 계산기 앱 만들기 1~2단계

본문

Lev.1 UILabel로 숫자 라벨 띄우기

import UIKit
import SnapKit

class ViewController: UIViewController {
    
    var numLable = UILabel()
    var viewNum = 12345
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        configureUI()
    }
    
    func configureUI(){
        //속성
        view.backgroundColor = .black
        numLable.backgroundColor = .black
        numLable.textColor = .white
        numLable.text = "\(viewNum)"
        numLable.textAlignment = .right
        numLable.font = .boldSystemFont(ofSize: 60)
        
        [numLable].forEach{view.addSubview($0)}
        
        //AutoLayout
        numLable.snp.makeConstraints {
            $0.leading.trailing.equalToSuperview().inset(30)
            $0.top.equalToSuperview().offset(200)
        }
    }
}

 

 

 


Lev.2 버튼 4개를 모아 가로 정렬 스택뷰 만들기

 

 

button을 가로 스택뷰에 넣기까지가 정말 어려웠다. 

button 4개가 하나의 가로 스택뷰에 들어가기 때문에 

반복문을 사용해 넣어주는 함수를 만들고 싶었다. 

 

버튼을 만들어 주는 makeNumButton 함수에서

가로 스택뷰인 horizontalStackView에 addArrangedSubView로 

만들어진 button을 넣어주는 구조다.

 

그러기 위해서는 horizontalStackView를 만들어주어야 했다. 

 

 

import UIKit
import SnapKit

class ViewController: UIViewController {
    
    var viewNum = 12345
    
    var numLabel = UILabel()
    var buttons: [UIButton] = []
    let buttonNums = ["7", "8", "9", "+"]
    //                   "4", "5", "6", "-",
    //                   "1", "2", "3", "*",
    //                   "AC", "0", "=", "/"]
    
    
    //버튼 한줄을 만들어서 horizontalStackView에 넣어주는 함수
    private func makeNumButton(buttonNums: [String]) {
        for num in buttonNums {
            let button = UIButton()
            //UIButton 속성
            button.setTitle(num, for: .normal)
            button.titleLabel?.font = .boldSystemFont(ofSize: 30)
            button.backgroundColor = UIColor(red: 58/255, green: 58/255, blue: 58/255, alpha: 1.0)
            button.layer.cornerRadius = 40
            horizontalStackView.addArrangedSubview(button)
        }
    }
    
    //
    var horizontalStackView: UIStackView = {
        let stackView = UIStackView()
        stackView.axis = .horizontal
        stackView.backgroundColor = .black
        stackView.spacing = 10
        stackView.distribution = .fillEqually
        return stackView
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        configureUI()
        makeNumButton(buttonNums: buttonNums)
    }
    
    func configureUI(){
        //속성
        view.backgroundColor = .black
        
        numLabel.backgroundColor = .black
        numLabel.textColor = .white
        numLabel.text = "\(viewNum)"
        numLabel.textAlignment = .right
        numLabel.font = .boldSystemFont(ofSize: 60)
        
        
        [numLabel, horizontalStackView].forEach{view.addSubview($0)}
        
        
        //AutoLayout
        numLabel.snp.makeConstraints {
            $0.leading.trailing.equalToSuperview().inset(30)
            $0.top.equalToSuperview().offset(200)
        }
        
        horizontalStackView.snp.makeConstraints {
            $0.height.equalTo(80)
            $0.width.equalTo(350)
            $0.top.equalTo(numLabel.snp.bottom).offset(60)
            $0.centerX.equalToSuperview()
        }
    }

}

 

관련글 더보기