iOS (9) 썸네일형 리스트형 [iOS] Apple Login 구현하기 (MVVM) 오늘은 Apple Login을 MVVM 구조로 구현해보려 합니다. 먼저, Apple Login을 하기 위해서는 개발자 계정이 필요합니다. 1. Set the bundle ID https://appstoreconnect.apple.com/apps 위 사이트에 로그인 한 후, 앱 옆에 + 버튼 -> 신규 앱을 누르면 다음과 같은 화면이 나옵니다. https://appstoreconnect.apple.com/login?targetUrl=%2Fapps&authResult=FAILED appstoreconnect.apple.com 인증서, 식별자 및 프로파일을 클릭해줍시다. Bundle ID를 입력한 후 아래에 있는 Sign In with Apple 항목에 체크해줍시다. 이제 ID를 등록하였습니다. 2. MVC로.. [SwiftUI] Grid에 대해서 알아보자 List?? Grid? List는 UIkit에 테이블뷰와 거의 유사하고, Grid는 CollectionView라고 생각하면 이해하기 쉬운 것 같습니다. 가장 큰 차이점으로는 List는 수직스크롤만 가능하다는 점이고, Grid는 수직, 수평 스크롤 둘다 가능합니다. 수직은 LazyVGrid, 수평은 LazyHGrid를 사용합니다. 예시 1부터 99까지의 숫자들을 수직 형식으로 구현해보려 합니다. Cell로 사용될 View를 다음과 같이 작성해주었습니다. 먼저 LazyVGrid로 수직 방향으로 스크롤이 되도록 구현하려 합니다. 그런데 [GridItem] 타입을 넣어주어야 하는군요. LazyGrid의 layout을 구현하는 용도라고 합니다. GridItem을 작성하려고 하니 다음과 같은 enum 타입의 무언가.. [SwiftUI] State, Binding에 대해 알아보기 State란? SwiftUI에서 관리하는 값을 읽고 쓸 수 있는 property wrapper 속성을 선언할 때, 앞에 @State를 작성해주어야 합니다. 상태가 변경된다면 View는 자동으로 업데이트 됩니다. SwiftUI에서는 이러한 상태 정보를 따로 보관하고, 관리합니다. 주의해야할 점으로 @State로 작성한 경우에는 private 접근 제어자를 붙여주어야 하고, 가장 상위 뷰에서 작성해야 합니다. Binding이란? 값을 읽고 쓸 수 있는 property wrapper Binding을 사용하여 State를 사용한 View와 양방향 연결을 만들 수 있습니다. 사용 @State를 사용해 버튼이 눌릴 때 toggle이 되도록 작성하였습니다. 이 버튼을 따로 빼주어서 사용하고 싶은데, 저 isPlayi.. [SwiftUI] Stack을 사용해 Layout 그리기 Stack UIKit에서는 AutoLayout을 사용하여 layout을 구성했는데, SwiftUI에서는 Stack을 사용한다고 합니다. HStack, VStack, ZStack을 사용하며 생김새는 다음과 같습니다. UIKit의 StackView와 비슷한 것 같네요. Spacer와 Divider를 사용하면 유연하고 복잡한 레이아웃을 만들 수 있다고 합니다. Stack Initializer alignment: 서브뷰를 정렬 (default: .center) spacing: 서브뷰의 간격 (default: nil) content: 구현부 spacing은 HStack과 VStack에만 존재합니다. Spacer 그렇다면 Spacer란 뭘까요? 스택에 포함된 경우, 스택 레이아웃의 주축을 따라 확장되며 스택에 포함.. [SwiftUI] Modifier에 대해 알아보자! Modifier란? 각 컴포넌트들의 속성을 바꿀 수 있습니다. 쉽게 말해서 옵션이나 설정 값들을 변경할 수 있습니다. 예를들어, Text의 font를 정해줄 때 다음과 같이 사용합니다. 여기서 사용된 .font가 modifier 입니다. 이 .font를 한 번 살펴보겠습니다. Text를 받아서 Text를 리턴해주고 있네요. 즉, 기존 Text에서 속성을 변경한 Text를 리턴해주고 있습니다. 또한 modifier는 순서대로 진행되며, 컴포넌트들의 타입별로 다르기 때문에 순서에 주의해야합니다. 순서 주의 Text에서 View로 리턴하는 modifier를 사용한다면 이제 타입이 Text에서 View로 변경되었기 때문에 Text를 받는 modifier는 사용할 수 없습니다. 다른 타입에서도 마찬가지 입니다. .. [iOS] UITableView를 사용해 Cell별로 알맞는 데이터 보여주기 지난 포스팅에서 UITableView를 사용해서 화면에 Cell을 나타내도록 구현하였습니다. https://dev-mandos.tistory.com/66 [iOS] UITableView를 사용해서 화면에 Cell 나타내기 UITableView TableView는 하나의 열을 사용해서 데이터를 뷰에 나타내는 View 입니다. 또한 UITableView는 UIScrollView를 상속받고 있고, 수직 스크롤만 지원합니다. TableView는 어디에 사용될까요? 아이폰의 연 dev-mandos.tistory.com 그런데, 이제 이 Cell별로 알맞는 데이터를 보여줘야겠죠? 저는 Cell에 일정의 제목을 하나씩 보여주고 싶어요. 먼저 UITableViewCell을 상속받는 class 파일을 하나 만들어주겠습니.. [iOS] UITableView를 사용해서 화면에 Cell 나타내기 UITableView TableView는 하나의 열을 사용해서 데이터를 뷰에 나타내는 View 입니다. 또한 UITableView는 UIScrollView를 상속받고 있고, 수직 스크롤만 지원합니다. TableView는 어디에 사용될까요? 아이폰의 연락처, 설정, 메시지, 카카오톡 친구 목록, 인스타그램 등에 사용됩니다. 설정 앱을 한번 보실까요? 비슷하게 생긴 컴포넌트를 하나의 Cell이라고 표현하고, 수직 방향으로 나열할 수 있도록 도와주는 것이 TableView의 역할 입니다. StackView나 View로 만들어도 상관없지 않을까? 하는 생각이 드실 수 있습니다. 그렇다면 1000개의 Cell이 있다면 어떨까요? StackView로 만든다면 1000개를 다 만들어줘야 하고, 맨 마지막에 있는 Ce.. [iOS] UIImage Rendering Mode에 대해 알아보자! 앱을 개발하면서, SF Symbols에 있는 이미지를 사용할 때가 있는데, 이미지의 색깔이 이상하게 나오는 경우가 있었을 것입니다. UIImage의 Rendering Mode에 대해 알아봅시다. 간단하게 스토리보드로 ViewController에 UIImageView를 하나 추가하고, Outlet으로 연결해주었습니다. 이제 이 이미지뷰의 이미지를 "cloud.rain.fill"로 코드로 작성해주겠습니다. SF Symbols에서 확인해보니 이렇게 생겼군요..! 실행된 시뮬레이터를 보면 초기로 셋팅된 틴트컬러로 이미지가 나오는 것을 확인하실 수 있습니다. 이제 UIImage의 Render Mode에 대해 확인해보겠습니다. 가장 먼저 공식문서를 살펴보겠습니다. https://developer.apple.com/.. 이전 1 2 다음
