[Flutter] WindowsでのAndroid 開発環境設定



Flutter

 
FlutterはGoogleが提供するものでクロスプラットフォーム開発が可能です。Android以外にもiOSアプリやWebアプリ開発もできます。

ここではFlutterのAndroid開発環境をWindowsで作ってみたいと思います。iOSアプリではMacが必要になります。
 

 

Flutter SDK

 
Flutter SDKを以下よりOSに合わせてダウンロードします。(ここではWindows OSとして進めていきます)
Install Flutter

flutter 01 - [Flutter] WindowsでのAndroid 開発環境設定

Windowsのケース:開発環境に必要とされる条件

  • OS: Windows 7 SP1 or later (64-bit)
  • Disk Space: 1.32 GB (does not include disk space for IDE/tools)
    • これはflutterでのことですが、Android Studioでエミュレータを使う場合は数十GBの空きが必要です
  • Tools: Flutter depends on these tools being available in your environment.
    • Windows 10であれば比較的楽ですが、とりあえずはケースバイケースで揃えます
    • Windows PowerShell 5.0 or newer (this is pre-installed with Windows 10)
    • Git for Windows 2.x, with the Use Git from the Windows Command Prompt option.If Git for Windows is already installed, make sure you can run git commands from the command prompt or PowerShell.
 

ダウンロード

以下は公式の Windows install に沿って進めていきます。

flutter_windows_xxx.zip のzipファイルをダウンロード

flutter 02 - [Flutter] WindowsでのAndroid 開発環境設定

過去の古いSDKはこちら Flutter SDK releases にあります。

flutter_windows_xxx.zip のzipファイルを解凍し、例えばC:\src\flutter 以下にフォルダをコピペします。

C:\Program Files\ 以下に通常のソフトのようにインストールすると管理者権限がうるさいので推奨していないようです。

 

環境変数PATHの設定

このflutter sdkにPATHを通してどこからでも実行させられるように環境変数のPATHに追加します。

Windowsの「スタート」から「Windows システムツール」にある「コントロールパネル」を開きます。
 
flutter 03 - [Flutter] WindowsでのAndroid 開発環境設定

「システムとセキュリティ」「システム」「システムの詳細設定」から
「システムのプロパティ」の「詳細設定」タグの下に「環境変数(N)…」があります。

環境変数には、ユーザー環境変数と、システム環境変数がありユーザー側を選びます。
Pathの変数には値としてローカルパスが割り当てられています。なければ新規で作成

編集から、fluetter SDKのbinを設定します。

flutter 04 - [Flutter] WindowsでのAndroid 開発環境設定

例えば c\_Flutter\src\flutter\bin のパスを新規で追加

flutter 05 - [Flutter] WindowsでのAndroid 開発環境設定

 

Android Studio

 
Android Studioを設定します。これを使うとAndroidのエミュレータが使用できます。またDartのエディタとしても使えます。

 

インストール

 
Android Studio をWindowsにインストールするには以下を参考にしてください。
 

ccf1639bf2a87341a46fd52c9da41b46 s 100x100 - [Flutter] WindowsでのAndroid 開発環境設定
Androidアプリを作るためには開発環境が必要です。Googleの推奨環境は「Android Studio」これはバージョンアップが頻...

 
注意点として、flutterとは違ってインストール場所の変更はお勧めできないのでそのまま設定していきます。結果として

C:\Program Files\Android
C:\Users\「ユーザー名」\AppData\Local\Android

以下にファイルが格納されます。(これ以外にもありますが)、また「ユーザー名」を日本語にすると問題が起きますのでアルファベットのユーザー名を作って再インストールしないと後々面倒な事になります。

エミュレータ:
Android Studioがインストールできたなら、以下を参考にエミュレータを設定します。
 

avd a00 100x100 - [Flutter] WindowsでのAndroid 開発環境設定
Androidアプリが動作するか確認するためには、エミュレータは便利です。AVD Managerを使ってエミュレータの設定方法について見...

 
USBドライバー:
またUSBドライバーを設定して実機上でテストできるようにもできます。
 
cat27 00b 100x100 - [Flutter] WindowsでのAndroid 開発環境設定
Androidの開発環境を設定した後は、実機でデバッグできるように実機とUSBで接続し、ドラドライバーのインストールと設定が必要です。 ...

 

 

環境変数PATHの設定

 
flutterと同じようにAndroid StudioのPATHを設定します。
PATHは先ほどのAndroidフォルダ以下にあるSdkです。
C:\Users\「ユーザー名」\AppData\Local\Android\Sdk

環境変数のPathに設定します。

flutter 06 - [Flutter] WindowsでのAndroid 開発環境設定

 

Flutter doctor

 
flutter doctorを使って環境がセットアップされているか確認します。
コマンドプロンプトを起動して以下コマンドを入力します。

コマンドプロンプトは前出のコントロールパネルの近くにあります。

flutter 07 - [Flutter] WindowsでのAndroid 開発環境設定

診断結果が表示されるのでそれぞれ対処していきます。

Flutterは問題ないようです。VS Codeはたまたま使っていたのでFlutter extensionが入っていないということですが、これは必須ではありません。

  1. Android licenses not accepted
  2. Flutter plugin not installed
  3. Dart plugin not installed

1. Android Licensesが許可されていない問題はこちらに対処方法がありました。
How to accept Android licenses
 
以下コマンドを入力して規約に了承する意味のyを入力

2. FutterとDartのプラグインがインストールされていない件はFlutterのプラグインを入れるとDartも一緒に入ります。

Android Studio のTop画面の下から「Configure」「SDK Manager」を起動します

as4.0 006 - [Flutter] WindowsでのAndroid 開発環境設定

「Plugins」タグから、「flutter」を検索してインストールします。

flutter 08 - [Flutter] WindowsでのAndroid 開発環境設定

インストールが終わると「Restart IDE」と表示されるのでクリックしてAndroid Studioを再起動させます。

再度doctorを走らせてみると

これで環境設定がある程度できました。次は実際のアプリを作っていきましょう

References:
Flutter
Flutter architectural overview
Flutter Install
Set up an editor – Flutter

誤字脱字、意味不明で分からにゃイ、
などのご意見はこちらから mailフォーム

ブックマークしておくと便利です このエントリーをはてなブックマークに追加

 

アプリ開発が上達するお勧め

アプリ開発を始めたけどわからないところがあり、誰かに聞きたいけど周りにはそんな人はいない…あるいは、会社で働いていて日中そんなに時間をとれないなど、オンラインのプログラミングスクールがいいでしょう。

オンラインスクールは色々ありますが、以下の3つはAndroidが学習できる老舗スクールです。


TECH ACADEMY
Androidアプリコース


こういうものではアプリ作れないと言う意見もありますが、それは結局本人のやる気があるかないかです。やる気があっても独学では突破しにくいところは教えてもらうのが一番早い。


侍エンジニア塾
侍エンジニア塾 無料体験レッスン


とても簡単なことなのに本やネットの画像だけでは分かりにくいことはあります。実際に質問してピンポイントで教えてもらうと、なんだそんなこと、と言うのがけっこうあります。


CodeCamp
~約8,000名の受講生と80社以上の導入実績~
現役エンジニアのオンライン家庭教師CodeCamp




直接(ネットで)誰か分かる人に聞いた方が早く解決して、上達も早いと思います。




シェアする

  • このエントリーをはてなブックマークに追加

フォローする