출처
flutter 공식 홈페이지 가기
1.
상기 링크에서 운영체제 선택 후 필요한 sdk (소프트웨어 개발자 키트) 다운로드 하기
2.
다운로드 파일을 압축을 푼 다음 아래 경로로 세팅하기(아무곳에나 해도 상관은 없으나, 중요한건 경로가 똑같아야함)
3.
pwd 명령어 쓰면 아래처럼 경로 볼수 있는데 cd 명령 이용해서 아래 경로처럼 이동하자
glory@gloryui-MacBookAir bin % pwd
/Users/glory/Documents/libraries/flutter/bin
JavaScript
복사
4.
아래 경로로 내려가서, 해당 명령어 vi ~/.zshrc 를 입력해서 환경 설정을 해준다. (해당 과정은 vi편집기를 사용해야하는 과정으로 여기서는 다루지 않겠다.)
export PATH="$PATH:/Users/glory/Documents/libraries/flutter/bin”
ABAP
복사
5.
해당 명령어 vi ~/.zshrc 를 잘 입력해서 명령어가 정상적으로 입력이 되었는지를 확인하자
6.
source ~/.zshrc 입력해서 오류 없는지 더블 체킹하고 flutter doctor가 실행되는지 확인하자
7.
만약에 안된다면 환경변수 입력이 똑바로 안되어있는거니깐 해당 부분만 다시 수기로 잘 작성해서 수정하자
M1 맥 제품만 아래과정을 수행해줘야 한다.
•
로제타를 사용해야해서 아래 명령어를 작성해야한다.
sudo softwareupdate --install-rosetta --agree-to-license
ABAP
복사
•
그 다음에는 XCODE를 설치해야한다. (약 6시간 소요) 그 다음은 iOS 셋업을 해줘야 한다.
•
아래 명령어를 실행한다. 다운로드 받은 xcode를 사용할 xcode로 지정하기 위해서 아래 명령어를 입력해야만 한다.
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch
ABAP
복사
•
그리고 그다음에는 라이센스 동의를 위해서 명령어 sudo xcodebuild -license 를 입력하고 아래 처럼 <agree>를 해준다.
By typing 'agree' you are agreeing to the terms of the software license agreements. Type 'print' to print them or anything else to cancel, [agree, print, cancel] agree
You can view the license agreements in Xcode's About Box, or at /Applications/Xcode.app/Contents/Resources/English.lproj/License.rtf
glory@gloryui-MacBookAir ~ %
ABAP
복사
•
xcode가 정상적으로 설치 되었는지 확인하기 위해서 아래 명령어를 입력해준다.
open -a Simulator
ABAP
복사
•
상기 명령어 실행시 모바일 환경 셋업이 완료 되면 다음단계로 넘어가자
다음은 안드로이드 스튜디오를 설치한다.
•
하기 링크에서 있는 방법으로 설치를 진행하면 된다.
•
안드로이드 설치를 완료 했으면 아래와 같이 플러그인에서 flutter를 설치해 플러그인을 다운로드 받고 재 실행을 해준다.
•
그러면 오른쪽 상단에 플러터 뉴 프로젝트가 뜰텐데 눌러줘서 … 부분에 우리가 맨처음에 설치한 플러터 설치 폴더를 클릭한다음 open 후 next를 눌러준다.
•
그리고 바로 finish해서 자동으로 언타이틀 폴더를 생성하는 create버튼을 눌러줘서 실행해본다.
•
그다음에 에뮬레이터를 돌려서 안드로이드 스튜디오가 잘 설치 되었는지 확인해보려고 하는데, 아래와 같은 화면처럼 맨처음에 폰 아무거나 선택한다음 최신 버전의 SDK를 다운로드해서 실행을 해보자
•
next, done 버튼 눌러서 에뮬레이터 잘 실행되는지 확인해보면 된다.
•
다음은 마지막 설정이다. 안드로이드 sdk를 설치해야하는데, 다음과 같이 sdk 설정중 아래 이미지처럼 4개가 꼭 체킹되어있야 한다. 브이 표시는 최신버전이라는 뜻이고, - 표시는 설치는 되어있지만, 최신버전으로 업데이트를 해야한다는 뜻이다.
4.
flutter doctor 실행
flutter doctor
Python
복사
5.
doctor 명령어 실행결과 다음과 같은 오류가 발생
Last login: Fri Mar 17 13:04:53 on ttys000
glory@gloryui-MacBookAir ~ % flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.7.1, on macOS 12.5.1 21G83 darwin-arm64, locale
ko-KR)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 13.4.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.3)
[✓] VS Code (version 1.70.2)
[✓] Connected device (2 available)
[✓] HTTP Host Availability
• No issues found!
glory@gloryui-MacBookAir ~ %
glory@gloryui-MacBookAir ~ %
Python
복사
•
만약에 문제가 발생하면 차근차근 해결토록 하자
•
마지막 단계로 안드로이드 라이센스까지 등록하기로 하자
glory@gloryui-MacBookAir ~ % flutter doctor --android-licenses
All SDK package licenses accepted.======] 100% Computing updates...
glory@gloryui-MacBookAir ~ %
ABAP
복사
•
혹시 더 궁금한거 있으면 아래 링크로 들어가서 보면 된다.
다음은 Usb로 안드로이드 기기에 빌딩하는 방법이다.
•
내 폰에 안드로이드 빌딩을 시키기 위해서는 아래와 같은 링크로 들어가서 진행을 해주면 된다.
Enable USB debugging on your device
Before you can use the debugger and other tools, you need to enable USB debugging, which allows Android Studio and other SDK tools to recognize your device when connected via USB.
Enable **USB debugging** in the device system settings under **Developer options**. You can find this option in one of the following locations, depending on your Android version:
- Android 9 (API level 28) and higher: **Settings > System > Advanced > Developer Options > USB debugging**
- Android 8.0.0 (API level 26) and Android 8.1.0 (API level 27): **Settings > System > Developer Options > USB debugging**
- Android 7.1 (API level 25) and lower: **Settings > Developer Options > USB debugging**
ABAP
복사
다음은 USB로 iOS 기기에 빌딩하는 방법이다.
•
맨처음 homebrew 설치부터 진행한다.
•
명령어는 다음과 같다.
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
ABAP
복사
•
그 다음으로는 Cocoapods 설치를 진행한다.
brew install cocoapods
ABAP
복사
•
그 다음은 안드로이드 스튜디오를 실행해서 다음과 같은 방식으로, 왼쪽 텝에 ios폴더 내 Runner 안에 info.plist파일을 열어서 가운데 위쯤 open iOS Module in Xcode라고 적혀있는걸 실행하면 자동으로 xcode가 열리게 된다.
•
아래 화면에서 runner 를 클릭하면 아래 화면처럼 나오게 되는데
•
그리고 여기에서 아래에 이미지 처럼 계정 등록을 해줘야한다. 매번 프로젝트마다 이렇게 한번씩은 해줘야하니 참고하자
•
아래 내용부터는 그냥 참고용 내용이니 건너 뛰어도 된다.
끝
Xcode 보충 내용
•
Xcode 설치
•
iOS용 Flutter 앱을 개발하기 위해서는 Xcode가 설치된 맥이 필요합니다.
2.
아래 명령을 실행하여 새롭게 설치된 버전을 사용하도록 Xcode 커멘드라인 도구를 설정하세요
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch
3.
Xcode를 한 번 열어 확인을 선택하거나 커멘드라인에서 sudo xcodebuild -license를 입력하여 Xcode 라이센스 계약이 서명되었는지 확인하세요.
•
최신 안정 버전보다 오래된 버전도 동작할 순 있지만, Flutter 개발에 권장되지는 않습니다. 대상 비트 코드 이전 버전의 Xcode를 사용하는 것은 지원되지 않으며 동작하지 않을 수 있습니다.
•
Xcode를 사용하여 iOS 기기 또는 시뮬레이터에서 Flutter 앱을 실행할 수 있습니다.
iOS 시뮬레이터 설정
iOS 시뮬레이터에서 Flutter 앱을 실행하고 테스트하기 위해서, 아래 단계를 수행하세요:
1.
맥에서 Spotlight를 통해 혹은 아래 명령을 입력하여 시뮬레이터를 찾으세요.
$ open -a Simulator
2.
시뮬레이터의 Hardware > Device메뉴의 설정에서 시뮬레이터가 64비트 기기(iPhone 5s 이상)를 활용하고 있는지 확인하세요.
3.
기기 화면 크기에 따라서, 시뮬레이터에서 높은 해상도의 iOS 기기가 화면을 초과할 수 있습니다. 시뮬레이터의 Window > Scale 메뉴에서 기기의 스케일을 설정하세요.
간단한 Flutter 앱 만들고 실행하기
1.
첫번째 Flutter 앱을 만들고 설정이 잘 되는지 확인하기 위해, 아래 단계를 수행하세요:
2.
커멘드라인에서 아래 명령을 실행하여 새로운 Flutter 앱을 만듭니다:
$ flutter create my_app
4.
Flutter’s starter 앱이 들어있는 my_app 디렉토리가 생성됩니다. 해당 디렉토리로 이동하세요:
$ cd my_app
5.
시뮬레이터에서 앱을 실행하기 위해, 시뮬레이터가 실행중인지 확인한 후 다음을 입력하세요:
$ flutter run
iOS 기기에 배포
•
Flutter 앱을 실제 iOS 기기에 배포하려면 서드 파티 CocoaPods 의존성 관리자와 Apple 개발자 계정이 필요합니다. 또한, Xcode에서 실제 기기 배포 설정을 해야합니다.
•
아래 명령어로 CocoaPods을 설치하고 설정하세요:
sudo gem install cocoapods
pod setup
•
여기까지 했으면 cd .. 명령어 입력해서 나온다음 cd flutter 명령어 입력해서 flutter doctor 명령어를 실행해보자
mac@MACui-MacBookPro flutter % flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.10.4, on macOS 12.3.1 21E258 darwin-x64, locale
ko-KR)
[!] Android toolchain - develop for Android devices (Android SDK version
32.1.0-rc1)
✗ cmdline-tools component is missing
Run `path/to/sdkmanager --install "cmdline-tools;latest"`
See https://developer.android.com/studio/command-line for more details.
✗ Android license status unknown.
Run `flutter doctor --android-licenses` to accept the SDK licenses.
See https://flutter.dev/docs/get-started/install/macos#android-setup for
more details.
[✓] Xcode - develop for iOS and macOS (Xcode 13.3)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.1)
[✓] VS Code (version 1.66.1)
[✓] Connected device (2 available)
[✓] HTTP Host Availability
! Doctor found issues in 1 category.
mac@MACui-MacBookPro flutter %
Python
복사
Android 설정
참고: Flutter는 Android 플랫폼에 종속정인 부분이 있기 때문에 Android 스튜디오를 전부 설치해야 합니다.그러나 다양한 에디터에서 Flutter 앱을 작성할 수 있습니다. 관련 내용은 향후에 설명합니다.
Android 스튜디오 설치
1.
Android 스튜디오 다운드로 및 설치.
2.
Android 스튜디오를 시작하고 ‘Android 스튜디오 설치 마법사’를 실행합니다. 설치 마법사는 Flutter로 Android를 개발할 때 필요한 최신 Android SDK, Android SDK 플랫폼 도구, Android SDK 빌드 도구를 설치합니다.
Android 기기 설정
Android 기기에서 Flutter 앱을 실행하고 테스트하기 위해서, Android 4.1 (API 16) 이상에서 동작하는 Android 기기가 필요합니다.
1.
•
Android 9 (API level 28) and higher: Settings > System > Advanced > Developer Options > USB debugging
•
Android 8.0.0 (API level 26) and Android 8.1.0 (API level 26): Settings > System > Developer Options > USB debugging
•
Android 7.1 (API level 25) and lower: Settings > Developer Options > USB debugging
2.
1.
USB케이블을 이용하여 기기를 컴퓨터에 연결하세요. 장치에 관한 메시지가 나타나면, 컴퓨터가 장치에 접근할 수 있도록 권한을 부여하세요.
2.
Flutter에 안드로이기 기기가 연결됐는지 확인하기 위해 터미널에서 flutter devices 명령을 실행하세요. 기본적으로, Flutter는 adb 도구에 연결된 버전의 Android SDK를 사용합니다. 다른 곳에 설치된 Android SDK를 사용하고 싶다면, ANDROID_HOME 환경 변수를 해당 디렉토리로 변경해야 합니다.
Android 에뮬레이터 설정
Android 에뮬레이터에서 Flutter 앱을 실행하고 테스트하기 위해, 아래 단계를 수행하세요:
1.
2.
Android Studio > Tools > Android > AVD Manager를 실행하고 Create Virtual Device를 선택하세요. (Android 하위 메뉴는 Android 프로젝트 내부에 있을 때만 나타납니다.)
3.
기기 해상도를 선택하고 Next를 누르세요.
4.
가상화하려는 Android 버전에 맞게 1개 이상의 시스템 이미지를 선택하고 Next를 누르세요. x86 또는 x86_64 를 권장합니다.
5.
6.
AVD 구성이 올바른지 확인하고 Finish를 선택하세요.
7.
Android 가상 기기 관리자에 있는 툴바에서 Run을 클릭하세요. 에뮬레이터가 시작되고 선택한 OS 버전과 기기의 기본 캔버스가 표시됩니다.
안녕하세요
•
한국전자기술연구원 김영광입니다.
•
관련 기술 문의와 R&D 공동 연구 사업 관련 문의는 “glory@keti.re.kr”로 연락 부탁드립니다.
Hello
•
I'm Yeonggwang Kim from the Korea Electronics Research Institute.
•
For technical and business inquiries, please contact me at “glory@keti.re.kr”