kookmin-sw / capstone-2023-08

capstone-2023-08 created by GitHub Classroom
1 stars 4 forks source link

Frontend result 페이지 (로컬이미지 사용) #91

Closed lucyya99 closed 1 year ago

lucyya99 commented 1 year ago

Result Screen 관련 파일

  1. result_all_screen.dart
  2. result_screen.dart
  3. loading_screen.dart
  4. loading_success_screen.dart

Result Screen test 방법

이미지를 서버가 아닌 image picker를 통해 local에서 올려서 화면만 확인하도록 만들었습니다.

동작을 테스트하기 위해 임시로 갤러리 입어보기 버튼에서 피팅화면으로 이동하도록 만들었습니다 (local에 있는 이미지를 사용한다는 생각으로 만들었는데, 생각해보니 갤러리에서 입어보기랑 비슷한 코드라서 갤러리페이지에서 그대로 사용하면 되겠네요)

  1. 메인페이지 → 갤러리에서 입어보기 버튼
  2. 이미지를 고르는 화면
  3. 햄버거 메뉴에서 Download 파일로 이동
  4. local에 있는 jpg 이미지 1개를 올린다
  5. 해당 이미지 선택 후 진행

아마 ios에서도 download 폴더로 이동한 후 이미지 선택하시면 똑같이 작동할거에요!

서버에서 이미지를 받아와서 동작하도록 하는 부분은 나중에 구현하는 게 좋을 것 같아서 일단 image picker를 통해 local에서 선택한 후, 화면만 확인할 수 있도록 만들었습니다

구현이 되면 주석으로 todo 표시한 부분만 바꿔주시면 됩니다!

이 result screen도 원래 isLoading이라는 flag 사용해서 화면만 갈아끼우는 방법이었는데, FutureBuilder로 pickImage에서 결과가 있으면 바뀌도록 동작 방식을 미리 바꿔뒀습니다!

Modal 창 수정

모서리 둥글게 + 전체화면에서 약간 띄우게 수정했고, 그대로 구현한 모습입니다.

UI 부분 수정한게 마음에 안들면 말씀해주세요!

추가로 Result Screen에서 기능 구현이 안되어있던 부분 수정

modal 창에서 [처음으로, 갤러리 저장] 버튼을 누르면 동작하도록 바꾸었습니다.

  1. 처음으로 → Routing Stack에서 첫번째로 들어있는 곳으로 이동하도록 변경
  2. 갤러리 저장 → ImageGallerySaver 플러그인 사용, 갤러리 저장 후 [처음으로 버튼]과 똑같이 동작 (이미지 이름은 ‘현재시각-chackboot.jpg’입니다)

Todo

질문

구현을 하다보니까 제가 이미지를 받아 갤러리로 저장할 때는 jpg 형식으로 저장하도록 만들었는데, [유저가 준 캡처 사진이 jpg인지, png인지, 기타 등등 다른 파일 형식인지 구분하는 코드에 대한 처리가 미리 되어있는지?] 궁금해졌습니다..! 아니면 갤러리에서 선택할 때 처리해야하니 그때 참고해보겠습니다!!

원래 저번주에 PR 올리기로 했던것같은데 전체적인 레이아웃이랑 버튼 기능이 안되어있는 부분들이 마음에 걸려서 오늘 수정해서 PR 올렸습니다..!