Flutterやーる（Windows10、Android）

はじめに

Flutterやっていくー

開発環境

• Windows 10
• flutter

実装

1．flutter（flutter_windows_2.8.1-stable.zip）のダウンロード

2．PATHを通す

3．コマンドプロンプトを開く

C:\Users\good_>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://flutter.dev/docs/reference/crash-reporting                         ║
  ║                                                                            ║
  ║ See Google's privacy policy:                                               ║
  ║ https://policies.google.com/privacy                                        ║
  ╚════════════════════════════════════════════════════════════════════════════╝


Running "flutter pub get" in flutter_tools...                      16.4s
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 2.8.1, on Microsoft Windows [Version 10.0.19042.1466], locale ja-JP)
[X] Android toolchain - develop for Android devices
    X Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.dev/docs/get-started/install/windows#android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.

[√] Chrome - develop for the web
[!] Android Studio (not installed)
[√] VS Code (version 1.63.2)
[√] Connected device (2 available)

! Doctor found issues in 2 categories.

4．Android Studio（android-studio-2021.1.1.20-windows.exe）のインストール

5．Do not import settingsを選択

6．Customを選択

7．Next

8．UIテーマの決定

9．下記にチェックを入れる。（Android Virtual Deviceはインストールされていた）

10．エミュレータの設定

11．ライセンス承認

12．Device Managerでデバイスを作成

13．エミュレータを再生してみる

14．VSCodeにFlutterをインストール

15．コマンドプロンプトを開き、Androidライセンスを許可する

C:\Users\good_> flutter doctor --android-licenses
Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installed to
resolve this.

C:\Users\good_>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 2.8.1, on Microsoft Windows [Version 10.0.19042.1466], locale ja-JP)
[!] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
    X cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    X Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/windows#android-setup for more details.
[√] Chrome - develop for the web
[√] Android Studio (version 2021.1)
[√] VS Code (version 1.63.2)
[√] Connected device (3 available)

! Doctor found issues in 1 category.

16．Android SDK Command-line Toolsをインストール

17．システム環境変数に以下を追加
C:\Users\good_\AppData\Local\Android\Sdk\cmdline-tools\latest\bin

18．コマンドプロンプト再起動して

C:\Users\good_> flutter doctor --android-licenses
...
Accept? (y/N): y
All SDK package licenses accepted

C:\Users\good_>flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 2.8.1, on Microsoft Windows [Version 10.0.19042.1466], locale ja-JP)
[√] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
[√] Chrome - develop for the web
[√] Android Studio (version 2021.1)
[√] VS Code (version 1.63.2)
[√] Connected device (3 available)

• No issues found!

19．VSCodeでF1を押して、FlutterProjects以下にアプリを作成

20．flutter runするとエミュレータ上で実行される

C:\Users\good_>flutter run

21．ここからはコーディングしていく。。。

コードでUI作る感じなんか
初級編1:画面の構築(Widget)https://t.co/dHMtnPT2V6 #Flutter pic.twitter.com/ETdobZXB8o

— がちもとさん@メタバース熊本 (@sotongshi) January 31, 2022

お疲れ様でした。

参考文献