今回は、androidにスイッチを作り「スイッチを押すとhttp通信でnode-redにデータを送る」設定をしたいと思います。VScordのFlutterを使って追加していきます。
Fllutterの追加方法
まずは、下記のURLでFlutterをインストールします。
https://docs.flutter.dev/get-started/install
お使いのデバイスを選び、次のページでandroidを選びます。
開いたページを下に行くと「Install the Flutter SDK」という名前が出てきますので、そちらをダウンロードします。
ダウンロードファイルを展開して「C:\」のどこかに入れます。自分は直下に入れました。
Windows検索欄から「環境変数を編集」を開きます。
Pathの編集を開き、新規をクリックし「C:\flutter\bin」追加して下さい。この時、「\flutter\bin」をめがけて指定したいので、C直下ではない場合ふぁあいるを見つけてパスを確認してください。
下のパスも後々追加します。
ここまで追加したら、コマンドプロンプトで下記を入れます。
flutter --version
本当であれば、もうちょっと色々走るかもしれません。（ダウンロードが終わっていて確認できませんでした）
次に下記のコマンドを入力します。
flutter doctorするとローディング後、チェックマークや罰マークが出てきます。
初めはもっといっぱいのデータが出てきます。そして、
・Android toolchain
・Visual Studio
にエラーが出ます。
これは、この後インストールしますのでいったん置いておきます。
Android toolchainのインストール
まずは、下記URLからインストールします。
https://developer.android.com/studio?hl=ja
ダウンロードしたファイルを開き、インストールをするとプロジェクトが開かれます。
プロジェクトをクリックし、右上の点々からSDK Manegerを開きandroid SDKにチェックをいれます。
OKを押すとファイルのダウンロードが始まるので、OKをクリックし終わったら閉じてください。
最後に、コマンドプロンプトから下記のコマンドを実行します。
flutter doctor --android-licensesすると同意のメッセージが複数回出てきますので、すべて「y」で同意します。
これでセットアップ完了です。
もう一度先ほどのコマンドを実行すると、Android toolchainがチェックになっていると思います。
flutter doctorVisual Studioのインストール
今回はVScordを使っていくのですが、VScordではモバイル開発のC++がないそうで、Visual StudioのC++をダウンロードしていきます。
まずは、下記URLからダウンロードします。(無料ダウンロード版で大丈夫です)
https://visualstudio.microsoft.com/ja/downloads
インストールファイルを実行し、C++にチェックを入れます。
こちらの2つがダウンロードで切れば設定完了です。
先ほどのコマンドを実行するとすべてにチェックマークが入っているかと思います。
flutter doctorVSchordの設定
これでFlutterのインストールが完了したので、次にVScordの設定をしていきます。
VScordの開き、左のメニューバー□が四つあるアイコンをクリックします。
ここで「Flutter」と検索し、一番上の公式マークのあるDart Codeをインストールします。
最後にフォルダーを作ります。下記コマンドをVScordのターミナルで実行してください。
flutter create testするとファイルが作られます。
一番下の「Your application code is in main\lib\main.dart」という部分が、プログラムの変更部分になります。ファイルから保存先を開いてください。
この時、ファイルを作るのがPS C:\Users\PCの名前>となっている場合、ファイルはそのパス内に作られます。
そのため、上のバーから
file→open file→c:\ユーザー\PC名\test\lib\main.dartを開いてください。
下記のようなファイルが開けましたら、2行目と3行目の間にあるRunをクリックします。
するとandroid画面が立ち上がります。
これで、起動確認も完了になります。