김종권의 iOS 앱 개발 알아가기

EnvironmentValues superview에서 darkmode로 설정하면 subviews들도 모두 darkmode로 변할 수 있는 기능을 EnvironmentValues로 제어가 가능 Swift에서는 개별 클래스로 관리하였지만, SwiftUI에서는 모두 Environment를 통해서 모두 접근이 가능 가장 대표적인 값은, 지금 지역을 알 수 있는 locale과 layoutDirection, undoManager 등 접근 가능 ex) superview에서 `colorScheme`값을 dark로 지정하면 subview들은 자동으로 dark mode로 변경 EnvironmentValues 종류 editMode colorScheme timeZone locale calendar layoutDirection..

toolbar TabBar와의 차이점 TabBar: 현재 컨텍스트와 연관되지 않은 화면이동 ToolBar: 현재 컨텍스트와 관련된 항목 추가, 삭제, 주석 추가, 사진 촬영과 같은 일 * toolbar의 Human Interface guide 관련 구체적인 내용은 이전 포스팅 글 참고 toolbar를 사용하기 위해 네비게이션 뷰로 이루어진 뷰 준비 import SwiftUI struct ContentView: View { var body: some View { NavigationView { VStack { Text("Toolbar 예제") .padding() } .navigationTitle("타이틀") } } } toolbar를 추가할땐 navigationTitle을 추가하듯이 바로 밑에다 .toolb..

* 전체 소스 코드는 튜토리얼에 있는 프로젝트 참고 TabView TabView와 .tabItem 속성을 이용하여 구현 먼저 Tab의 케이스를 정의하고, 이 케이스를 상태로 갖고있는 프로퍼티도 선언 import SwiftUI struct ExampleView: View { @State private var selection = Tab.home enum Tab { case home case setting } } body를 선언하여 내부에서 TabView(selection:)으로 selection 상태를 정의하고 클로저 내부에서 TabView안에 들어갈 뷰들을 구현 var body: some View { TabView(selection: $selection) { // 여기서 뷰 구현 } } 첫 번째 뷰 - ..

GeometryReader ContainerView이며, 내부에 UIView들의 layout을 쉽게 변경할 수 있는 역할 * GeometryReader를 안쓴 경우) Stack안에 두가지의 뷰가 들어가고, Rectangle이 하단의 모든 자리를 차지하는 형태 struct Example: View { var body: some View { VStack { Text("example GeoMetryReader") Rectangle() .foregroundColor(.green) } } } struct Example_Previews: PreviewProvider { static var previews: some View { Example() } } GeometryReader를 사용한 경우) GeometryRe..

애니메이션에 사용할 모양 정의 SwiftUI에는 대표적으로 4가지의 모양을 쉽게 사용이 가능 Capsule() Circle() Rectangle() RoundedRectangle(cornerSize:) var body: some View { Capsule() .fill(color) .frame(height: 70) Circle() .fill(.red) .frame(width: 100, height: 100) Rectangle() .fill(.green) .frame(width: 100, height: 100) RoundedRectangle(cornerSize: .init(width: 12, height: 12)) .fill(.blue) .frame(width: 100, height: 100) } 이 중에..

* 애플 튜토리얼의 프로젝트 파일을 받아서 실습하고 그 중에서 중요한 부분만 포스팅 4강에서 만든 Row import SwiftUI struct LandmarkRow: View { var landmark: Landmark var body: some View { HStack { landmark.image .resizable() .frame(width: 50, height: 50, alignment: .leading) Text(landmark.name) Spacer() //

* 애플 튜토리얼의 프로젝트 파일을 받아서 실습하고 그 중에서 중요한 부분만 포스팅 데이터 모델 정의 애플에서 제공해준 assets폴더와 landmarkData 확인 landmarkData.json [ { "name": "Turtle Rock", "category": "Rivers", "city": "Twentynine Palms", "state": "California", ... 모델도 기존 swift에서 사용하던 방식처럼, json파일을 디코딩 하기위해서 Codable을 따르도록 구현 import Foundation import SwiftUI import CoreLocation struct Landmark: Hashable, Codable, Identifiable { var id: Int var na..

이미지 사용 방법 asset 파일에 사진 파일 준비 ContentView에 Image()를 사용하여 이미지 표출 struct ContentView: View { var body: some View { Image("dog") } } SwiftUI에서는 clipShape()를 통해 이미지를 Circle형태로 만들기가 매우 쉬움 struct ContentView: View { var body: some View { Image("dog") .clipShape(Circle()) //