관리 메뉴

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

[iOS - swift] 5. WWDC 2024 정리 - (1) What’s New in SwiftUI (TabView, tabViewStyle, tabViewCustomization, Controls, New symbol Effects) 본문

WWDC 정리/WWDC 2024 정리

[iOS - swift] 5. WWDC 2024 정리 - (1) What’s New in SwiftUI (TabView, tabViewStyle, tabViewCustomization, Controls, New symbol Effects)

jake-kim 2024. 6. 24. 01:29

Side bar UI 진화 (TabView)

  • iOS 18.0에서는 사이드바에서 특정 버튼을 누르면 상단으로 메뉴가 이동됨

  • 또 사용자가 항목을 재정렬 할 수 있는 기능이 추가됨
    • 사용자가 자주 사용하는 옵션과 사용하지 않는 옵션을 원하는데로 커스터마이징 할 수 있게 제공

  • Side Bar <-> 상단 메뉴 전환 옵션 적용 방법
    • TabView로 감싸진 코드에, tabViewStyle(.sidebarAdaptable)를 사용

  • 탭 재정렬 및 제거와 같은 옵션 적용 방법
    • tabViewCustomization() 사용

(이렇게 적용하면 macOS, tvOS에서도 자연스럽게 적용됨)

  • tvOS에서 적용된 모습

  • macOS에 적용된 모습

* 이 밖의 tabView에 관한 구체적인 내용은 WWDC24 Improve your tab and sidebar experience on iPad 세션 참고

새로운 Controls

  • 잠금화면 또는 제어센터에 있는 버튼, 토글 등 크기 조정이 가능

  • Intent를 사용하여 구현
    • "Start the party"문구와 "music.mic" 이미지를 가지고 있는 Label과 하단의 description 텍스트를 아래처럼 작성

* 더 많은 버튼과 토글을 구현하는 방법은 WWDC24 Access your app's controls access the system 세션 참고

SF Symbol Effects

  • SF Symbol을 사용하면 SwiftUI에서 제공하는 .symbolEffect(.wiggle(.rotational.continuous()))를 사용하여 애니메이션 효과 적용이 가능

  • 음표 이미지에 흔들리는 효과가 적용됨

New symbol Effects

  • .wiggle - 흔들기 효과
    • 관심을 끌 수 있는 효과이며 symbol을 임의의 방향이나 각도로 진동시킴

  • .breathe - 호흡 효과
    • symbol의 크기를 부드럽게 위아래로 조정하여 진행 중인 활동을 나타냄

  • .rotate -  회전 효과
    • 지정된 앵커를 중심으로 심볼의 일부를 회전

  • .replace - 변화 효과
    • replace를 사용하면 배지와 슬래시에 다른 심볼이 추가되거나 덫붙이는 효과 적용이 가능

* 이 밖의 여러가지 기능에 대해서는 WWDC24 What's new SF Symbols 세션 참고

 

* 참고

- https://developer.apple.com/videos/play/wwdc2024/10144/

Comments