SwiftUI - 버튼, UI, Image, TextFiled 구현

 

 

오늘은 이미지불러오기, 텍스트 필드와 버튼 사용법 익히는 시간을 가졌다.

 

 

 

 

- 코드 

import SwiftUI

struct ContentView: View {
    @State private var btn : String = "Welcome to ROAD 1950 Cafe"
    
    var body: some View {
        ZStack{
            Color(red: 216/255, green: 207/255, blue: 243/255).ignoresSafeArea()
            VStack{
                Image("B37B8E66-493D-471C-8B2D-9C4C67206855_4_5005_c")
                    .resizable()
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 250, height: 400)
                    
                HStack{
                    Spacer()
                    Button("Before"){
                    }
                    .padding(5)
                    .foregroundColor(Color.white)
                    .background(Color.indigo)
                    .cornerRadius(5)
                    Spacer()
                    Text("ROAD 1950 Cafe")
                    Button("Next"){
                    }
                        .padding(.leading)
                        .buttonStyle(.borderedProminent)
                    Spacer()
                }
                Spacer()
                HStack{
                   TextField("", text: $btn)
                        .textFieldStyle(RoundedBorderTextFieldStyle())
                    
                    Button("Cafe Button"){
                    }
                        .buttonStyle(.bordered)
                        .background(Color.indigo)
                        .cornerRadius(10)
                        .foregroundColor(.white)
                }.padding()
            }
            
        }
        
    }
}

#Preview {
    ContentView()
}

 

SwiftUI에서 버튼, 이미지, 텍스트필드 구현연습에 이해가 조금 되는것 같다.