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

Alignment 파라미터 잘 활용하기보통은 HStack, VStack을 사용하면 alignment을 거의 안쓸 수가 있는데 이를 활용하면 여러가지 뷰를 조금 더 쉽게 표현이 가능HStack(alignment:)VStack(alignment:)먼저 alignment 타입 확인해보면, HStack은 VerticalAlignment 타입이고, VStack은 HorizontalAlignment 타입주의) "HStack은 수평이니 HorizontalAlignment"라고 잘못 생각하는 경우 주의alignment는 스택 방향과 반대 방향을 의미함// VStack 정의 형태@frozen public struct VStack : View where Content : View { @inlinable public i..

ScrollView안에 Spacer 적용하는 케이스ScrollView안에 Spacer를 잘 활용해야하는 아래와같은 경우가 존재ex) button은 항상 디바이스 하단에 떠 있고, 그 뒤에 스크롤되는 2개의 텍스트가 있는 경우 ("iOS앱 개발 알아가기", "jake") 상단의 Text가 짧을때는, "jake" Text는 하단 SafeArea로 부터 56만큼 간격 유지상단의 Text가 길어져서 스크롤이 많이 가능하게되면 "jake"는 스크롤 영역이므로 스크롤 밑쪽에 위치상단이 짧은 텍스트상단이 긴 텍스트f구현방법은 상단 Text와 하단 Text 사이에 Spacer()를 넣고, 하단 패딩을 주는 방법이 있는데, ScrollView안에 Spacer()를 그대로 사용하면 동작하지 않음ex) ScrollView안..

VStack, HStack 사용 할 때 주의할 점VStack, HStack은 내부 콘텐츠 크기에 의해서, 자기 자신의 크기가 결정되는 컴포넌트대부분 실수하는 것이 VStack, HStack에 패딩을 넣거나 사이즈를 고정하는 경우가 존재ex) VStack에 width를 120으로 고정하는 경우struct ContentView: View { var body: some View { VStack(alignment: .leading) { Text("start") VStack { Text("1") Text("2") Text("3") ..

목차) SwiftUI의 기본 - 목차 링크 HStack 개념 선언부 @frozen struct HStack where Content : View cf) @frozen이란? @unknown 먼저 알기) enum타입을 접근하는 switch-case문에서 사용되는 키워드 추가적인 case가 생겼을 때, 기존에 switch-case문에서 해당 case를 선언하지 않고 @unknown default로 선언해 놓으면 사용하는 쪽에서 warning 메시지를 받아볼 수 있어 인지할 수 있게끔 하는 키워드 그냥 default만 사용하면 어떤 새로 추가되는 case가 있는지 모르지만, @unlnown default를 사용하면 추가적인 case문이 있다고 warning메시지로 알려주는 기능 enum Color { case ..

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

Stack 뷰들을 나열할때 사용 뷰 간의 간격 설정에 용이 Stack 사용 방법 Preview에서 cmd + 클릭 > Embed in Stack을 사용해도 되지만, 코드에서 cmd + 클릭하여 생성도 가능 단축키로, cmd + shift + A로 오픈 Text 추가: shift + cmd + L 라이브러리 > Text struct ContentView: View { var body: some View { VStack { Text("Hello, world!") .font(.title) Text("sub text") } } } VStack의 생성자에서 alignment와 spacing 설정이 가능 struct ContentView: View { var body: some View { VStack(alignm..