Flutter 앱 검색 UI 모바일에서 깨질 때 확인할 것

모바일에서만 검색 UI가 깨지는 문제는 보통 세 가지 중 하나다. 로컬 개발 환경과 배포 후 실제 기기의 차이, API 응답이 예상과 다른 경우, 아니면 단순히 빌드 캐시 문제.

먼저 API 응답부터 확인한다. 정상 상태가 뭔지 미리 알아두면 원인을 찾는 게 훨씬 빠르다. curl이나 Postman으로 같은 요청을 던져본다.

flutter doctor -v
flutter run --verbose

위 명령으로 환경 상태를 기록해둔다. 나중에 같은 문제가 생기면 이 정보가 큰 도움이 된다.

재현하기

증상을 정확히 기록하는 게 중요하다. 어떤 크기에서 깨지는지, 특정 데이터에서만인지, 처음부터인지 스크롤할 때인지. 이 정보 없이는 "대충" 수정할 수밖에 없다.

로그도 함께 본다. flutter run --verbose의 출력에서 레이아웃 관련 경고나 에러가 있는지 확인한다.

빌드 모드 확인

Debug와 Release 모드에서 다르게 보일 수 있다. flutter run -d 명령으로 기기를 명시적으로 지정하고, Release 빌드에서도 한번 확인해본다.

1. 현재 증상이 다른 조건에서도 반복되는지 본다.
2. 로그나 응답에서 뭐가 달라졌는지 한 줄로 정리한다.
3. 실제 기기와 에뮬레이터 양쪽에서 확인한다.

비슷한 문제가 또 생기면 지금 남긴 기록이 다음번 확인을 훨씬 빠르게 해줄 거다.