플러터13 [Flutter] 일정 관리 앱 날짜 선택 달력 UI 구현 – 네모진 투두 Ⅰ 날짜 선택 달력 UI 설계 방향 ‘네모진 투두’는 일정 관리 앱이기 때문에 달력을 통한 날짜 선택 기능은 핵심 요소였다. 이를 구현하기 위해 외부 라이브러리를 사용할 수도 있었지만, 한 번쯤은 직접 만들어보는 경험이 필요하다고 생각해 직접 구현에 도전했다. UI는 다른 달력 라이브러리들에서 자주 보이는 익숙한 형태를 유지하되, 원하는 방식으로 세부 기능들을 구성했다. 단순히 1일부터 31일까지 날짜를 나열하는 데서 출발해, 주 단위 배치, 전/다음 달 날짜 일부 표시까지 적용하며 기능을 확장했다. 또한, 선택한 날짜가 현재 표시 중인 월을 벗어날 경우, 선택한 날짜가 속한 월로 자동 갱신되도록 처리했고, 선택된 날짜를 시각적으로 강조하는 기능도 구현했다. 날짜 계산과 로직 구현에는 Dart의 Date.. 2025. 4. 15. [Flutter] 일정 관리 앱 일정 완료 처리 기능 – 네모진 투두 Ⅰ 일정 완료 처리 설계 방향 ‘네모진 투두’ 앱에서 일정 완료 처리 기능은 단순한 체크 여부를 넘어서, 반복 일정과 세부 일정까지 고려한 설계가 필요했다. 비정기 일정은 체크박스를 클릭하면 바로 완료/미완료 상태만 처리하면 됐지만, 반복 일정은 설계가 조금 다르다. 반복 일정은 repeat_task 테이블에서 일괄 관리되며, 완료 처리가 되었을 때만 task 테이블로 복사되는 구조로 설계했기 때문이다.여기에 더해 하나의 일정 안에 세부 일정 항목들까지 포함되는 구조다 보니, 세부 항목을 완료할 때도 task 테이블에 복사될 수 있게 조건을 정교하게 다듬을 필요가 있었다. 그래서 "체크박스를 한 번 클릭했을 때 어떤 조건에서 어떤 동작을 해야 하는가?"를 플로우 차트로 정리하고, 코드에서도 이 흐름을 최.. 2025. 4. 8. [Flutter] 일정 관리 앱 일정 추가 & 조회 – 네모진 투두 Ⅰ 반복 일정 처리 방식 설계 방향 ‘네모진 투두’ 앱의 주요 기능을 구현하면서 가장 중요하게 생각했던 부분은 '반복 일정을 어떻게 처리할 것인가?'였다. 예를 들어 매주 수요일에 반복되는 일정이 있다고 할 때, 이 일정을 미리 모든 날짜에 대해 데이터베이스에 생성해둘 것인지, 아니면 특정 조건이 충족될 때마다 동적으로 생성할 것인지에 따라 전체 데이터 구조와 앱의 성능, 효율성이 크게 달라질 수 있었다. 결론부터 이야기하자면 비정기 일정과 반복 일정을 각각 다른 테이블에 저장하고, 반복 일정의 경우 완료되었을 경우에만 해당 날짜의 비정기 일정으로 데이터베이스에 삽입하는 방법을 사용했다. 이 방법을 사용해 데이터의 중복을 줄이고, 효율적인 일정 관리 로직을 작성할 수 있었다. Ⅱ 사용 기술 및 데이터베이.. 2025. 3. 27. [Flutter] 일정 관리 앱 UI 설계 과정 - 네모진 투두 Ⅰ UI 설계를 시작하며‘네모진 투두’ 앱의 UI는 단순히 일정을 나열하는 것을 넘어, 사용자가 더 직관적으로 일정을 관리할 수 있도록 구성하는 데 중점을 두었습니다.특히 일정 생성부터 완료까지의 흐름이 자연스럽게 이어지도록 흰색 카드 디자인을 공통적으로 적용했으며, 일정 생성 화면에서는 최소한의 동작만으로 일정을 빠르게 등록할 수 있도록 설계했습니다. Ⅱ 메인 화면 설계상단바일주일 간격의 날짜 선택 버튼으로 일정을 확인할 날짜를 선택선택한 날짜의 일정 진행도를 표시일정 목록해당 날짜에 해당하는 모든 일정을 출력시간이 빠른 순서대로 정렬하되, 시간을 설정하지 않은 일정을 최우선 출력체크 박스를 통해 일정 완료 체크세부 항목을 모두 완료하면, 해당 일정도 자동 완료 처리 Ⅲ 일정 생성 화면 설계새 일정일정.. 2025. 3. 27. [Flutter] 일정 관리 앱 개발 후기 - 네모진 투두 Ⅰ 앱 소개‘네모진 투두’는 일정을 효과적으로 관리할 수 있도록 도와주는 기본형 투두앱입니다.날짜 중심으로 일정을 생성하고, 반복되는 일정도 손쉽게 등록하고 관리할 수 있습니다.깔끔한 UI와 직관적인 UX로 누구나 빠르게 사용할 수 있도록 설계했습니다. Ⅱ 왜 이 앱을 만들었나? Flutter를 배운 지 약 3개월쯤 되었을 무렵, 지금까지 익힌 내용을 점검하고 한 단계 더 실력을 끌어올리고 싶다는 생각이 들었다. 그래서 다양한 기본형 앱들을 만들어보자는 목표를 세웠고, 그 첫 프로젝트로 가장 대표적인 Todo 앱을 선택하게 되었다. 단순히 일정의 CRUD 기능만 구현하는 것은 너무 기본적인 수준이라 느껴졌기에, 반복 일정 관리 기능을 추가해 보기로 했다. 이 앱을 통해 지금까지 학습했던 Flutter의 .. 2025. 3. 26. [Flutter] 개념 확장 #03 - 상태 관리 (StatefulWidget & InheritedWidget) #03 개념 확장 - 상태 관리 (StatefulWidget & InheritedWidget)목차 ▲Ⅰ 상태관리의 필요성01. 상태 관리Ⅱ StatefulWidget을 이용한 상태 관리01. StatefulWidget02. StatefulWidget 상태 관리 예제Ⅲ InheritedWidget을 이용한 상태 관리01. InheritedWidget02. InheritedWidget 상태 관리 예제 Ⅰ 상태관리의 필요성01. 상태 관리모바일 환경에서는 사용자와의 상호작용을 기반으로 실시간으로 변하는 데이터와 UI를 처리해야 함사용자와 상호작용하는 순간마다 애플리케이션의 상태가 변경상태를 효율적으로 관리해야 앱의 성능 저하를 막고, 예상치 못한 오류를 방지할 수 있음Flutter는 이러한 상태 관리를 효울적.. 2025. 1. 22. 이전 1 2 3 다음 728x90