모여런 메인 UI 구현하기

[heechokim]

내용

• 피그마 1차 MVP 시안 중 모여런 메인 화면 UI를 구현합니다.

[heechokim]

피그마 px 을 그대로 dp로 사용하는지? -> 그대로 사용
네비게이션 각 화면을 프래그먼트로 구현했는데 이것도 액티비티로 구현해야 했던 건지? -> 노 프래그먼트 사용
피그마에서 svg 어떻게 추출하는지? 수정 권한이 없어서 그룹화가 안 된다. -> 아 찾음 Export 버튼 위에 있네 아래에 있었던 거 같은뎅 ㅋㅋ

[heechokim]

TODO

모여런 메인 화면

• 바텀 네비게이션 메뉴 3개로 수정하고 피그마 아이콘 반영하기
• 주영님, 함께 달려볼까요? 부분 색상 수정하기
• 방 만들기 버튼 추가하기
  • 버튼 스타일 적용해야 함
• 참여 중인 러닝 방 레이아웃 넣기
  • 컨테이너로 하나 만들고, 디폴트 visible gone 처리하기
• 실시간 러닝 방 / 참여 모집 중인 방 토글할 수 있는 UI 만들기
  • 디테일한 스타일 넣어야 함
• 방 리스트 보여주는 리사이클러뷰 배치하기
• 토글 버튼 눌렀을 때 방 리스트 notifyDataSetChanged() 해주는 방식으로 구현하기
• 리사이클러뷰 아이템 UI 구현하기
  • 디테일한 스타일 넣어야 함
• 리사이클러뷰 어댑터 클래스 작성하고 설정하기

방 만들기

• 툴바 구현하기
• 썸네일 부분 이미지 뷰 잡고, 오른쪽 하단 카메라 버튼 넣기
• 각 입력 EditText UI 구현하기
• 각 EditText 입력 시 피그마 대로 구현하기
• 가장 하단 방 만들기 버튼 만들기

방 만들기_썸네일 선택

• 툴바 구현하기
• 가장 큰 이미지 뷰 잡기
• 아래 3개씩 분리되어 있는 이미지 뷰 9개 구성하기

방 참여하기

• 툴바 구현하기
• 썸네일 구현하기
  • 피그마 이미지 넣어야 함
  • status bar 부분까지 이미지 뷰가 차지하도록 구현해야 함
• 정보 구현하기
  • 정보 테두리 둥글게 해야 함
• 남은 시간 1시간 이상일 때 공지 + 관심 유저 구현하기
• 남은 시간 1시간 미만일 때 공지 + 그래프 + 참여 유저 구현하기
• 공유 구현하기
• 버튼 구현하기