하수하따 록기장

앱 개발 프로젝트 중 프로필 설정 UI를 구성해야 하는데, 유튜브에 좋은 샘플이 있어서 따라해봤다. 하지만 유튜브 영상을 보면서 했을 때 마냥 코드만 따라치게 되는 경향이 있다. 뼈대가 없으면 스스로 구현하기 어려워지므로 유튜브에서 구성한 UI의 코드를 리뷰해보고 뜯어본 다음 내 앱에 맞게 변형하는 작업까지 기록해보려 한다. 왜 이 위젯을 사용해서 왜 이렇게 레이아웃을 구성했는지 초점을 두어 분석해보려고 한다.내가 본 유튜브 영상은 아래 링크이다. 맨 아래에 전체 코드가 있다.https://www.youtube.com/watch?v=AS183vv0xxU  📍 GestureDetector 위젯GestureDetector는 사용자의 제스처(클릭, 더블클릭, 오래 누르기, 드래그 등)를 감지하는 위젯이다. ..

앱바를 투명하게 만들고 body 위에 겹치게 하면, body안의 위젯들과 앱바가 겹치는 문제가 발생한다.(아래 시뮬레이터 캡쳐사진의 왼쪽 사진 참고) 이를 해결하기 위해 SafeArea를 body안의 위젯에 씌워주면, app bar의 그림자 효과가 다시 보이는 문제가 발생한다. (아래 시뮬레이터 캡쳐사진의 가운데 사진 참고) 구글링해보니 StackOverflow에 같은 질문도 있었다. https://stackoverflow.com/questions/68979682/how-to-set-flutter-appbar-transparent-without-the-status-bar How to set Flutter AppBar Transparent without the Status bar I tried to set..

table_calendar 패키지를 사용해서 Calendar를 구현하기 위해, 개발자의 깃헙 베이직 코드를 뜯어보자. ✔ Table Calendar 패키지 설치 table_calendar는 터미널에 아래 명령어를 입력하여 사용할 수 있다. 패키지가 잘 설치되면 pubspec.yaml 파일에 dependencies가 추가될 것이다. flutter pub add table_calendar ✔ Table Calendar 예제 코드 개발자의 Github에서 baisic_example.dart 파일이 있는 링크는 아래와 같다. table_calendar/example/lib/pages/basics_example.dart at master · aleksanderwozniak/table_calendar Highly ..

flutter로 프로젝트를 수행하면서 제일 어려웠던 부분은 상태관리였던 것 같다. 잘모르기도 했고 중요한 부분이라 이와 관련한 이슈가 계속 생겨났다. 그 중 하나를 기록해보려고 한다. 이 이슈는 같이 프론트를 맡았던 친구의 도움으로 해결할 수 있었다. 문제점 설정화면에서 캐릭터 변경하기 아이콘을 누르면 캐릭터 변경하기 모달이 나온다. 변경 후 '저장하기'를 누르면, 모달이 닫히고 다시 설정페이지가 보이게 되는데, 이때 화면갱신이 되어있지 않았다. 따라서 변경된 캐릭터가 아니라 여전히 기존 캐릭터로 프로필이 보이는 문제가 있었다. 문제원인 플러터에서 특정 작업을 수행한 뒤 화면을 갱신하려면 직접 setState를 호출해서 다시 위젯을 rebuild해야한다. setState 메서드는 데이터가 변경되었음을 프..