일정 관리 앱 Planner
Flutter로 개발한 개인 일정 관리 앱입니다. 일간, 주간, 월간, 연간 화면을 제공해 사용자가 일정을 다양한 단위로 확인할 수 있도록 만들었습니다. 단순한 할 일 목록이 아니라, 기간 일정이 달력 위에 막대로 표시되도록 구현해 여러 날에 걸친 계획도 한눈에 파악할 수 있습니다.
프로젝트 개요
- 개발 형태: 개인 프로젝트
- 개발 목적: Flutter를 활용한 모바일 일정 관리 앱 구현
- 주요 기능: 일정 등록, 수정, 삭제, 완료 처리, 일간/주간/월간/연간 보기, 로컬 저장
- 사용 기술: Flutter, Dart, Material 3, shared_preferences
주요 기능
일정 등록 및 관리
사용자는 일정 제목, 시작일, 종료일, 시간을 입력해 일정을 등록할 수 있습니다. 종료일을 설정하면 여러 날짜에 걸친 기간 일정으로 처리되며, 종료일이 없는 단일 일정은 선택적으로 시간을 지정할 수 있습니다. 등록된 일정은 수정, 삭제, 완료 체크가 가능합니다.
일간 보기
일간 화면에서는 선택한 날짜의 일정을 확인할 수 있습니다. 이전 날짜와 다음 날짜로 이동할 수 있고, 날짜 선택기를 통해 원하는 날짜로 바로 이동할 수 있습니다. 시간이 지정된 일정은 시간순으로 정렬되도록 구현했습니다.
주간 보기
주간 화면은 일요일부터 토요일까지 한 주의 일정을 요일별로 보여줍니다. 오늘 날짜는 강조 표시되며, 기간 일정은 포함되는 모든 날짜에 표시됩니다.
월간 보기
월간 화면은 달력 형태로 일정을 보여줍니다. 단일 일정은 날짜 칸 안에 간단히 표시되고, 여러 날짜에 걸친 기간 일정은 색상 막대로 표시됩니다. 날짜를 누르면 하단 시트가 열려 해당 날짜의 일정 목록을 자세히 확인하고 바로 일정을 추가할 수 있습니다.
연간 보기
연간 화면에서는 12개월을 미니 달력 형태로 확인할 수 있습니다. 기간 일정은 각 월의 미니 달력 위에 작은 막대로 표시되며, 특정 월을 선택하면 상세 달력 팝업을 볼 수 있습니다.
구현 포인트
StatefulWidget을 활용해 탭별 화면 상태를 관리했습니다.PlannerTask모델을 만들어 일정 제목, 날짜, 시간, 완료 여부, 기간 정보를 구조화했습니다.shared_preferences를 사용해 앱을 종료해도 일정 데이터가 유지되도록 구현했습니다.- 일정 데이터를 JSON 형태로 직렬화해 저장하고 다시 불러오도록 구성했습니다.
- 월간/연간 화면에서 기간 일정이 겹칠 경우 최대 3개 라인까지 나누어 표시하는 로직을 구현했습니다.
- 기간 일정이 주를 넘어가는 경우에도 달력 위에서 자연스럽게 이어지는 막대로 보이도록 처리했습니다.
기술 스택
- Flutter
- Dart
- Material 3
- shared_preferences
- flutter_launcher_icons
프로젝트를 통해 배운 점
이 프로젝트를 통해 Flutter의 위젯 구조와 상태 관리 방식, 로컬 데이터 저장 방식, 날짜 기반 UI 구성 방법을 익혔습니다. 특히 월간 달력에서 기간 일정을 시각적으로 표현하기 위해 날짜 범위 계산, 일정 겹침 처리, 라인 배치 로직을 직접 구현하며 실제 앱 개발에서 필요한 문제 해결 과정을 경험했습니다.
