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

Liquid Glass기존 TabView를 사용하면 자동으로 Liquid Glass 형태로 보여짐TabView { }toolbar 사용해도 상단 버튼들이 Liquid glass로 표현됨스크롤하면 가장자리를 흐림처리함검색바인체공학적으로 쉽게 처리하기위해 검색바는 키보드 바로 위에붙게됨TabView안에 있는 Tab에 role 파라미터에 .search만 넣어도 검색바를 보여주게 할 수 있음변경된 Control UI (Toggle, Picker, Slider)Liquid glass 형태로 버튼이 동작함 Scroll Performance원래는 Lazy Stack들이 여러개 중첩되어 있을 땐, lazy하게 동작되지 않았지만 이제는 lazy하게 동작됨VStack안에 Carousel같은 UI를 하고싶을땐 기존에 중첩되..

Side bar UI 진화 (TabView)iOS 18.0에서는 사이드바에서 특정 버튼을 누르면 상단으로 메뉴가 이동됨또 사용자가 항목을 재정렬 할 수 있는 기능이 추가됨사용자가 자주 사용하는 옵션과 사용하지 않는 옵션을 원하는데로 커스터마이징 할 수 있게 제공Side Bar 상단 메뉴 전환 옵션 적용 방법TabView로 감싸진 코드에, tabViewStyle(.sidebarAdaptable)를 사용탭 재정렬 및 제거와 같은 옵션 적용 방법tabViewCustomization() 사용(이렇게 적용하면 macOS, tvOS에서도 자연스럽게 적용됨)tvOS에서 적용된 모습macOS에 적용된 모습* 이 밖의 tabView에 관한 구체적인 내용은 WWDC24 Improve your tab and sideba..

1. 스크롤되는 PagerView 구현 방법 - 상단 TabView 구현하기 2. 스크롤되는 PagerView 구현 방법 - 하단 PagerView 구현하기 3. 스크롤되는 PagerView 구현 방법 - Tab과 Pager 스크롤 싱크 맞추기 v PagerView 형태 상단에는 TabView UIScrollView안에 UIStackView를 넣어서 구현하고 각 tap 이벤트는 뷰의 tag를 사용하면 인덱스를 구할 수 있음 하단에는 PagerView 페이지 기능을 쉽게 사용하기 위해서 UICollectionView를 사용하여 구현 주의) UIPageViewController를 사용하지 않음 - UIPageViewController안에 내장된 UIScrollView의 형태는 내부 content 크기만큼 있..

1. 스크롤되는 PagerView 구현 방법 - 상단 TabView 구현하기 2. 스크롤되는 PagerView 구현 방법 - 하단 PagerView 구현하기 v 3. 스크롤되는 PagerView 구현 방법 - Tab과 Pager 스크롤 싱크 맞추기 PagerView 형태 상단에는 TabView UIScrollView안에 UIStackView를 넣어서 구현하고 각 tap 이벤트는 뷰의 tag를 사용하면 인덱스를 구할 수 있음 하단에는 PagerView 페이지 기능을 쉽게 사용하기 위해서 UICollectionView를 사용하여 구현 주의) UIPageViewController를 사용하지 않음 - UIPageViewController안에 내장된 UIScrollView의 형태는 내부 content 크기만큼 있..

목차) SwiftUI의 기본 - 목차 링크 TabView SwiftUI에서는 Tab을 매우 직관적으로 추가하기가 가능 TabView를 선언해 놓고, 가 하위에 .tabItem을 추가하여 사용 TabView에 넣을 뷰 3가지 준비 struct ViewA: View { var body: some View { Text("ViewA") } } struct ViewB: View { var body: some View { Text("ViewB") } } struct ViewC: View { var body: some View { Text("ViewC") } } TabView하위에 위 뷰들을 추가하고, 탭뷰의 이름은 .tabItem으로 추가 struct ContentView: View { var body: some ..

* 전체 소스 코드는 튜토리얼에 있는 프로젝트 참고 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) { // 여기서 뷰 구현 } } 첫 번째 뷰 - ..