아이폰 키패드 클론코딩

 

GitHub - bulmang/Iphone_Keypad: 아이폰 전화 키패드 앱

앱 설명

• 아이폰의 기본 전화 애플리케이션 중 키패드 부분입니다.

앱 기능

• 배열을 사용하여 번호버튼을 누르면 번호 입력
• 번호가 입력 되었을 때 번호추가 버튼과 삭제버튼 활성화
• 0번버튼을 길게 눌렀을 때 + 입력, 나머지 버튼은 입력 되지 않음.
• Tab 바를 만들어서 화면 전환

코드

MainView

//
//  ContentView.swift
//  Iphone_Keypad
//
//  Created by 하명관 on 2022/11/25.
//

import SwiftUI

struct MainView: View {
    
    @Binding var childNumber: String
    
    fileprivate func keypadDialView() -> ForEach<[[Dial]], [Dial], HStack<ForEach<[Dial], Dial, DialButton>>> {
        return ForEach(dialDummy, id: \\.self){ items in
            HStack{
                ForEach(items, id: \\.self) { item in
                    DialButton(dialNumber: Dial(mainNumber: item.mainNumber, subAlphabet: item.subAlphabet),
                               buttonColor: item.buttonColor, childNumber: $childNumber)
                }
            }
        }
    }
    
    var body: some View {

        ZStack{
            
            
            
            VStack(spacing: 0){
                
                
                
                Text(childNumber)
                    .font(.system(size: 40))
                
                if childNumber != ""{
                    
                    Button{
                        
                    } label: {
                        Text("번호추가")
                            .foregroundColor(.blue)
                            .padding(.top,10)
                    }
                }
                
                
                Spacer()
                
                keypadDialView()
                
                
                
            }
            .padding(.top,60)
            
            

        }

    }
    
}

struct MainView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

//struct CustomButton: View {
//
//    var number: String
//
//    var body: some View {
//
//        VStack{
//            Button {
//
//            } label: {
//                VStack(spacing: -5){
//                    Text(number)
//                        .font(.system(size: 38))
//
//                    HStack{
//                        Text("!")
//                            .font(.system(size: 12))
//                    }
//                    .opacity(0)
//                    .padding(.bottom,10)
//                }
//                .foregroundColor(.white)
//                .font(.title)
//                .frame(width: 85,height: 85)
//                .background(.gray)
//                .clipShape(Circle())
//            }
//        }
//
//    }
//
//}
//
//struct CustomCharButton: View {
//
//    var number: String
//    var char1: String
//    var char2: String
//    var char3: String
//
//    var body: some View {
//
//        VStack(spacing: 0){
//            Button {
//
//            } label: {
//                VStack(spacing: -5){
//
//                    Text(number)
//                        .font(.system(size: 38))
//
//                    HStack(spacing: 1.5){
//                        Text(char1)
//                            .font(.system(size: 12))
//                            .fontWeight(.bold)
//
//                        Text(char2)
//                            .font(.system(size: 12))
//                            .fontWeight(.bold)
//
//                        Text(char3)
//                            .font(.system(size: 12))
//                            .fontWeight(.bold)
//                    }
//                    .padding(.bottom,10)
//                }
//                .foregroundColor(.white)
//                .font(.title)
//                .frame(width: 85,height: 85)
//                .background(.gray)
//                .clipShape(Circle())
//
//            }
//        }
//
//    }
//
//}
//
//struct CustomCharButton2: View {
//
//    var number: String
//    var char1: String
//    var char2: String
//    var char3: String
//    var char4: String
//
//    var body: some View {
//
//        VStack(spacing: 0){
//            Button {
//
//            } label: {
//                VStack(spacing: -5){
//
//                    Text(number)
//                        .font(.system(size: 38))
//
//                    HStack(spacing: 1.5){
//                        Text(char1)
//                            .font(.system(size: 12))
//                            .fontWeight(.bold)
//
//                        Text(char2)
//                            .font(.system(size: 12))
//                            .fontWeight(.bold)
//
//                        Text(char3)
//                            .font(.system(size: 12))
//                            .fontWeight(.bold)
//
//                        Text(char4)
//                            .font(.system(size: 12))
//                            .fontWeight(.bold)
//                    }
//                    .padding(.bottom,10)
//                }
//                .foregroundColor(.white)
//                .font(.title)
//                .frame(width: 85,height: 85)
//                .background(.gray)
//                .clipShape(Circle())
//
//            }
//        }
//
//    }
//
//}

 

DialButton

//
//  DialButton.swift
//  Iphone_Keypad
//
//  Created by 하명관 on 2022/11/26.
//

import SwiftUI

struct DialButton: View {
    
    let dialNumber: Dial
    let buttonColor : Color? 
    @Binding var childNumber: String
    @GestureState var press = false
    
    var body: some View {
        Button{

            
        } label: {
            VStack(spacing: 0) {
                if dialNumber.mainNumber == "phone" {
                    Image(systemName:  "phone.fill")
                        .resizable()
                        .frame(width: 30, height: 30)
                        .background(buttonColor)
                        .padding(.top, 15)
                        .foregroundColor(.white)
                        
                        
                }else if dialNumber.mainNumber == "*" {
                    
                    Image(systemName:  "staroflife.fill")
                        .resizable()
                        .frame(width: 20, height: 20)
                        .background(buttonColor)
                        .padding(.top, 15)
                    
                    
                }
                else if dialNumber.mainNumber == "#" {
                    
                    Image(systemName:  "number")
                        .resizable()
                        .frame(width: 25, height: 25)
                        .background(buttonColor)
                        .padding(.top, 15)
                    
                    
                }else if dialNumber.mainNumber == "delete"{
                    if childNumber != ""{
                        Image(systemName: "delete.left.fill")
                            .resizable()
                            .frame(width: 25, height: 25)
                            .padding(.top, 15)
                            .frame(width: 90,height: 90)
                            .foregroundColor(.gray)
                        
                    }

                        
                }
                else{
                    Text(dialNumber.mainNumber)
                        .font(.system(size: 40))
                        .padding(.vertical, -5)
                        
                        
                }
                HStack(spacing:2){
                    ForEach(dialNumber.subAlphabet,id: \\.self) { item in
                        Text(item)
                            .font(.system(size: 15))
                    }
                }
            }
            .foregroundColor(Color("Color"))
            .frame(width: 85,height: 85)
            .background(buttonColor)
            .clipShape(Circle())
            
        }
        .simultaneousGesture(LongPressGesture().onEnded { _ in
            if dialNumber.mainNumber == "0" {
                childNumber += "+"
            }  else if dialNumber.mainNumber == "phone"{
                
            }
            else if dialNumber.mainNumber == "delete"{
                //                    if childNumber.count > 0 {
                //                        childNumber.removeLast() // 마지막이 삭제되어 반환
                //                    }
                childNumber = String(childNumber.dropLast(1)) // 적어준 숫자 만큼 배열을 지워줌.
                
            }else {
                childNumber += dialNumber.mainNumber
                    
            }
            
        })
        .simultaneousGesture(TapGesture().onEnded({ _ in
            if dialNumber.mainNumber == "phone"{
                
            }
            else if dialNumber.mainNumber == "delete"{
                //                    if childNumber.count > 0 {
                //                        childNumber.removeLast() // 마지막이 삭제되어 반환
                //                    }
                childNumber = String(childNumber.dropLast(1)) // 적어준 숫자 만큼 배열을 지워줌.
                
            }else {
                childNumber += dialNumber.mainNumber
                    
            }
        }))
        .padding(.all, 10)
        
    }
        
    
}

struct DialButton_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Dial

//
//  Dial.swift
//  Iphone_Keypad
//
//  Created by 하명관 on 2022/11/26.
//

import Foundation
import SwiftUI

struct Dial: Identifiable, Hashable {
    var id = UUID()
    var mainNumber: String
    var subAlphabet: [String]
    var buttonColor: Color? = Color("NumberColor")
    
}

var dialDummy = [[Dial(mainNumber: "1",
                       subAlphabet: ["","",""]),
                  Dial(mainNumber: "2",
                       subAlphabet: ["A","B","C"]),
                  Dial(mainNumber: "3",
                       subAlphabet: ["D","E","F"])],
                  [Dial(mainNumber: "4",
                        subAlphabet: ["G","H","I"]),
                  Dial(mainNumber: "5",
                       subAlphabet: ["J","K","L"]),
                  Dial(mainNumber: "6",
                       subAlphabet: ["M","N","O"])],
                  [Dial(mainNumber: "7",
                        subAlphabet: ["P","Q","R","S"]),
                  Dial(mainNumber: "8",
                       subAlphabet: ["T","U","V"]),
                  Dial(mainNumber: "9",
                       subAlphabet: ["W","X","Y","Z"])],
                  [Dial(mainNumber: "*",
                        subAlphabet: ["","",""]),
                  Dial(mainNumber: "0",
                       subAlphabet: ["","+",""]),
                   Dial(mainNumber: "#",
                        subAlphabet: ["","",""])],
                 [Dial(mainNumber: "", subAlphabet: ["","",""] , buttonColor: Color(.white) ),
                 Dial(mainNumber: "phone", subAlphabet: ["","",""] , buttonColor: Color("VoiceColor") ),
                 Dial(mainNumber: "delete", subAlphabet: ["","",""] , buttonColor: Color(.white)  )]
                  
                 
]

ContentView

//
//  MainView.swift
//  Iphone_Keypad
//
//  Created by 하명관 on 2022/11/26.
//

import SwiftUI

struct ContentView: View {
    
    @State var currentTab: Tab = .keypad
    @State var Number: String = ""
    
    var wordDummy: [String] = ["즐겨찾기","최근통화","연락처","키패드","음성사서함"]
    
    var body: some View {
        VStack{
            TabView(selection: $currentTab) {
                
                Text("Star")
                    .tag(Tab.star)
                    
                
                Text("recent")
                    .tag(Tab.recent)
                
                Text("phonenubmer")
                    .tag(Tab.phonenumber)
                
                MainView(childNumber: $Number)
                    .tag(Tab.keypad)
                
                Text("voicerecord")
                    .tag(Tab.voicerecord)
            }
            
            HStack(spacing:40){
                ForEach(Tab.allCases, id:\\.self) { tab in
                    Button{
                        currentTab = tab
                    } label: {
                        VStack{
                            Image(tab.rawValue)
                                .resizable()
                                .renderingMode(.template)
                                .aspectRatio(contentMode: .fit)
                                .frame(width: 20, height: 20)
                                .foregroundColor(currentTab == tab ? Color("ButtonColor") : Color.gray)
                            
                            Text(tab.rawValue)
                                .font(.system(size: 12))
                                .foregroundColor(currentTab == tab ? Color("ButtonColor") : Color.gray)
                        }
                        
                    }
                }
                
            }
        }
        
        
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
enum Tab: String,CaseIterable{
    
    case star = "즐겨찾기"
    case recent = "최근 통화"
    case phonenumber = "연락처"
    case keypad = "키패드"
    case voicerecord = "음성 사서함"
}