- Flutterとは
- Flutter 環境 のインストール
- VisualStudio Code (VSCode) のインストール
- Flutter サンプルを作成
- Android Studio をインストール
Flutterとは
Flutterとは、マルチプラットフォームのアプリを作成するものです
などが、作成できるとのこと
需要があるのが、「モバイルアプリ」（ネイティブアプリ）
を作成するにあたり、iOS/Android を両方に作成するため、利用することが多いと思う。
今回、Windows環境で、Androidアプリを作成する環境を作る
Flutter 環境 のインストール
Flutter - Build apps for any screen
こちらの、サイトを開き、右上に「Get Started」を選択
そうすると、プラットフォームの選択がでてくるので、「Windows」を選択
どんなアプリかも聞かれるので、上述したように「モバイル」を選択
すると、ハードスペックとツール群の記載があります
ハードスペック
- ６４ビット４コア
- メモリ８G
- ディスク１０G
と
- Git
- Android Studio
のようですね。ちなみに、Windowsは10以降だそうです
「Install the Flutter SDK」という欄のところに「Download and install」
を押すと、zip のダウンロードボタンが表示されます。
zip をダウンロードしましょう
ダウンロードができれれば、日本語やスペースのないフォルダに展開します
zip の中に「Flutter」フォルダがありますので、「c:\」などに展開しましょう
次に、Flutterのパスを通します
パスは
設定 > システム > バージョン情報 > システムの詳細設定
より、環境変数 を選択
上段のユーザ固有か、下段のシステム全体かの、Path を選択
編集を押して、ダイアログを開く。
ダイアログでは、新規から、先ほどコピーした「C:\flutter\bin」を追加する
OK を押して、ダイアログを閉じたら、コマンドプロンプトから
flutter --version
で、バージョンなどが表示されたらパスが通っています
VisualStudio Code (VSCode) のインストール
Running Visual Studio Code on Windows
上記のサイトから、インストーラーをダウンロードします
「Visual Studio Code installer」のアンカーからダウンロードできます
VSCodeにFlutterをインストール
Flutter - Visual Studio Marketplace
こちらに、インストールボタンがあり、インストールできます
インストールする際に、VSCodeを先にインストしておくようなメッセージがでますが、まだ、インストしていなければ、先にインストしておいてください
そのメッセージから、VSCodeが開かれます
Flutter サンプルを作成
VSCode で、「Ctrl」「Shift」ｐ を押下する
コマンド選択の枠が表示されるので
flutter: new porject
を選択する
すると、Could not find a Flutter SDK が表示された場合は、
先ほど、ダウンロードしてパスを通しているので、ここでは、「Locate SDK」を選択します
「C:\Flutter」を選択するとこんどは「テンプレート」の選択枠が表示されます
「Application」を選択すると、フォルダの選択になります
ここでも「日本語」「スペース」「-」などがないフォルダを選択します
次にアプリ名が表示されます
「flutter_application_1」
でよければそのまま Enter
「Do you trust the authors of the files in this folder?」
が表示されれば、Yes を押します
ソースが出てくるとOKです
Android Studio をインストール
https://developer.android.com/studio?hl=ja
こちらから、ダウンロードします
現在では「Android Studio Giraffe | 2022.3.1 Patch 3」が最新
インストーラーでインストします
インストール後、Android Studio を開く
途中SDKの格納場所が表示されますが、上記同様「日本語」などのフォルダを指定してください
ライセンスの表示があると、全部「accept」を選択します
Android Studio を開くと、中央の「More Actions」から SDK Manager を開く
Android SDK 33 がインストールされていなければ、インストール
SDK Tool では
がインストールされていることを確認
Flutter の確認
コマンドラインから、
を実施する
「C:\Android\SDK」は、上記で、インストールしたときのフォルダです
flutter doctor --android-licenses
を実施する。ライセンスが聞いてこらえるので、y を入力
flutter doctor
を実施する。投稿者の環境では、VisualStudioは入れていないのでそれ以外は、OKでした
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.16.5, on Microsoft Windows [Version 10.0.22621.2861], locale ja-JP)
[✓] Windows Version (Installed version of Windows is version 10 or higher)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[✓] Chrome - develop for the web
[✗] Visual Studio - develop Windows apps
✗ Visual Studio not installed; this is necessary to develop Windows apps.
Download at https://visualstudio.microsoft.com/downloads/.
Please install the "Desktop development with C++" workload, including all of its default components
[✓] Android Studio (version 2022.3)
[✓] VS Code (version 1.85.1)
[✓] Connected device (3 available)
[✓] Network resources! Doctor found issues in 1 category.
ここまで、設定して、VSCodeを再起動します
すると、左下のデバイスが更新されていて、選択すると
選択肢のところに、Virtual Device が選択できるようになっています
実行
デバイスで、Androidのデバイスを選択して、Run & Debug を選択
