개발새발 개발개발

개요UIKit에서 UISegmentedControl은 SwiftUI의 Picker와 같은 역할을 한다. 이번에는 Picker 컴포넌트와 UISegmentedControl 함수를 통해 서로 다른 이미지를 View에 표시해주는 간단한 프로젝트를 해볼 예정이다. 코드SideOfTheForceenum SideOfTheForce: String, CaseIterable { case light = "Light" case grey = "Grey" case dark = "Dark" }Picker의 타이틀을 정해주는 String 타입의 enum이다. light, grey, dark 총 3가지의 case가 있고 이것을 String값으로 반환해준다. CaseIterable 프로토콜을 채용하면 안에 있는 값들을 배열처럼 사용할..

개요 swiftUI에서 자신의 뷰에서의 상태값을 저장할 때는 @State 키워드를 사용한다. 하지만 이 상태값을 자신의 하위 뷰에도 적용시킬 때가 분명히 필요하다 이럴 때 사용하는 것이 바로 @Binding 키워드이다. 그리고 모든 View에는 환경 기본값이 존재한다. 사용하기 전에 따로 설정을 하지 않아도 기본적으로 설정되어있는데 이 값을 바꾸고 싶을 때는 @Environment 키워드를 사용하여 변경이 가능하다. 시작하기 @Binding 키워드를 통해서 다크모드를 사용할 수 있는 Boolean 변수를 다른 View와 공유를 하고 @Environment 키워드를 통해서 현재 View의 presentationMode의 값을 변경해서 현재 열려있는 View를 종료할 수 있게 도와주는 변수를 만들 예정이다...

오늘은 SwiftUI 프레임워크를 이용하여 간단한 Profile UI를 만들 예정이다.결과프로필 사진과 사용자에 대한 간단한 정보를 담아주는 Textfield가 있고 오른쪽 상단에는 저장하는 버튼과 삭제하는 버튼을 생성하였다. State 변수 선언struct ContentView: View { @State private var firstName = "" @State private var lastName = "" @State private var company = "" var body: some View { } }우선 TextFiled에 입력된 값을 담는 변수들을 State로 감싸서 선언해주었다. SwiftUI의 컴포넌트는 일반적으로 Struct단위로 구성되어 사용되는데 Struct 내에서는 값이 변경이 ..

TabView TabView 컴포넌트는 하단의 아이콘을 통해 여러 페이지를 볼 수 있는 View를 만들어 준다. Example 3개의 페이지로 나뉘어져 있는 TabView import SwiftUI struct Layout: View { var body: some View { TabView { Text("The First Tab") .tabItem { Image(systemName: "1.square.fill") Text("First") } Text("Another Tab") .tabItem { Image(systemName: "2.square.fill") Text("Second") } Text("The Last Tab") .tabItem { Image(systemName: "3.square.fill")..

GroupBox GroupBox 컴포넌트는 일반 Text나 Label 요소를 그룹화하여 스타일링 해주는 컴포넌트이다. Example 간단한 GroupBox 사용방법이다. import SwiftUI struct ContentView: View { var body: some View { GroupBox( label: Label("swiftUI", systemImage: "heart.fill") .foregroundColor(.red) ) { Text("Welcome to swiftUI world") }.padding() } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } } Grou..

List List는 목록 인터페이스를 구형하기 위한 컴포넌트이다. UIKit의 UITableView와 같은 기능을 한다. Example1 import SwiftUI struct ContentView : View { var body: some View { List { Text("A List Item") Text("A Second List Item") Text("A Third List Item") } } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } } List 키워드안에 요소들을 하나 씩 집어넣으면 List가 완성된다. 기본적으로 버튼처럼 사용이 가능한데 현재는 아무런 속성없이 ..

swiftUI에는 다양한 Gesture를 보다 쉽게 구현할 수 있도록 도와준다. Gesture를 감지하는 변수를 GestureState 키워드를 통해 바인딩을 하여 변수가 true일 때만 guesture를 실행하는 식으로 Gesture를 제공하고 있다. Gesture는 총 5가지 종류의 제스쳐가 있다. — TapGesture : 하나 이상의 탭을 인식하는 제스쳐이다. — LongPressGesture : 길게 누르면 인식하는 제스쳐이다. — DragGesture : 드래그 이벤트가 변경될 때 작업을 호출하는 제스쳐이다. — MagnificationGesture : 확대를 할 때 인식하는 제스쳐이다. —RotationGesture : 회전 동작을 인식하고 회전 각도를 추적하는 제스쳐이다. LongPress..

withAnimation swiftUI에서 기본적인 애니메이션 요소는 ease-in, ease-out이다. Example1 import SwiftUI struct ContentView: View { @State private var isButtonVisible = true var body: some View { VStack { Button(action: { withAnimation { self.isButtonVisible.toggle() } }) { Text("Press Me") } if isButtonVisible { Button(action:{}) { Text("Hidden Button") } } } } } struct ContentView_Previews: PreviewProvider { stati..

Toggle on/off 버튼을 만드는 컴포넌트이다. Example import SwiftUI struct ContentView: View { @State private var status = true var body: some View { Toggle(isOn: $status, label: { Text("toggle") }) } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } } 기본적으로 bool 값을 받는 isOn 파라미터와 제목을 Text 컴포넌트로 받는 label 파라미터가 있다. Example2 Toggle 스타일을 통해 toggle 버튼을 커스텀할 수 있다. impo..

Gradient SwiftUI의 구조체 중 하나로 그라데이션을 적용할 때 사용한다. 파라미터는 colors라는 배열 파라미터가 존재하고 해당 배열안에 원하는 색상을 넣으면 적용이된다. Init Gradient(colors: [.red, .blue]) 이렇게 하면 색상이 빨간색과 파란색으로 된 그라데이션을 만들 수 있다. LenearGradient LenearGradient는 시작점과 끝점으로 축에 따라 색상 함수를 적용하는 그라데이션을 제공한다. Example import SwiftUI struct ContentView: View { var body: some View { LinearGradient(gradient: Gradient(colors: [.red, .white]), startPoint: .to..