< 소개 >
안녕~~ 🌱
사례글 미루다가 급하게 쓰는 하이호야 🌱
제가 식물요정 컨셉의 앱을 만들고 있어서
그래서 이 사례글에서 간혈적으로 식물요정 흉내를 낼 수도 있어. 🌱
역겨워도 참아줘 🌱
아무튼 저는 20기 안드로이드 앱 스터디에 들어가 있어.
저번 글에서 Device Preview로 반응형 버그 잡는 거 다뤘는데,
이번엔 남은 2가지 얘기할게 🌱
안드로이드 스튜디오 가상 폰 써본 후기
바텀시트 축소/확대 모드 만들기
(이 사례글은 ai 도움 한 85% 정도 받았고 나머지는 직접 썻어! 써보니 좀 짧은데 괜히 2개로 나눴나 🤔)
< 진행 방법 >
✅ 안드로이드 스튜디오 가상 폰 써봤다.
안드로이드 스튜디오에 디바이스 매니저라는 게 있어.
여기서 가상 폰(에뮬레이터)을 만들 수 있음.
USB 연결 없이 앱 실행하면 이 가상 폰에서 돌아가!
장점
USB 연결 필요 없음
채팅 테스트에 유용함 - API 연결되고, 대화 기록도 저장됨
솔직한 후기: 생각보다 효과 적었다 🌱
근데 막상 써보니까...
카메라가 안 돼. (로딩도 느려)
(카메라 모드 된다고 말하지만 막상 작동안됨... 방법 없나 있을 거 같은데)
우리 앱의 핵심 기능이 카메라로 식물 인식하는 건데, 가상 폰에선 카메라가 제대로 작동 안 함.
결국 카메라 테스트는 실기기로 해야 해.
그리고 저번에 설치한 Device Preview가 크롬에서도 모바일 화면 보여줘서, UI 테스트는 그걸로 충분했음.
테스트 종류
가상 폰
Device Preview
실기기
UI/레이아웃
⭕
⭕
⭕
채팅 기능
⭕
❌
⭕
카메라
❌
❌
⭕
근데 이런저런 기능 많으니까 다른 거 할 때 쓸만할듯.
결론: 내 앱 기준 채팅 집중 테스트할 때는 쓸만한데, 만능은 아님.
✅ 바텀시트 축소/확대 모드 추가
카메라 화면에서 식물 인식하면 아래에서 선택 팝업(바텀시트)이 올라와.
근데 이게 너무 커서 식물 표정이 가려짐 🌱
기기 미리보기를 보여주는 화면이 있는 휴대전화
보이지 않는 식물의 표정...
표정 보여주는 게 핵심인데 이러면 안 되지... 🌱
1. 해결 방향
표정 위치를 옮기면? → 식물 위치랑 안 맞을 수 있음.
바텀시트를 줄이면? → 식물 많으면 스크롤 불편함.
그래서 둘 다 되게 만들기로 함:
축소 모드 (기본): 낮은 높이, 가로 스크롤 → 표정 안 가려짐
확대 모드 (끌어당기면): 높은 높이, 격자 배열 → 식물 많아도 편함
시행착오
처음에 DraggableScrollableSheet라는 걸 써봤어.
드래그하면 늘어나는 시트인데, 이름부터 딱 맞잖아?
근데 우리 카메라 화면 구조랑 안 맞아서 바텀시트가 아예 안 뜸 ;;
한참 삽질하다가 포기하고 더 단순한 방식으로 바꿨어.
그냥 높이값만 바꿔주는 애니메이션 컨테이너 씀.
핸들 바 탭하면 축소 ↔ 확대 토글
위/아래 스와이프로도 가능
드디어.. 됐다!
정석 방법이 항상 맞는 건 아니더라... 🌱
< 🌱 핵심 교훈 >
테스트 도구는 상황에 맞게
가상 폰: 채팅처럼 데이터 저장 필요한 기능
Device Preview: UI 레이아웃 확인
실기기: 카메라 등 하드웨어 기능
복잡한 위젯보다 단순한 게 나을 때도 있음
이름 그럴듯한 거 쓰다가 삽질만 함
단순한 방법이 더 안정적이었음
< 🌱 결과 >
가상 폰으로 채팅 기능 반복 테스트 가능해짐
바텀시트 개선해서 표정도 보이고 선택도 편하게
< 액션플랜 >
안드로이드 스튜디오 디바이스 매니저 활용법
다른 폰 추가 방법
디바이스 프리뷰랑 비교했을 때?
카메라 모드 정말 방법 없나?
모바일 반응형 스킬 못찾았는데 있지 않을까?
< 다음 사례글 예고 >
사례글 5: AI 응답 품질 잡기
