🏁 학습할 내용Animation phaseKeyframesTip and tricks ♻️ Animation phases 🧩 역할정해진 phase를 순환하며 애니메이션을 적용해주는 modifier 🤖 코드 및 결과 1️⃣ phaseAnimator(phase, content, animation)nonisolated public func phaseAnimator(_ phases: some Sequence, @ViewBuilder content: @escaping (PlaceholderContentView, Phase) -> some View, animation: @escaping (Phase) -> Animation? = { _ in .default }) -> some View where Phase..

👋 들어가기 전요즘 애니메이션과 트랜지션에 관심 많이 생겨.. 늦었지만 WWDC를 통해기초를 차근차근 다져나갈려고한다. 오늘은 WWDC23의 영상으로 SwiftUI의 애니메이션 탐험 파트를 살펴보자.🏁 학습할 내용뷰 업데이트 해부하기AnimatableAnimationTransaction🧑‍⚕️ 뷰 업데이트 해부하기 🤖 예시 코드 (시작, 애니메이션 X)struct ContentView: View { @State private var selected: Bool = false var body: some View { Image(systemName: "pencil") .resizable() .frame(width: 100, height..

🏁 학습할 내용coordinateSpace@NameSpace활용🧭 CoordinateSpace 🤔 어디서 봤을까? GeometryReader proxy 쪽에서 frame정보를 얻을 때, 어떤 Coordinate로부터 가져올 지결정하게 되는데, 거기서 처음 접했던 것 같다. 🧱 구조CoordinateSpacepublic enum CoordinateSpace { // 뷰 계층구조의 최상단을 기준으로하는 global 좌표계 case global // 현재 뷰를 기준으로한 local 좌표계 case local // Hashable한 값으로 구분된 뷰의 좌표계 case named(AnyHashable)} CoordinateSpaceProtocol특정 좌표계를 갖고 있..

어디서 봤을까? @State, @Environment, @ObservedObject 같은 property wrapper에서 발견된다. 이들의 공통점은 뭘까?? 🧩 역할An interface for a stored variable that updates an external property of a view. 뷰를 업데이트 하는 외부 저장 변수에 대한 인터페이스조금말이 어렵다. 간단히 얘기하면, 뷰 상태에 영향을 주는 객체는 채택해야한다는 것! SwiftUI가 이 프로퍼티의 변화를 자동으로 추적해야 한다”는 것을 컴파일러와 런타임에게 알려주는 역할DynamicProperty를 채택한 프로퍼티는 SwiftUI의 view 업데이트 사이클과 연동되어 자동으로 갱신 🧱 구조public protocol Dyn..

SwiftUI 작동 원리 파악하기 먼저 Sample 코드를 통해, 동작흐름을 천천히 살펴보자. 🤖 Sample Codestruct ContentView: View { @State var isOn = true var body: some View { Text(isOn ? "On" : "Off") }} 📊 Attribute Graph 🧩 역할 데이터 모델뷰 계층구조, 상태 의존성, 뷰 업데이트의 효율성을 관리하는 내부시스템어떤 값이 바뀌었을 때, 어떤 뷰를 다시 그려야하는 지 계산하는 의존성 그래프 🌊 흐름 Attribute 관련SwiftUI는 View 구조체를 저장하는 상위 View에서 Attribute 객체를 수신View 구조는 자주 재생성Attribute는 View 전체 수명에서 Ide..

👋 들어가기 전 List를 이용해 화면을 그릴 때, 생각보다 불편한 점이 이만 저만이 아니다. 불편하면 또 검색하고 찾고 하는게 이제 슬슬 귀찮아서 이번에 한번 정리해볼려고한다. iOS 최소 지원버전은 17이상으로 가정한다. 기본은 다음 코드를 기반으로한다. struct ContentView: View { var body: some View { List { Section(header: Text("섹션 1")) { ForEach(0..🏁 학습할 내용row separator 패딩 없애기separator 색깔 바꾸기RowInset 제거하기row간격 주기배경색 색칠하기section section 간격주기📏 row 🧹 패딩 없애기 다음과 같이, list안에 padding이 들..