import SwiftUI

struct myClickerView : View{
    @Binding var isDetected: Bool
    
    var body: some View{
        VStack{
            Text("C")
                .fontWeight(.bold)
                .font(.system(size: 60, design: .rounded))
            Text("L")
                .fontWeight(.bold)
                .font(.system(size: 60, design: .rounded))
            Text("I")
                .fontWeight(.bold)
                .font(.system(size: 60, design: .rounded))
            Text("K")
                .fontWeight(.bold)
                .font(.system(size: 60, design: .rounded))
        }
        .background(isDetected ? Color.blue : Color.yellow)
        .padding(10)
    }
}

MyClickerView 라고 해서 사진에 “CLIK” 라고 적혀진 부분을 struct 바꿈.

그리고 ContentView 나중에 쓸만한 코드는 Struct 을 빼기 그리고 네비게이션 뷰로 나중에 다른 페이지 연결할때 쓸거임

import SwiftUI

struct ContentView: View {
    @State var isDetected = false
    var body: some View {
        NavigationView{
            ZStack{
                backgroundView(isDetected : $isDetected)
              
                VStack{
                    HStack{
                        myClickerView(isDetected : $isDetected)
                        myClickerView(isDetected : $isDetected)
                        myClickerView(isDetected : $isDetected)
                        
                    }
                    .padding(isDetected ? 50 : 10)
                    .background(.black)
                    .onTapGesture {
                        print("ClickerView was cliked")
                        
                        withAnimation{
                            self.isDetected.toggle()
                            
                        }
                      
                    }
                   
                }
                    .padding(.top, 50)

             
                }
            }
        }
    }

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

struct BackgroundView: View{
    
    
    
    var body: some View{
        
        LinearGradient(gradient: Gradient(colors: [.yellow, .orange]), startPoint: .topLeading, endPoint: .bottomTrailing)
            .ignoresSafeArea(.all)
    }
}
}