본문 바로가기
💻 Development/UIKit

[App Dev Tutorials] Getting started with Today ~

by Claudia 끌라우 2023. 10. 5.
반응형

* 공부했던 내용을 주관적으로 해석하여 '제가' 이해하기 쉽도록 작성하였습니다. 잘못된 정보가 있을 시 알려주시면 제게 큰 힘이 됩니다!


[ Getting started with Today ]

지난 기간동안 Scrumdinger을 만들면서 Swift와 SwiftUI에 대한 전반적인 이해를 했다면,

오늘부터는 UIKit을 공부를 해보려고 한다! 역시나 자료는 App Dev Tutorials

 

< UIKit overview >

UIKit는 그래피컬 프레임워크이다. -> 디자인을 하듯, 하나하나 그려나간 다음 역할을 부여하는 방식이라고 함.

UIKit을 사용하면 포괄적인 표준 컴포넌트 라이브러리를 사용하여 앱의 인터페이스를 정의하고 관리할 수 있다.

 

광범위한 API 지원 

  • 거의 또는 전혀 수정하지 않고 iOS 앱을 빌드하는 데 필요한 핵심 객체, 보기 및 컨트롤을 포함하여 UIKit 프레임워크의 광범위한 항목 라이브러리에 액세스할 수 있습니다.

구성 레이아웃 

  • 재사용 가능한 작은 구성 요소로 컬렉션 보기를 구성하고 셀에 상태 기반 업데이트를 적용하여 유연한 시각적 레이아웃을 만듭니다.

정확한 UI 표시

  • 오토 레이아웃을 사용하여 프로그래밍 방식으로 뷰를 작성하든 인터페이스 빌더를 사용하든 모든 방향의 모든 Apple 기기에서 작동하는 레이아웃을 만들 수 있습니다.

레거시 앱 지원

  • iOS 13 이전에는 개발자가 모든 앱을 UIKit에서 빌드했습니다. iOS, watchOS 또는 tvOS에서 레거시 앱을 유지 관리하거나 확장하는 경우 UIKit에 대한 좋은 기반이 필요합니다.

강력한 커뮤니티 채택 

  • Apple 문서뿐만 아니라 UIKit 커뮤니티의 광범위한 콘텐츠와 지원을 활용할 수 있습니다.
    SwiftUI와의 상호 운용성-UIKit과 SwiftUI를 쉽게 통합하여 두 프레임워크의 장점을 모두 활용할 수 있습니다.

-> 뭔가 디자이너의 입장으로서, UIKit방식이 잘 맞을 수 있겠다 라는 생각이 들었다!

피그마에도 오토레이아웃 개념이 존재하고, UI를 그릴 때 요소 하나하나 쌓아서 그리는 방식이 디자인툴과 유사하지 않나?

 


UIKit essentials

[ Creating a list view ]

< Section 1 Create a project >


< Section 2 Add a collection view controller >

뷰컨트롤러는 뷰와 데이터모델을 연결하는 역할을 해준다.

각 뷰 컨트롤러는 뷰 계층을 관리하고, 뷰의 콘텐츠를 업데이트하고, 사용자 인터페이스의 이벤트에 응답하는 일을 담당한다.

 

초기 뷰 컨트롤러 값은 앱이 스토리보드를 로드할 때 로드되는 뷰 컨트롤러를 결정한다.
앱에는 여러 스토리보드가 있을 수 있다. 앱 프로젝트 파일의 메인 인터페이스 설정은 앱이 실행될 때 로드되는 스토리보드를 결정한다.

 


< Section 3 Create a reminder model >

UIKit은 Models - View - Controller (MVC) 구조를 가진다.

뷰 오브젝트는 데이터의 시각적 표현을 담당하고, 모델 객체는 앱의 데이터와 비즈니스 로직을 관리한다.

뷰컨트롤러를 만듦으로써, 모델이 뷰를 직접 컨트롤하지 않는 구조가 되었다. 뷰 또한 마찬가지!

 

Reminder을 만들고 필요한 속성을 만들어주는데, 각 속성에 대한 Initializers를 만들 필요가 없다.

스위프트 컴파일러는 구조가 기본값 없이 속성을 저장한 경우에도 각 구조에 멤버별 Initializers(초기화)를 자동으로 제공합니다.

 

Initializers란?
-> 모든 프로퍼티를 기본값으로 초기화 하는 것

기본 값을 가지고 있지 않다면, 그것은 초기화 실패로, 즉 인스턴스(객체)가 생성되지 않는다.

 

하지만 Swift 컴파일러 구조는 기본값을 자동으로 제공함으로 지정해주지 않아도 인스턴스가 생성된다는 뜻!

https://babbab2.tistory.com/167

 

Swift) 초기화(Initializers) 이해하기 (1/6) - 구조체(Struct)의 초기화

안녕하세요, 소들입니다! :) 제 포스팅의 시작은 Swift / iOS 기초를 깊게 다지자!! 였는데, 아직 다루고 싶은 글이 너무 많은데 언제부턴가 기초에 대해서는 안 썼더라구요 T.T 그래서 다시 Syntax 관

babbab2.tistory.com


#if DEBUG
extension Reminder {
}
#endif

 

 

 

if DEBUG 플래그는 릴리스용 앱을 빌드할 때 동봉된 코드가 컴파일되지 않도록 하는 컴파일 지시어다.

이 플래그를 디버그 빌드에서 코드를 테스트하거나, 샘플 테스트 데이터를 제공하는 데 사용할 수 있습니다.


< Section 4 Configure the collection as a list >

구성 레이아웃을 사용하여 컬렉션 뷰를 구성하기 시작한다. 구성 레이아웃(compositional layout)을 사용하면 섹션, 그룹 및 항목과 같은 다양한 구성 요소를 결합하여 보기를 구성할 수 있다. 섹션은 항목 그룹을 둘러싸는 외부 컨테이너 보기를 나타낸다.

 

ReminderListViewController에 listLayout을 만들어주고 반환한 뒤 viewDidLoad 때 만들어준 리스트를 불러와준다. 

https://zeddios.tistory.com/43

 

iOS ) View Controller의 생명주기(Life-Cycle)

안녕하세요! 오늘은 View Controller생명 주기에 대해 알아보겠습니다.iOS를 시작하려고 하거나, 배우고 있는 분들이라면 반드시 알아야 해요.하나하나 제대로 알아봅시다 ㅎㅎ View Controller의 생명주

zeddios.tistory.com


< Section 5 Configure the data source >

Cell registration - 셀의 외형과 내용을 어떻게 구성할지 정하는 것

 

indexPath : 중첩된 배열의 트리에서 특정 위치에 대한 경로를 함께 나타내는 인덱스 목록

 

defaultContentConfiguration()은 미리 정의된 시스템 스타일로 콘텐츠 구성을 만든다.

 

Type aliases : 기존 유형을 더 잘 표현할 수 있는 이름으로 참조하는 데 유용하다
사용자가 원하는 이름으로 타입 이름을 만들어 줄 수 있다. 즉, 타입의 별칭, 약칭

https://ios-daniel-yang.tistory.com/22

 

[iOS/Swift] 타입에일리어스(typealias)

Type Alias 사용자가 원하는 이름으로 타입 이름을 만들어 줄 수 있습니다. 즉, 타입의 별칭, 약칭입니다. 가독성 상승. 새로운 타입으로 변경이 아니라 기존 타입의 역할만 해줍니다. 표현식 // 이

ios-daniel-yang.tistory.com

/ 이름에서 첫 글자는 대문자 사용
typealias (사용할 이름) = (설정할 타입)

// ex
typealias NetworkService = Result<Data, Error>
typealias Calculator = (Double, Double) -> Double

 

Type aliases는 졸라귀엽당 -> 졸귀 (말을 줄여줌 / 별명붙여줌)


https://etst.tistory.com/81

 

[Swift 기본 문법] Swift를 처음봤을 때 낯선 문법들

[Swift 기본 문법] Swift를 처음보면서 낯설었던 문법들을 찾아보았다 확실히 C, C#, Java 같은 언어만 보다가 Swift라는 언어를 접했을 때 이게 무슨의미지? 왜 이런 문법을 쓰지? 같은 생각부터 C#, Java

etst.tistory.com


 

< Section 6 Apply a snapshot >

Diffable 데이터 소스는 스냅샷을 통해 데이터의 상태를 관리한다.(스냅샷 = 특정 시점의 데이터 상태)

스냅샷을 사용하여 데이터를 표시하려면 스냅샷을 만들고, 표시하려는 데이터의 상태로 스냅샷을 채운 다음, 사용자 인터페이스에서 스냅샷을 적용한다.

 

반응형

댓글