[HIG] Collection
·
iOS/HIG
사진 세트와 같은 정렬된 콘텐츠 세트를 관리하고 커스텀 가능하고 시각적인 레이아웃으로 제공 컬렉션은 엄격하게 선형 형식을 시행하지 않기 때문에 크기가 다른 항목을 표시하는 데 적합 컬렉션은 이미지 기반 콘텐츠를 과시하는 데 이상적 배경과 같은 부수적인 뷰는 항목의 하위 집합을 시각적으로 구별하기 위해 선택적으로 구현 컬렉션은 상호 작용과 애니메이션을 모두 지원한다 기본적으로 탭하여 선택하고, 길게 터치하여 편집하고, 스와이프하여 스크롤할 수 있다 필요한 경우, 커스텀된 작업을 수행하기 위해 더 많은 제스처를 추가할 수 있다 컬렉션 내에서 항목을 삽입, 삭제 또는 재정렬할 때마다 애니메이션을 활성화할 수 있으며 커스텀 애니메이션도 지원한다 고려사항 행이나 그리드 레이아웃이 충분할 때 새로운 디자인을 만들지..
Data Flow
·
iOS/SwiftUI
State : 값이 변하면 View를 새로 그려주는 역할을 수행 State 란 무엇인가? 1. State Property store values that the view depends on ⇒ 뷰가 의존하는 상태 속성 저장값 2. State Property represent values that can change ⇒ State Property는 변경할 수 있는 값을 나타냅니다. 3. State Property typically declared in the view that nedds them ⇒ State Property는 일반적으로 이를 추가하는 뷰에서 선언됩니다. 예제 코드 State 속성을 사용한 toggleValue 의 변화에 따라 Text가 변하는걸 볼수 있다 Binding : State의 값..
[SwiftUI] ScrollView
·
iOS/SwiftUI
Nano Challenge 를 진행하는데 횡 스크롤을 구현해야 해서 ScrollView를 공부해 보았다 공식문서 내용 스크롤 뷰는 스크롤 가능한 콘텐츠 영역 내에서 콘텐츠를 표시합니다. 사용자가 플랫폼에 적합한 스크롤 제스처를 수행할 때, 스크롤 보기는 기본 콘텐츠의 어떤 부분이 보이는지 조정합니다. ScrollView는 수평, 수직 또는 둘 다 스크롤할 수 있지만 줌 기능을 제공하지는 않습니다. 어..? HIG에는 적절한 줌 기능을 제공하라고 했는데..? 그건 페이지 컨트롤을 사용할때 한정인가보다. 아직까지는 줌 기능이 필요하지 않으니 추후에 스크롤과 줌 기능이 필요하면 그때 다시 찾아보자. 일단 기본적으로 ScrollView는 줌 기능을 제공하지 않음! 정의 struct ScrollView where..
[Sweet SwiftUI] 이미지(Image)
·
iOS/SwiftUI
본 내용은 스윗한 SwiftUI 책에 있는 예제를 공부한 내용입니다. 해당 예제들에 대한 저작권은 BJpublic 에 있습니다. 이미지에 frame 속성을 사용해도 이미지 자체의 크기를 변경해 주진 않음 Resizable 속성을 사용하여 이미지 크기를 변경할 수 있음 HStack { Image("imgFile") // 이미지 크기는 변하지 않고, 이미지를 포함함 뷰의 크기가 변함 .frame(width: 50, height: 50) Image("imgFile").resizable() // resizable() 을 사용하여 이미지 크기 자체가 변함 .frame(width: 200, height: 50) } frame 은 View의 속성이기 때문에 resizable 과 순서가 중요함! resizable() ..
[Sweet SwiftUI] Text와 수식어
·
iOS/SwiftUI
본 내용은 스윗한 SwiftUI 책에 있는 예제를 공부한 내용입니다. 해당 예제들에 대한 저작권은 BJpublic 에 있습니다. 전체적으로 훑어보기 VStack(spacing: 30) { // 세로 방향으로 뷰를 배열하는 컨테이너 뷰 Text("폰트와 굵기 설정") .font(.title) // 폰트 설정 .fontWeight(.black) // 폰트 굵기 Text("글자색은 foreground, 배경은 background") .foregroundColor(.white) .padding() // 텍스트 주변 여백 설정 .background(Color.blue) Text("커스텀 폰트, 볼드체, 이탤릭체, 밑줄, 취소선") .font(.custom("Menlo", size: 16)) .bold() .ita..