2주차_issue

[leewoojye]

✅ 2주차 기본과제 todoList ✅

• 시작화면에서 해당 나의 위치 뷰를 선택하면, 우측의 날씨 상세보기뷰로 Push되어 화면이 전환된다.
• 상세보기뷰는 수직 스크롤이 가능하고, 중간의 시간대별 날씨의 경우 수평스크롤이 가능하다.
• 하단의 리스트(listbar) 보기 버튼을 선택할 경우, 홈화면으로 POP된다.
• 추가조건) figma에 제시된 조건을 따라 폰트 크기, 종류를 맞추주어야 한다.

🔍 기능 세분화 🔍

• 홈화면

  • 검색바를 탭하면 텍스트 필드를 채울 수 있는 모드로 변환되고, 쓰는 도중 우측 x 버튼으로 지우기가 가능하다.
  • '나의 위치' (일명 weatherinfo 박스)가 적힌 박스는 여러 개 수직으로 나열할 수 있으며, 수직 스크롤이 가능하다.
  • weatherinfo 박스를 클릭할 경우 상세보기 페이지로 화면이 전환된다. 이때 화면이 우측으로 쓸리며 전환된다.
  • 상세보기 화면에서도 홈화면의 날씨 정보를 표기해야 하기 때문에, 홈화면으로부터 날씨 데이터 정보를 전달 받는다.

• 상세보기 화면

  • 하단 리스트 아이콘을 누를 시 홈화면으로 화면이 전환된다.
  • 시간대별 날씨와 텍스트라벨이 적힌 박스는 수직으로 스크롤이 가능하며, 시간대별 날씨 부분은 수평으로 스크롤이 가능하다.
  • 배경화면은 단일 날씨 사진으로 통일되어 있다.
  • 시간대별 날씨의 경우 시간대가 1시간 단위로 오르는데, 이는 반복문을 사용해서 구현하였다.

🗂️ 파일목록 설명 & 뷰/객체 간 계층 및 관계 🗂️

• ViewController.swift : 홈화면을 나타내는 뷰컨트롤러로, '날씨'라벨이 적힌 topview, '나의 위치'가 적힌 weatherinfo 뷰를 내포하고 있다. 화면 전환을 위해 네비게이션 컨트롤러를 사용했는데, 루트뷰컨트롤러를 ViewController로 설정했다.
• weatherinfoview.swift : 홈화면에서 '나의 위치'가 적힌 박스를 나타낸다. 날씨, 시간, 온도, 위치에 대한 정보를 ViewController에서 받아온 후, 각 요소들의 레이아웃을 맞춰준다. 이 뷰는 UIView로, 이벤트 감지(클릭)는 수행하지만, 이벤트 감지에 대한 화면 전환은 delegate 패턴을 통해 ViewController에게 위임한다.
• SecondViewController.swift : weatherinfoview를 클릭하면 전환되는 날씨 상세보기 페이지다. 홈화면으로부터 전달 받은 데이터를 표기하는 topview, 시간대별 날씨 그리고 현재 날씨정보를 텍스트 라벨로 나타내는 box뷰, 그리고 기타 기능을 수행하는 하단바 bottomview를 내포하고 있다. 기본적으로 ScrollView안에 ContentView를 내포시킨 구조를 갖고 있으며, 전체적인 뷰 구조는 전체view >> topview, scrollview1, lineview, bottomview >> scrollview1 안에 box뷰 >> box뷰 안에 descriptionview, lineview, scrollview2 >> scrollview2 안에 contentview2 >> contentview2 안에 stackview >> 개별 UIView 구조를 띄고 있다.

🔨 기능별 세부구현 방안 🔨

• delegate 패턴을 활용해 weatherinfo 객체에서 이벤트(클릭)를 감지하면 ViewController.swift에서 화면 전환 역할을 대신 수행하였다.
• 여러 텍스트라벨이나 아이콘버튼이 들어간 topview, bottomview의 경우 프로퍼티 이니셜라이저에서 텍스트와 아이콘들의 레이아웃 설정, 값/이미지 할당까지 담당하였다. 이때 프로퍼티 이니셜라이저에 값을 할당하는 코드까지 포함시켰기 때문에 init()과 동시에 수행되면 안되는 문제가 있었는데, 키워드 lazy 를 통해 해당 프로퍼티가 처음으로 쓰인 상황에서만 이니셜라이저가 수행되게 하였다.
• 화면 전환에는 delegate 패턴을 사용했지만, 데이터를 전달하는 과정에서는 객체를 호출할 때 매개변수를 넣어주는 방식을 사용했다. 그리고 데이터를 전달 받을 객체는 init() 이니셜라이저를 통해 객체 내에 선언된 변수에 전달 받은 값을 저장하게 하였다. 또한 이렇게 객체 내 변수에 저장된 값들은 프로퍼티 이니셜라이저들이 접근하여 사용할 수 있게 하였다.