Basic Table View - UI
안녕하세요! 오늘은 스위프트가 아닌 ios 개발 관련된 포스팅을 해보려합니다. 오늘 이야기해 볼 주제는 바로 TableView입니다. 모바일 어플리케이션 관련 서적이나 블로그들을 보면 기본적으로 다루는 요소 중 하나입니다. 그 만큼 가장 많이 쓰이기도 하는 요소 중 하나입니다.
안드로이드를 공부하시고 계시거나 하셨더라면 RecyclerView 혹은 ListView에 관해서 많이 들어보셨을 것입니다.
그와 같이 ios에는 TableView가 존재합니다. 우선 TableView가 무엇인지 모르시는 분들을 위해 간단한 예제들을 통해서 알아보도록 하겠습니다.
Intro
위에서 언급했던 것과 마찬가지로 거의 모든 모바일 어플리케이션에는 TableView가 들어가게 됩니다. 카카오톡의 친구목록 및 대화방 목록, Gmail 메일 리스트들, Instagram 새로운 피드들 등등..
이렇게 데이터들의 리스트들을 나열할 때 가장 많이 쓰이는 것이 TableView 입니다.
TableView를 본격적으로 들어가기 전 숙지하고 계셔야할 사항들입니다.
- Xcode 사용법
- Delegation Pattern
- Protocol
이 포스팅에서는 정말 간단하디 간단한 날씨 알림 어플리케이션을 만들어보겠습니다. 물론 서버 통신은 다루지 않습니다. 그럼 본격적으로 시작해보도록 하겠습니다.
1) Resource and UI setting
먼저 프로젝트 내에 사용할 날씨 이미지를 프로젝트 폴더 안에 넣어주어야 합니다.
1. Xcode 프로젝트 폴더를 우클릭 후 New Group을 통해 폴더를 생성해줍니다. 해당 폴더 내에 사용할 이미지를 넣어줍니다.
2. Main.storyboard에서 Table View를 먼저 올리고 그 위에 Table View Cell을 드래그하여 올립니다.
3. Main.storyboard에서 왼쪽 뷰들의 목록 중 Table View 를 선택 후 우측 메뉴의 Size Inspector에서 Row Height의 Automatic을 해제하여 크기를 수동으로 조절할 수 있도록 합니다. 그리고 원하는 사이즈만큼 Table View Cell을 드래그 하여 크기를 조절합니다.
4. 마지막으로 왼쪽의 뷰 목록에서 Table View Cell을 선택 후 우측 메뉴 Attributes Inspector에서 Style을 Subtitle로 바꿔줍니다.
여기까지가 기본적인 TableView를 실습하기 위한 기본적인 세팅이였습니다.
다음 시간에는 본격적인 코드를 작성해보는 시간을 갖도록 하겠습니다.
감사합니다.
Next : Basic TableView - Code
날씨 아이콘 출처