🍎 Simple Diary App
🍏 기능 상세
- 일기장 탭을 누르면 일기 리스트를 표시할 수 있습니다.
- 즐겨찾기 탭을 누르면 즐겨찾기한 일기 리스트를 표시할 수 있습니다.
- 일기를 등록, 수정, 삭제, 즐겨찾기 할 수 있습니다.
🍏 활용기술
- UITabBarController
- UICollectionView
- NotificationCenter
🍏 기능구현
1. 일기장 앱을 구성하는 뷰들의 UI 기초 디자인하기
- UITabBarController, UINavigatinContoller 및 필요한 UIViewController들을 생성하고, relationship걸어준 후, 기초 UI디자인 수행
2. UITabBar와 UITabBarController 이용하여 일기장 화면과 즐겨찾기 화면을 분할.
- UITabBar: 앱에서 서로 다른 하위작업, 뷰, 모드 사이의 선택을 할 수 있도록, 탭바에 하나 혹은 하나 이상의 버튼을 보여주는 컨트롤
- UITabBarController: 다중 선택 인터페이스를 관리하는 컨테이너 뷰 컨트롤러로, 선택에 따라 어떤 자식 뷰 컨트롤러를 보여줄 것인지가 결정
3. 주요 코드들
- NotificationCenter : 이름 그대로 '알림센터'라 생각하면 됩니다. 데이터를 주는 쪽의 뷰컨트롤러 안에서 Post하면, Observer를 돌리고 있는 뷰컨트롤러에서 데이터를 받을 수 있습니다. 데이터 전달 시 자주 이용하는 Delegate위임 방식은 1:1 교환 방식이기 때문에 지금 일기장 앱처럼 여러 뷰컨트롤러에 동시에 데이터를 전달해야하는 앱에서는 적합하지않습니다.
- 아래코드들은 '일기장을 삭제하는 버튼을 가진 뷰컨트롤러' 에서 삭제버튼을 눌렀을 때, '일기목록을 표시하는 뷰컨트롤러'와 '즐겨찾기된 일기목록을 표시하는 뷰컨트롤러' 모두에서 삭제되도록 NotificationCenter를 이용해 정보를 전달한 코드입니다.
(위) post, (아래) addObserver
- 또한 코드를 보면 UUID() 로 객체의 고유 정보 uuid값을 이용하여 일기목록을 찾는 것을 볼 수 있습니다. 일반일기목록화면과 즐겨찾기된일기목록화면은 등록된 일기의 수가 다르기 때문에 indexPath로 접근하면 에러가 발생할 수 있기 때문에 uuidString을 이용하여 접근하였습니다.
4. Full Code
GitHub 링크
🍏 느낀점
-
UITabBarController에 대해 알고 나니, 실제 사용중인 여러 앱들을 보았을 때 많은 앱에서 탭바를 사용하고 있는 모습이 보였습니다. 알고 나니 쉽게 할 수 있을 것 같으면서도 그 안에 또 다시 세부적인 구성들을 보면 아직 갈 길이 멀구나~ 하는 생각이 듭니다.
-
이번 토이프로젝트는 유독 시간을 많이 할애한 듯합니다. 생각보다 많은 코드가 쓰였고, 새로운 개념들이 많았습니다. 그래서 어려움도 많았는데 반복해서 코드를 다시 보다보니 점점 이해가 되고있음을 느꼇고, 구글링하며 찾아볼수록 지식이 하나씩 느는 느낌이 들었습니다.
-
이렇게 적은 뷰컨트롤러들 사이에 일어나는 정보 교환도 아직은 헷갈리는 부분도 있었습니다. 이에 익숙해지는 공부를 계속 수행해나가야할 것 같고, 나중엔 정말 많은 뷰컨트롤러들이 서로 연결되어있어도 잘 이해할 수 있도록 해야할 것 같습니다.
-
물론 클린코드기술도 연마해야겠지요. 감사합니다.
안녕하세요 글 보다가 안드로이드로 만들고 싶어서요 혹시 ui디자인 툴 어떤걸 사용하셨어요??