Xcode에서 SwiftUI 시작하기

SwiftUI by vbflash

 

Introduction

---

  블로그를 통해 SwiftUI를 올해 말까지 혹은 제가 원하는 목표치가 다다를 때까지 포스팅을 하려고 합니다. 목표치는 제가 만들고자 하는 App의 UI를 완료할 때까지라서 올해 말이 되기전에 포스팅을 통한 연재가 빨리 끝이 날 수 있습니다. 블로그 포스팅이 빨리 끝맺음이 올지라도 필요한 부분들은 블로그를 통해 계속 업로드를 하도록 하겠습니다. 

 

 

관련 포스팅

---

• 포스팅 - 링크 없음
• 포스팅 - 링크 없음

 

포스팅의 목차가 되는 페이지로서, 향후 작성하는 포스팅의 링크를 현재 포스팅에서 일괄 정리 예정입니다. 

 

 

SwiftUI 시작하기

---

기존의 iOS App을 개발하는 것과 동일하게 Single View App을 선택하고 넘어가시면 됩니다. 

 

 

  그리고 Project를 생성하기 위해서 Name, Team, identifier 등을 선택하시면 됩니다. 이때, User Interface에서는 SwiftUI 를 선택하고 넘어가셔야 합니다. 기존에는 스토리보드(StoryBoard)를 이용하였지만, 이번에 계속 SwfitUI를 공부하기위해서는 꼭 확인하고 넘어가주시기 바랍니다. 

 

 

프로젝트를 생성하면 다음과 같은 화면이 보이게 됩니다. 

화면 구성에 앞서, Preview Refresh(option+cmd+P)를 눌러봅시다.  

 

 

프리뷰(preview)화면이 보이게 됩니다. 이때, Simulator에 설정된 iOS Device에 따라 다르게 보일 수 있으니, 원하는 기기를 선택 후 다시 Preview Refresh(option+cmd+P)키를 눌러보시기 바랍니다. 이때 ContentsView.swift 코드를 선택해야만 우측에 Preview가보이게 됩니다. 

 

 

참고로 Editor > Previews > Refresh (Option+Cmd + P) 에서 단축키를 확인 할 수 있습니다. 

 

 

 

향후 포스팅 예정 맛보기

---

 

향후 포스팅은 App의 가장 기본적인 채팅UI를 먼저 만들어서 계속 업데이트를 하려고 합니다. 상위 그림은 메인화면/친구목록/채팅목록/채팅방(내부)/Tab네비게이션 화면으로 구성되어있습니다. 이후 포스팅에서 UI화면을 개선하여 소개 드릴 예정입니다.  아직은 공부를 하며 포스팅 중으로서 잘못된 부분이나 오류가 있을 수 있습니다. 이런 부분들은 댓글로 남겨주시면, 확인 후 포스팅에 업데이트 할 수 있도록 하겠습니다.