1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

WindowsでのFlutter環境の構築を図説(2022年1月版)

Posted at

経緯

WindowsでFlutter環境を構築する際、Android SDKのライセンス許諾でハマったので、うまくいく手順を残しておきます。必要となるAndroid Studioのバージョンは2020.3.1です。筆者はWindows 11(Pro)を利用しましたが、Windows 10でも手順は同じだと思います

手順

まずは、公式サイトからFlutter SDKをダウンロードして、任意のフォルダに展開します。展開後、"展開先のフォルダ\flutter\bin"にパスを通します。スペースや日本語が含まれるフォルダに展開するのは避けましょう。筆者はCドライブ直下に展開しました

次に、Android Studioをインストールします。公式サイトからインストーラーをダウンロードすることも可能ですが、今回はwingetコマンドでラクをしました。wingetコマンドを初めて利用する場合は"Y"を入力してライセンスを許諾します。wingetなるコマンドがないという方は、Microsoft Storeアプリで「アプリ インストーラー」を最新化してください

winget install Google.AndroidStudio

その他必要なアプリもwingetでインストールします

winget install Git.Git
winget install Google.Chrome

インストール後、Android Studioを起動します。ここからセットアップ手順が複雑なので図解します

選択は任意です


Hyper-VやDocker Desktop for Windowsなどを利用してる場合は、Customを選択します。なお、筆者の物理PCにはすでに環境がセットアップ済みです。再インストールは辛いので、本記事のスクショ採取は、Nested Hyper-Vを有効にしたVM上で行っています


選択は任意です

先述の通り、Hyper-VやDocker Desktop for Windowsなどを利用している場合は、競合するIntel HAXMはオフにします



Welcome to Android Studioという画面が表示されたら、左側のペインからPluginsを選択しFlutterをインストールします



ついでにKotlinのアップデートが来ていたので適用しておきます

アップデート適用後にIDEを再起動します


再起動後SDK Managerを開きます

後述するライセンス許諾のためのツールをインストールします



Android SDKのライセンス許諾のため以下のコマンドを実行します。聞かれることにすべて"y"で答えます

flutter doctor --android-licenses

以下のコマンドで環境に不備がないか確認します。"-v"オプションを付けるとより詳細な情報が出力されます

flutter doctor

AVD Managerを開きます

ど真ん中のCreate Virtual Device...を押します

詳しくは調べていませんが、変に古くなければ任意のデバイスでいいと思います

詳しくは調べていませんが、変に古くなければ任意のOSでいいと思います




61.png
筆者の環境では、作成したAndroidエミュレーターをIDEがうまく認識できなかったので、いったん再起動しました。再起動後、New Flutter Projectを選択します
36.png
左側のペインでFlutterを選択し、Flutter SDKの展開先を指定します
37.png
使い捨てのプロジェクトなのでプロジェクト名が適当です
38.png
画面上部のドロップダウンリストでRefreshを選択して、作成したAndroidエミュレーターを検出します
47.png
しばらくするとAndroidエミュレーターが検出されるので選択します
48.png
Androidエミュレーターの起動後に、画面右上の緑の再生ボタンを押します
39.png
無事にサンプルプログラムが起動しました。先述の通りNested Hyper-Vを利用すればVM上でもエミュレーターが起動します。下記のスクショでは分かりにくいのですが、エミュレーターはホストOS上ではなくゲストOS上で稼働しています(タスクバーに注目)
53.png

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?