[트러블 슈팅] To Do List 만들기

문제 상황 1.  [main.dart 폴더]

-> 해당 코드 작성 시 에러는 뜨지 않는데, 앱 화면에 까맣게 아무것도 안뜸

 

원인과 해결

원인: pubspec.yaml 파일에 폰트 선언에 파일 경로 누락

해결: asset: 뒤에 나오는 폰트 파일 경로 추가 완료

 

---

문제 상황 2.  [main.dart 폴더]

-> 코드 작성 후 시뮬레이터에서 컬러 적용이 안됨

@override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        fontFamily: 'Nanum_Gothic',
        useMaterial3: true,
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.white,
          brightness: Brightness.light,
        ).copyWith(
          surface: Colors.white,
          onBackground: Colors.blue,
        )
      ),
        darkTheme: ThemeData(
          useMaterial3: true,
          colorScheme: ColorScheme.fromSeed(
            seedColor: Colors.lightBlue,
            brightness: Brightness.dark,
          ),
        ),
        themeMode: ThemeMode.light,
      home: Homepage(),
    );
  }
}

원인과 해결

원인: Material 3에서는 AppBar / Scaffold가 자동으로 색을 안 따라감, 각 위젯이 자기 테마를 따로 가짐

즉, M3는 기본 값을 자동으로 설정하고, 바꾸려면 "정확한 위치"에 써야함

 

해결: 백그라운드 컬러는 scaffoldBackgroundColor로 재설정, 앱 바 컬러는 appBarTheme 컬러로 재설정 진행

---

문제 상황 2.  FloatingActionButton을 눌러도 화면(BottomSheet)이 뜨지 않음

원인과 해결

원인: onPressed에 아무 동작도 연결되지 않음, 그리고 showModalBottomSheet를 호출하는 함수도 제대로 연결되지 않았음

 

해결: onPressed에 BottomSheet를 여는 함수(_openAddTodoSheet)를 연결하고,
showModalBottomSheet를 사용해 화면을 표시함

 

-> 화면이 보이도록 연결하고, 비동기 방식으로 작동하도록 설정

 

문제 상황 3. 카드의 아이콘을 눌러도 상세 페이지로 이동하는 문제

-> 할 일 리스트 카드 내에 완료 체크 아이콘이나 즐겨찾기 아이콘을 눌러도 상세페이지로 이동함..(엉엉)

 

원인과 해결

원인: 카드 전체가 하나의 on Tap 영역으로 처리되어 아이콘 클릭도 부모 제스처에 포함됨

 

해결: 카드 전체 탭을 제거하고, 상세 이동은 텍스트 영역에만 InkWell(onTap)을 적용하여
아이콘 버튼 동작과 상세 이동을 분리

 

문제 상황 4. 다크 모드 UI 문제

-> 다크 모드 적용 시 바텀시트의 아이콘과 글자, 그리고 메인 화면의 할 일 목록(텍스트/아이콘)이 라이트 모드일 때의 텍스트 컬러와 

동일하게 구현되어 배경색에 묻혀 보이지 않음(블랙 배경엔 블랙 텍스트, 흰색 배경엔 흰색 텍스트가 적용..)

원인과 해결

원인:

1. main.dart 파일에서 darkTheme 설정에서 onSurface 및 textTheme의 색상을 Colors.black으로 일괄 강제 설정함. 이로 인해 다크 모드 배경(어두운 색) 위에서도 검은색 글씨가 출력됨

2. AddTodoBottomSheet에서 저장 버튼의 활성화 색상을 다크 모드를 고려하지 않고 Colors.black으로 고정해버림

3. 메인 화면의 TaskBox와 ToDoView는 배경색을 Colors.white로 고정했으나, 내부 텍스트 스타일은 시스템 테마(다크 모드 시 흰색 글자)를 참조하도록 설정되어 텍스트가 안보이는 문제 발생

 

해결: 

1. main.dart 파일에서 다크 모드 시 텍스트와 아이콘이 시스템에 따라 유연하게 변하도록 onSurface: Colors.black 설정을 제거하고 brightness: Brightness.dark로 재작성하여 기본 대비를 설정하였다.

2. 배경색이 흰색으로 고정된 위젯 내부에서는 테마를 따르지 않고 텍스트와 아이콘 색상을 Colors.black으로 직접 지정함.

 

[main.dart 파일]

[taskbox 파일]