본문 바로가기

Apple/SwiftUI

SwiftUI 05 - @Binding 사용법 SwiftUI에서 하나의 뷰 내부에서 값의 변동을 공유하기 위해 @State 프로퍼티 래퍼를 사용한다. 하지만 뷰 사이에 같은 값을 사용하는 @State를 사용하고 그 변수의 값이 변경되는 경우 하나의 뷰에서는 값이 변경되지 않는다. 말이 요상한데 아래와 같은 예시를 살펴보면 이해가 더 빠르다. 아래 코드는 두가지 뷰로 이루어져있고, 하나는 메인뷰, 하나는 커스텀 버튼 뷰이다. 원하는 기능은 버튼을 클릭했을 때 버튼 내부의 텍스트가 Dribbling에서 Shooting으로 바뀌고, 버튼의 배경색에 blue에서 orange로 바뀌는 것이고, 메인뷰의 텍스트 메시지가 shooting에서 sonny is on fire 로 바뀌는 것이다. 뷰 내부의 값들의 변경을 캐치하기 위해 두 가지 부울 변수를 @State..
SwiftUI 04 - @State, @StateObject SwiftUI에서는 @State, @StateObject와 같은 프로퍼티 래퍼로 뷰 내부, 뷰 사이에 데이터 공유를 할 수 있다. @State 현재 뷰에서 비교적 간단한 데이터 공유(실시간 데이터 변화 감지 등)를 위해 사용한다. 뷰들 사이에 데이터 공유는 할 수 없다. 또 Struct 형태만 변수로 사용 가능하다. 아래코드를 보면 Score struct를 만들어서 뷰 내부에서 공유할 데이터 구조를 만들었고, Content 뷰 안에 score변수에서 Score struct의 인스턴스를 @State 프로퍼티 래퍼로 선언하였다. 텍스트 필드에서 내용을 수정하면 실시간으로 텍스트에 반영이 되고, 버튼을 클릭하면 isScore 값이 변경되어 텍스트 메시지도 바뀐다. import SwiftUI struct Sco..
SwiftUI03 - Stepper 숫자를 입력하고 변경하기 위해 SwiftUI에서 제공하는 방법은 Stepper와 Slider가 있다. Stepper는 +,- 버튼을 통해 숫자의 크기를 조절하는 방법이고, Slider 는 범위 안의 숫자를 슬라이더 ui를 통해 조절하는 것이다. ❑ Stepper 사용자환경에서 실시간으로 숫자를 변경해야 하는 Stepper를 사용하기 위해서 @State property wrapper를 사용한다. Stepper를 선언하면 텍스트 옆에 - + 버튼이 생긴다. 버튼을 클릭하면 숫자가 변경된다. struct ContentView: View { @State private var goalCount = 0 var body: some View { Stepper("\(goalCount) Goal", value: $goal..
SwiftUI02 - Button Swift는 버튼 프로퍼티로 매우 다양한 기능을 제공한다. SwiftUI에서 버튼을 선언하는 방법은 다양하다이다. 주로 쓰는 첫번째 방법은 가장 간단하게 버튼을 생성하는 방법이고, 두번째 방법은 버튼에 사용하는 레이블을 커스텀하기 위해 사용하는 방법이다. // 1번째 방법 Button("레이블") { print("버튼 기능") } // 2번째 방법 Button(action: { print("버튼 기능") }, label: { Text("레이블") }) 버튼 스타일 SwiftUI는 버튼에 대한 다양한 스타일을 제공한다. - .boarderd, .borderedProminent, destructive(role) 텍스트 길이에 맞게 버튼 크기가 자동으로 맞춰진다. .boardedProminent 스타일의 색상..
SwiftUI01 - Stack(HStack, VStack, ZStack) body에서 some View를 리턴할 때, SwiftUI는 화면에 표시될 수 있는 뷰를 받을 것을 기대한다. 그것은 내비게이션 뷰나 form, text View 같은 것들이지만 View protocol을 준수해야 한다. body 안에 view 두 개를 띄우면 canvas에 preview가 두 개가 뜬다. body 안의 두 가지 뷰는 독립적이라고 Swift가 판단하기 때문이다. (preview canvas 실행 단축키 : command + option + p) import SwiftUI struct ContentView: View { var body: some View { Text("Hello, world!") Text("Hello, Swift!!") } } struct ContentView_Previe..