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

투명 뷰로 감싸고 터치 이벤트 받는 방법투명 뷰로 감싸는 경우?뷰를 구성하고 특정 영역을 터치 이벤트 영역으로 잡고 싶거나, 접근성을 위해서 특정 뷰로 덮어서 그 부분만 특정 접근성을 주고 싶을때, 가장 단순한 방법은 투명 뷰로 감싸서 처리SwiftUI에서는 투명 뷰로 감싸기 위해서 아래처럼 사용이 가능감쌀 뷰에 overlay를 선언하고 그 위에 Color.clear를 선언하고 여기에 접근성과 tapGesture를 주어서 간편하게 뷰를 감싸는 방법이 존재struct ContentView: View { var body: some View { VStack { Image(systemName: "globe") .imageScale(.large) ..

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") ..

retroactive 개념단어의 의미"효력이 소급하는"이라는 의미소급하다란 의미는 새롭게 적용된 것이 과거에도 영향을 미친다는 의미ex) 직장인이 25년도 3월에 연봉이 올랐는데, 1월과 2월 월급도 3월에 연봉 오른 값으로 돈을 더 주는 것Swift6.0에서도 @retroactive를 사용하여 코드의 유연성을 가져갈 수 있는데 아래에서 계속 설명@retroactive의 의미이번 프로젝트에서 Foundation에 있는 Date를 사용하다가 id가 필요하여 내가 임의로 Identifiable을 선언한 상태extension Date: Identifiable { public var id: TimeInterval { timeIntervalSince1970 }}1년 후에 갑자기 애플이 Date에 Identi..

모두 알고 있는 클로저 의미 돌아보기다른 부분으로 전달할 수 있는 독립적인 코드 블록{ (매개변수) -> 반환형 in 실행 코드} ex) 클로저 예시 - 기능 실행let sayHello = { (name: String) -> String in return "Hello, \(name)!"}sayHello("Jake") // "Hello, Jake" ex) 클로저 예시 - 기능 제공let multiply = { $0 * $1 }print(multiply(4, 5))이처럼 클로저는 다른 부분으로 전달할 수 있고 그 것을 저장하여 실행을 지연시킬 수 있는데 여러가지 사용처가 존재설계 관점에서의 클로저설계 관점에서의 클로저의 역할은 해당 기능을 사용하려는 쪽에 위임 하는 행위의 의미를 가지고 있음커스텀..

커스텀 뷰 만들기간단한 커스텀 뷰의 경우는 단순히 데이터만 받아서 그 데이터에 맞게끔 뷰가 그려지지만, 데이터와 특정 뷰를 주입하여 그 뷰도 커스텀 뷰의 하나가 되도록 설계도 가능뷰를 주입받는 형태로 구현해야하는데 좋은 방법은? 아래에서 계속뷰를 주입받는 형태로 구현하는 테크닉ex) 예제로 사용할 뷰: 상단에 header 타이틀 형태가 있고 하단에는 배열로 넣어준 뷰들이 보여지는 뷰struct ContentView: View { var body: some View { CustomView(title: "상단 타이틀", items: [1,2,3]) { item in Text("item: \(item)") } }}1) 사용하는 쪽에서 만들 뷰에 필요한 데..

* 가끔 개발을 하다가 commit파일에 DS_Store라는 파일이 보이는데 이 글에서 그것이 무엇인지 알아보기DS_Store란?DS_Store(Desktop Services Store)란 Mac 운영체제에서 디렉토리에 관한 *메타 데이터를 저장된 파일저장하는 *메타 데이터 아이콘 위치보기 설정 (예: 아이콘 보기, 목록 보기, 갤러리 보기 등)창 크기 및 위치디렉토리에 대한 기타 사용자 정의 설정이런 정보는 개발할때는 불필요하므로 개발 디렉토리에는 gitignore를 활용하여 DS_Store를 제외시켜주기DS_Store 만들어보기DS_Store에 관한 개념을 위에서 알아보았듯이 운영체제에서 자동으로 생성해주는데 정확히 어떻게 자동생성되는지 테스트하여 이해하기1) Finder를 사용하여 디렉토리를 열기..

Sticky 헤더 구현 아이디어LazyVStack의 pinnedViews 파라미터에 [.sectionHeaders]를 넣을 수 있는데 이 값을 사용하면 sticky header 구현이 매우 용이LazyVStack(pinnedViews: [.sectionHeaders])위 옵션을 주고 Section에 뷰를 넣으면 그 뷰가 sticky로 자동으로 동작됨ScrollView { LazyVStack(pinnedViews: [.sectionHeaders]) { // 상단 콘텐츠 VStack { Text("Top Content") .font(.largeTitle) .padding() ..

뷰 정렬 개념아래 코드를 보면 흔히 사용되는 VStack 컴포넌트와 .frame 함수를 사용하여 아래처럼 구현했으나 잘못 구현된 코드UI는 의도된 대로 나올 수 있을지라도 추후에 수정할 때 잘못 적용될 확률이 큼ex) UI들을 좌측 정렬을 기준으로 배치하도록 구현된 코드VStack(alignment: .leading) { Image(systemName: "globe") .resizable() .frame(width: 30, height: 30) .foregroundStyle(.tint) Text("Hello, world!")}잘못 구현된 점은 개념을 알아보고 아래에서 확인VStack과 frame의 alignmentVStack(alignemnt:)는 ..