플러터 앱개발 환경설정부터 앱출시까지 빠르게 해보고 전체과정 이해하기 - 1. vscode 에서 플러터 개발환경 구축하기 - 4.안드로이드 스튜디오 설치 및 세팅
ㅁ 개요
O 프로그램 소개
- 이번 글은 이전글(플러터 앱개발 환경설정부터 앱출시까지 빠르게 해보고 전체과정 이해하기 - 1. vscode 에서 플러터 개발환경 구축하기 - 3.vscode 설치 및 세팅)에 이은 4번째 글로 vscode로 플러터를 이용하여 앱 개발환경을 구축 중 4.안드로이드 스튜디오 설치 및 세팅하는 방법에 대하여 알아보겠습니다.
O 완성된 프로그램 실행 화면
>flutter doctor 명령 실행 시 모두 초록색으로 만족하면 vscode로 플러터를 이용하여 앱 개발환경구축이 완료됩니다.
아래와 같은 개발환경을 구축해야 합니다.
-cmd 등에서 아래 명령으로 확인할 수 있습니다.
>flutter doctor
1.flutter 다운로드 및 환경설정
2.크롬설치
3.vscode 설치 및 세팅
4.안드로이드 스튜디오 설치 및 세팅
5.안드로이드 툴체인(라이선스 체크)
ㅁ 세부 내용
O 주요 내용
4.안드로이드 스튜디오 설치 및 세팅
아래와 같이 웹브라우저 검색 후 상단 링크를 클릭합니다.
아래에서 'Android 스튜디오 다운로드'를 클릭하여 다운로드 합니다.
아래 동의 부분을 체크 후 다운로드를 클릭합니다.
다운로드 후 설치파일을 클릭 후 기본으로 설치해 줍니다.
설치 완료 후 아래와 같이 우리는 프로젝트 생성이 최초 이므로 2번째 옵션을 선택합니다.
아래는 통계정보를 구글에 보낼지를 물어보는 것인데, 'Don't send'를 클릭해 줍니다.
아래에서 'Next' 클릭합니다.
아래와 같이 모두 'Accept'로 선택 후 'Finish'를 클릭합니다.
관련 파일을 다운로드하고 설치가 진행되고 있습니다.
안드로이드 스튜디오 설치가 완료된 후 아래와 같은 화면에서 'New Project'를 클릭합니다.
기본 설정된 상태에서 'Next'를 클릭합니다.
아래도 기본으로 하고, 'Finish'를 클릭합니다.
아래와 같이 뜨면 방화벽을 열기위해 '엑세스 허용'을 클릭해 줍니다.
로딩하는데 시간이 다소 필요합니다.
오른쪽 상단에 'Device Manager'를 클릭합니다.
가상 디바이스(가상의 휴대폰)가 없거나, 혹은 있더라도 추가하고 싶은 경우 'Create device'를 클릭합니다.
휴대폰 하드웨어 기종을 선택 후 'Next'를 클릭해 줍니다.
(아래의 경우 기본으로 설정)
안드로이드 시스템 이미지(휴대폰 OS)를 선택 후 'Next'를 클릭합니다.
아래와 같이 최종 확인 후 'Finish'를 클릭합니다.
'Device'아래에 가상 디바이스가 하나(?) 생성되었으며, 실행을 위해 오른쪽의 삼각형 아이콘을 클릭합니다.
아래와 유사한 모습으로 에러 없이 실행되는 것을 확인하셨다면 가상디바이스(ADM)가 잘 설치된 것입니다.
위의 경우 안드로이드 스튜디오에서 가상디바이스를 실행한 모습이고,
우리는 주로 가벼운 vscode에서 실행할 것이므로 아래와 같이 실행해 봅니다.
View > Command Palette.. > Flutter : Select Device(검색창에 입력) <----- 이렇게 하면 웹앱을 실행할 수 있는
가상디바이스와 브라우저 등을 선택할 수 있게 나옵니다.
저는 아래와 같이 크롬(웹)을 선택했습니다.
아래와 같이 크롬브라우에서 앱(웹)이 웹으로 실행되고 있습니다.
(위에서 만든 가상디바이스(휴대폰)로 앱을 실행해도 되는데, 너무 느립니다. 따라서 앱전용이 아닌 경우 크롬 등 웹으로 실행하는 것이 효율적이겠습니다.)
프로젝트 생성 시 기본으로 제공하는 카운터 증가 프로그램입니다.
아래는 가상디바이스(에뮬레이터)로 위의 카운터 프로그램을 실행해 본 것입니다.
먼저 디바이스를 선택해 줍니다. 우리는 에뮬레이터(가상 휴대폰)로 실행해 볼 것이기 때문에
이전에 만들어 둔 가상 디바이스(없으면 새로 생성 하시면 됩니다.)를 선택해 줍니다.
가상 디바이스로 실행 시 최초 1회에는 가상디바이스 내로 apk 파일을 만들어서 넣는 과정이 포함되기 때문에 굉장히 느리게 느껴집니다.
다만, 이후 실행 부터는 그래도 조금 빨라진 것을 느낄 수 있습니다.
아래와 같이 가상 디바이스에서 만든 apk파일에 해당하는 앱을 확인할 수 있습니다.
다시 'flutter doctor' 로 점검한 결과 안드로이드 스튜디오가 잘 설치된 것을 볼 수 있으며, 이제는 안드로이드 툴체인과 비주얼 스튜디오만 설치해 주면 되겠습니다.
안드로이드 설치과정에서 다양한 에러가 발생할 수 있습니다.
주로 발생하는 에러를 아래 정리하였으니 참고 하시기 바랍니다.
(에러가 발생하지 않으신 분들은 skip 하셔도 되겠습니다.)
아래와 유사 에러 발생 시 다음과 같이 조치 합니다.
1. 제어판 > 프로그램 및 기능 > Windows 기능 켜기/끄기 > Hiper-V 모두 체크
2.아래 깃허브에서 haxm-7.8.0-setup.exe 관리자 권한으로 설치/진행
3. CMOS/BIOS에서 가상환경 옵션을 enable
자세한 내용은 아래 사이트 참조 부탁드립니다.
https://jun7222.tistory.com/128
https://whoishoo.tistory.com/300
https://0391kjy.tistory.com/4
주요 에러 메시지는 아래와 같습니다.
첫번째 해결 방법입니다.
1. 제어판 > 프로그램 및 기능 > Windows 기능 켜기/끄기 > Hiper-V 모두 체크
두번째 해결 방법입니다.
2.아래 깃허브에서 haxm-7.8.0-setup.exe 관리자 권한으로 설치/진행
세번째는 부팅시 BIOS모드로 진입 후 가상환경 옵션(하이퍼바이저 등)을 enable 하는 방법입니다.
3. CMOS/BIOS에서 가상환경 옵션을 enable
오늘은 여기까지이며, 댓글과 하트는 제가 이글을 지속할 수 있게 해주는 힘이 됩니다.
위의 내용이 유익하셨다면, 댓글과 하트 부탁드립니다.
감사합니다.