Flutter開発環境構築（Windows）

# 開発環境構築

WindowsマシンにFlutterの開発環境を構築する方法。

Flutterコマンドを使用可能にし、Android Studioのインストール　および　セットアップを行います。

## Flutterのインストール

Flutterの本体をインストールし、Flutterコマンドを使用可能にします。

1. Flutterのインストール要件は下記の通りです。

| OSバージョン               | ディスク容量 | 必要ツール                                       |
| -------------------------- | ------------ | ------------------------------------------------ |
| Windows 7 SP1以降（64bit） | 400MB        | Windows PowerShell5.0以上<br>Git for Windows 2系 |

2. Flutterの最新版をFlutterの公式サイトでダウンロードします。

   [Flutter公式サイト](https://flutter.dev/docs/get-started/install/windows)

3. ダウンロードしたファイルを解凍し、任意のディレクトリ[^※1][^※2]に格納します。

4. Windows PowerShellを管理者権限で起動し、解凍したディレクトリ内のbinディレクトリを環境変数PATHに追加します。[^※3]

   ```powershell
   $env:Path += ";D:\Develop\flutter\bin"
   [Environment]::SetEnvironmentVariable('PATH', $Env:Path, 'Machine')
   ```

5. flutterコマンドdoctorを使用し、flutterのインストールおよびPathの設定が完了していることを確認します。

6. Windows PowerShellを起動し、doctorコマンドを実行します。

   下記のようなWelcomeメッセージが表示されればflutterのインストールは完了です。

   ```powershell
       PS D:\> flutter doctor                                                                                                  
         ╔════════════════════════════════════════════════════════════════════════════╗
         ║                 Welcome to Flutter! - https://flutter.dev                  ║
         ║                                                                            ║
         ║ The Flutter tool uses Google Analytics to anonymously report feature usage ║
         ║ statistics and basic crash reports. This data is used to help improve      ║
         ║ Flutter tools over time.                                                   ║
         ║                                                                            ║
         ║ Flutter tool analytics are not sent on the very first run. To disable      ║
         ║ reporting, type 'flutter config --no-analytics'. To display the current    ║
         ║ setting, type 'flutter config'. If you opt out of analytics, an opt-out    ║
         ║ event will be sent, and then no further information will be sent by the    ║
         ║ Flutter tool.                                                              ║
         ║                                                                            ║
         ║ By downloading the Flutter SDK, you agree to the Google Terms of Service.  ║
         ║ Note: The Google Privacy Policy describes how data is handled in this      ║
         ║ service.                                                                   ║
         ║                                                                            ║
         ║ Moreover, Flutter includes the Dart SDK, which may send usage metrics and  ║
         ║ crash reports to Google.                                                   ║
         ║                                                                            ║
         ║ Read about data we send with crash reports:                                ║
         ║ https://github.com/flutter/flutter/wiki/Flutter-CLI-crash-reporting        ║
         ║                                                                            ║
         ║ See Google's privacy policy:                                               ║
         ║ https://www.google.com/intl/en/policies/privacy/                           ║
         ╚════════════════════════════════════════════════════════════════════════════╝
   
       Doctor summary (to see all details, run flutter doctor -v):
       [√] Flutter (Channel stable, v1.12.13+hotfix.5, on Microsoft Windows [Version 10.0.18363.535], locale ja-JP)
       [X] Android toolchain - develop for Android devices
           X ANDROID_HOME = D:\Develop\Android\Sdk
             but Android SDK not found at this location.
       [!] Android Studio (not installed)
       [!] Connected device
           ! No devices available
   ```

[^※1]: 指定はありませんが、アクセスに許可が不要なディレクトリを指定してください。
[^※2]: 今回、インストールディレクトリにD:\flutterにしています。インストール先を変更する場合は以降の手順でインストールディレクトリ名を適宜、読み替えてください。
[^※3]: 環境変数追加コマンドの第3引数は、ユーザー環境変数をターゲットとする場合は"User"、システム環境変数をターゲットとする場合は"Machine"を指定します。



## Android Studioのインストール

Android Studioをインストールし、Flutterプラグインを導入します。

#### Android Studioのインストール

1. Android Studioのインストール要件は下記の通りです。


| OSバージョン           | ディスク容量                | メモリ容量                   | 画面解像度   |
| ---------------------- | --------------------------- | ---------------------------- | ------------ |
| Windows 7以降（64bit） | 2GB以上<br>（推奨：4GB以上) | 4GB以上<br>（推奨：8GB以上） | 1280×800以上 |

2. Android Studioの最新版を公式サイトでダウンロードします。

   [Android Studio公式サイト](https://developer.android.com/studio/?hl=ja)

3. ダウンロードしたファイルを実行し、インストールウィザードの指示に従いインストール[^※4]します。

<img width="374" alt="1.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/368799/6a59a2be-120b-053b-9076-fb5e1dc05955.png">


[^※4]: 標準設定でインストールします。



#### Flutterプラグインの導入

1. Android Studioの起動画面でConfigure→Pluginを選択します。

2. MarketplaceでFlutterを検索し、Installをクリックします。
<img width="601" alt="2.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/368799/b2652925-5f6a-30f4-5a17-45a8e26a4813.png">


3. Android Studioを再起動し、起動画面にFlutterプロジェクトの作成メニューが表示されればインストールは完了です。
<img width="500" alt="3.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/368799/fa5d3b42-7c70-a91d-7621-48e1986f32e0.png">