SwiftUI (10) 썸네일형 리스트형 SwiftUI View 성능 향상을 위한 종속성 최소화하기 올해 WWDC23에 나온 영상을 보고 SwiftUI의 종속성, 그리고 퍼포먼스에 대해 고민을 하기 시작했다. SwiftUI는 구현이 UIKit보다 간편하게 구현할 수 있다는 장점이 있다. 하지만 그간 View의 성능이 향상되는 것에 대한 고민은 해보지 못했던 것 같다. 어떻게 성능향상을 이뤄낼 수 있을까? SwiftUI View는 기본적으로 데이터가 변화하면 화면을 다시 그리는 작업을 수행한다. 때문에 개발자는 어떤 데이터가 바뀐 뷰만 업데이트하고 싶을지 몰라도 데이터와 연결(종속 관계에 있는)된 다른 뷰가 업데이트 될 수 있다. 이러면 성능의 저하를 불러 일으킬 수 있다. 따라서 업데이트 횟수를 줄이는 것을 항상 염두해 두어야 한다. 여기서 업데이트 횟수를 줄이기 위해서 소개할 방법은 2가지이다. 첫 .. SwiftUI) GridItem 알아보기 SwftUI Grid에 대해서 공부하면서 제일 어려웠던 GridItem이다.. GridItem이란? LazyGrid의 행과 열에 대한 설명이다..? 무슨 말이냐면 저번 글에서 LazyGrid에 대해서 공부할 때, LazyHGrid의 선언부를 보면 rows는 [GridItem]으로 타입이 나타나 있다. 결과적으로 LazyGrid의 각 열 혹은 행의 크기를 정하고 배치하는 역할(레이아웃 속성을 지정)을 하는 애로 보면 될 것 같다. GridItem의 선언부를 보면 다음과 같다. size: gridItem의 크기 spacing: item 사이의 간격 alignment: 그리드 항목에 사용할 정렬 방법 이렇게 보면 너무 간단하게 나와있어서 좀 더 들어가보겠다. GridItem.Size에 들어갈 수 있는 Case.. SwiftUI) LazyH(V)Grid 알아보기 저번 시간에 Grid와 GridRow에 대해서 공부하면서 막연했던 Grid에 대해서 감을 잡을 수 있었다. 오늘은 이어서 LazyH(V)Grid에 대해서 공부해보도록 하겠다. 지난번에 LazyStack에 대해서도 공부했는데 "Lazy"가 붙었을 때는 공통점이 있었다. 1. 한번에 모든 하위 뷰를 그리지 않는다.(렌더링을 빠르게 하기 위해) 2. 일반 Stack이나 Grid로 그릴 때, 너무 많은 뷰를 그려 성능이 떨어지는 경우에만 사용해라(Lazy를 먼저 고려하지 말아라) 이번 LazyGrid 역시도 마찬가지였다. 우선 공식문서의 내용을 더 살펴보자 LazyHGrid 수평으로 증가하는 그리드에서 하위 뷰를 정렬하고 필요한 경우에만 항목을 생성하는 컨테이너 뷰 2차원 레이아웃으로 배열된, 크고 수평으로 스.. SwiftUI) Grid, GridRow 알아보기 SwiftUI에서 레이아웃을 구성할 때 주로 HStack, VStack을 많이 사용해왔다 사실 Grid라는 개념을 최근에 알게 되어서 공부해봤는데 쉽지 않았다..! 그래도 공식문서를 보면서 공부하니 많은 도움이 되었고 어떤 기능들이 있는지 좀 더 확실하게 알게 되었다! 우선 Grid Grid란 쉽게 말해 다른 뷰들을 2차원 배치로 정렬하는 컨테이너 뷰이다. 우선 간단한 Grid 예제를 보자 이것만 봤을 때는 HStack, VStack으로 구현하는 느낌이 들었다. Grid는 VStack?, GridRow는 HStack? 여기까지는 공식문서에서도 비슷하게 소개한다. A grid and its rows behave something like a collection of HStack instances wrapp.. SwiftUI @Binding 알아보기 최근 SwiftUI 공부를 다시 시작하였다. 화면을 만드는 것은 UIkit보다 간결한 것 같지만 개념이 다른 부분이 달라 정리할 필요를 느꼈다..! @Binding이란? A Property wratter type that can read and write a value onwned by a source of truth @Binding 프로퍼티 래퍼는 전달받은 데이터를 읽거나 직접 변경할 수 있도록 만들어진 타입이다. 예시를 들어 @Binding을 왜 사용해야 하는지 알아보겠다. 다음과 같이 SuperView안에 SubView(버튼)을 가져다 쓴다고 가정해보자. SubView의 버튼은 SuperView의 클릭 여부에 따라서 상태가 바뀌게 될 것이다. 이때, SuperView와 SubView의 상태는 같아야.. SwiftUI FocusState 알아보기 FocusState는 iOS 15에서 새롭게 생긴 아지 나름 따끈따근한 프로퍼티 래퍼이다. A property wrapper type that can read and write a value that SwiftUI updates as the placement of focus within the scene changes. scene 내에 포커스 배치가 변경될 때 SwiftUI가 업데이트하는 값을 읽고 쓸 수 있는 프로퍼티 https://developer.apple.com/documentation/swiftui/focusstate Apple Developer Documentation developer.apple.com 어떻게 사용할 수 있을까? 공식문서를 보면 TextField에서 포커스를 제거하거나 키보드.. SwiftUI ForEach SwiftUI는 ForEach라고 하는 전용 뷰 타입을 제공해준다. 반복해서 뷰를 만들기 위해 가장 많이 사용하는 방법이다. 공식문서를 보면 다음과 같이 나타나 있다. A structure that computes views on demand from an underlying collection of identified data. 식별된 데이터의 컬렉션에서 요청 시, 뷰를 계산하는 구조체 ForEach는 루프를 돌면서 한 번의 클로저를 계속해서 실행한다. struct ForEachPractice: View { var body: some View { Form { ForEach(0.. SwiftUI animations(애니메이션) SwiftUI에서 animations에 대해서 공부해보고자 한다. animation(_:value:) Applies the given animtaion to this view when the specified value changes. animation 메소드를 통해 호출한 view와 하위 view에 animation을 적용할 수 있다. 뷰에 animation()을 추가하면 기본 시스템 애니메이션을 사용하여 해당 보기에 발생하는 모든 변경 사항을 자동으올 애니메이션화 할 수 있다. 애니메이션화를 한다는 것은 시작상태에서 종료상태로 해당 view의 상태를 변화시키는 것이다. 이를 위해선 해당 view가 시작상태와 종료상태를 가지고 있어야 한다. .easeOut, .easeIn 등을 사용하여 애니메이션의 유.. 이전 1 2 다음
