Swift 계산기 앱 만들기

STONE·2024년 9월 27일

Swift_Ios

목록 보기
3/44

주제

Swift Xcode로 아이폰 계산기 앱을 만들어 봅시다

import SwiftUI

// 숫자, 기호 키패드 enum으로 열거
enum ButtonType: String {
    case first = "1", second = "2", third = "3", forth = "4", fifth = "5"
    case sixth = "6", seventh = "7", eighth = "8", nineth = "9", zero = "0"
    case dot = ".", equal = "=", plus = "+", minus = "-", multiple = "X", devide = "/"
    case percent = "%", opposite = "+/-", clear = "C"
    
    // 버튼 컬러 지정
    var backgroundColor: Color {
        switch self {
        case .first, .second, .third, .forth, .fifth, .sixth, .seventh, .eighth, .nineth, .zero, .dot:
            return Color("NumberButton")
        case .plus, .minus, .multiple, .devide, .equal:
            return Color.orange
        case .clear, .opposite, .percent:
            return Color.gray
        }
    }
    
    // text 컬러 지정
    var forgroundColor: Color {
        switch self {
        case .first, .second, .third, .forth, .fifth, .sixth, .seventh, .eighth, .nineth, .zero, .dot:
            return Color.white
        case .plus, .minus, .multiple, .devide, .equal:
            return Color.white
        case .clear, .opposite, .percent:
            return Color.black
        }
    }
}

struct ContentView: View {
    
    // 계산기 처음 값
    @State private var totalNumber: String = "0"
    
    // 버튼 데이터
    private let buttonData: [[ButtonType]] = [
        [ .clear , .opposite , .percent , .devide ],
        [ .seventh , .eighth , .nineth , .multiple ],
        [ .forth , .fifth , .sixth , .minus ],
        [ .first , .second , .third , .plus ],
        [ .zero , .dot , .equal ]
    ]
    
    var body: some View {
        
        ZStack {
            Color.black.ignoresSafeArea(.all)
            
            VStack {
                Spacer()
                
                // 숫자가 표시되는 공간
                HStack {
                    Spacer()
                    Text(totalNumber)
                        .padding()
                        .font(.system(size: 73))
                        .foregroundColor(.white)
                }
                
                // 버튼 생성 반복문
                ForEach(buttonData, id: \.self) { line in
                    HStack {
                        ForEach(line, id: \.self) { row in
                            Button {
                           		// 처음 숫자 입력시 0일때 0 없애고 숫자 넣기
                                if totalNumber == "0" {
                                    if row == .clear {
                                        totalNumber = "0"
                                    } else if row == .plus ||
                                              row == .minus ||
                                              row == .multiple ||
                                              row == .devide {
                                        totalNumber = "Error"
                                    } else {
                                        totalNumber = row.rawValue
                                    }
                                } 
                                // 0이 아닐시 문자열로 숫자 이어 붙이기
                                else {
                                    if row == .clear {
                                        totalNumber = "0"
                                    } else if row == .plus ||
                                                row == .minus ||
                                                row == .multiple ||
                                                row == .devide {
                                        totalNumber = "Error"
                                    } else {
                                        totalNumber += row.rawValue
                                    }
                                }
                            } label: {
                            	// 버튼 디자인
                                Text(row.rawValue)
                                    .frame(width: row == .zero ? 160 : 80, height: 80)
                                    .background(row.backgroundColor)
                                    .cornerRadius(40)
                                    .foregroundColor(row.forgroundColor)
                                    .font(.system(size: 33))
                            }
                        }
                    }
                }
            }
        }
        .padding()
    }
}

#Preview {
    ContentView()
}

진행사항

  • 숫자 버튼 클릭시 해당 숫자 도출 가능
  • C(clear) 버튼 클릭시 0으로 초기화

진행해야 될 것

  • +, -, * 등 사칙연산 기호 기능 만들기
  • 현재 백그라운드컬러가 사각형으로만 적용 되어 있는데 풀 화면 채우는 방법 찾기
profile
흠...?

0개의 댓글