To-Do List 앱 Step 2-2. 다이얼로그 > 취소 텍스트 버튼 추가

2024. 11. 25. 20:28같이 공부합시다 - Flutter/Flutter로 To-Do 앱 만들기

728x90
반응형

할 일 목록 입니다 : )

1 . 화면 오른쪽 아래에 “+ (할 일 추가)” 플로팅 버튼 만들기.
2-1. 플로팅 버튼을 눌렀을 때 다이얼로그가 열리고, 사용자가 할 일을 입력할 수 있음.
2-2. ‘취소’ 텍스트 버튼 (다이얼로그만 닫음)
2-3. ‘추가’ 텍스트 버튼 (할 일 리스트에 추가하면서 다이얼로그 닫음)
3 . 화면에 할 일 리스트 표시.


다이얼로그 내에, ‘취소’ 텍스트 버튼은
팝업창(다이얼로그)만 닫으면 그만이겠지만,

‘추가’ 텍스트 버튼은 할 일 까지
추가해야 하니까 쉽지 않을 것 같아요.

그래도 한 발자국 씩 나아가 봅시다.



TextButton(
  onPressed: () {
    Navigator.of(context).pop(); // 다이얼로그 닫기
  },
  child: const Text("취소"),
),



테스트 해 봅시다.




굿! 깔끔하네요 ~~
이제 다이얼로그에 "취소" 버튼이 추가되었습니다. 😊

필요하면 다른 버튼이나 기능을
추가하도록 확장할 수도 있습니다!

취소 버튼은 쉬웠네요.

다음 추가 버튼은 좀 어려울 수 있으니,
잠시 커피 한 잔 하고 옵…

아, 잠시 쉬러가기 전에,
취소 버튼을 추가하니까 오류가 발생되었네요. 후..

Quick Fix 의 내용을 보니 const 를 삭제하라는데,
이유가 뭘까 하고 찾아보니 내용은 이랬습니다.

- `const`는 컴파일 타임에 모든 값을 고정할 수 있을 때만 사용 가능합니다.
- `AlertDialog` 안에 런타임 동작(예: `Navigator.of(context).pop()`)이 포함되므로 `const`를 제거해야 합니다.

그러니까 사용자가 언제
취소 버튼을 눌러서 상태를 바꿀지 모르니까,
const 로 고정하는 건 안된다는 뜻인 것 같네요..
흐음.. 뭐 그럽시다. (ㅎ)


AlertDialog 앞에 const 를 제거하면,
title 과 content 속성도 경고가 뜨는데요.

앞선 내용과 같을 것 같네요.

title 과 content 는 변하는 내용이 없으니
const 로 고정하면 효율적이다.
뭐 이런 거겠죠 (ㅎ)

정말 커피 한 잔 하러 가야겠네요.
후루룹~~


출처 : ChatGPT



728x90
반응형