[swift] Swift UI에서 사용하는 주요 컴포넌트에는 어떤 것들이 있나요?

01 Dec 2023

swift

스택(Stack): VStack과 HStack을 사용하여 수직 및 수평 스택을 생성할 수 있습니다. 이를 통해 UI 요소를 정렬하고 중첩 시킬 수 있습니다.
버튼(Button): 사용자와 상호 작용할 수 있는 버튼입니다. SwiftUI에서는 버튼에 클로저를 연결하여 버튼이 눌렸을 때 수행할 작업을 지정할 수 있습니다.

Button("버튼") {
    // 버튼이 눌렸을 때 수행할 작업
}

이미지(Image): 이미지를 화면에 표시하는 데 사용됩니다. SwiftUI에서는 이미지를 로드하거나 프로젝트 내에서 사용할 수 있습니다.

Image("이미지 이름")
    .resizable()
    .frame(width: 100, height: 100) // 이미지 크기 조정
    .aspectRatio(contentMode: .fit) // 이미지 비율 유지

텍스트(Text): 텍스트를 표시하는 데 사용됩니다. SwiftUI에서는 텍스트에 다양한 스타일을 적용할 수 있습니다.

Text("텍스트 내용")
    .font(.title)
    .foregroundColor(.blue)
    .bold()

입력 컨트롤(Input Control): SwiftUI에서는 다양한 입력 컨트롤을 제공합니다. 예를 들어 텍스트 필드(Text Field), 스위치(Switch), 슬라이더(Slider), 피커(Picker) 등을 사용할 수 있습니다.

TextField("입력 필드", text: $input)
    .textFieldStyle(RoundedBorderTextFieldStyle())

Toggle("스위치", isOn: $isOn)

Slider(value: $sliderValue, in: 0...100)

Picker("피커", selection: $selectedOption) {
   Text("옵션 1").tag(1)
   Text("옵션 2").tag(2)
}

이 외에도 다양한 컴포넌트가 있으며, SwiftUI에서는 이러한 컴포넌트들을 조합하여 복잡한 UI를 구성하는 것이 가능합니다.

참고 문서:

Apple Developer Documentation: SwiftUI Essentials
Hacking with Swift: SwiftUI by Example