おそらくFlutterの公式サイトであろう所を参考にしながら、Flutterの環境構築していく備忘録なのですが…

 

「始めましょう」というガイドに従って順に作業してるのですが…

それによると、次の作業は、もう「3. 試乗」になってしまいます…驚き

 

 1. インストール
 2. エディターをセットアップする
 3. 試乗
 4. 最初のアプリを作成する
 5. 詳細を見る

 

え、え、えぇぇぇぇっ!?

「試乗」って、原文英単語だと「Test drive」で、具体的に何するかというと、

 

 

該当ページのTOPに書かれてるのによると、

 

テンプレートから新しい Flutter アプリを作成して実行し、アプリに変更を加えた後に「ホット リロード」を体験する

 

マジか…もうアプリ作成して動かせるのか…驚き

というか、開発用のエディタは入れましたけど、開発言語(おそらくXCODE)を入れてないのですが…

テンプレート動くの??

もしかして、もしかして、AndroidStudio入れたからJavaはいってるし、Javaで動くってことか??

 

とりあえず、上↑のページに従って、やってみるのみです。

 

 ■ ■ ■

 

まず、テンプレアプリのプロジェクトを作成

 

↑の手順で…プロジェクトフォルダーを作成&指定した程度で、3つくらい質問あったけど、さっくりアプリ作成完了キラキラ

 

 

次は、アプリの実行です。

VSCodeの下の青色バーに「デバイスセレクター」領域があるとのことですが…

私の「デバイスセレクター」領域には、Windowsが表示されてる…魂が抜ける

アレか、昨日、実機デバイス設定めんどいとか言ってパスしたのが早々に…ごふっ。

実機ー実機ーどこだーどこに置いてるー…笑い泣き

 

実機、開発者向けオプション消してたので、ここ見ながら再設定…

とりあえず「USBデバック」を有効化くらいでいいのかな…

 

「flutter devices」コマンドを実行しなおしてみたら、Raijinが増えてたので、デバイス設定できたんだろう…

今更、Android7.0の機種をTESTデバイスに設定するのはいかがなものかとも思うけど、自分のスマホを(比較的新しい)を開発者向けオプションONにしたら、重くなるので、ツムツムの動きが重くなりそうでイヤ真顔

 

えっと、VSCodeに戻って、実行デバイスを7.0の実機に切り替えしないとね。

ここ↓を参考にして…

 

また、コマンドうつのか…めんどいな…

今後、コピペでいけるように、コマンド書いとくか…

鉛筆「Flutter: Select Device」

 

と、ステイタスバーの「デバイスセレクター」領域見たら、なんと勝手に実機に切り替わってた!!おぉぉぉキラキラ

 

アプリ実行手順に戻ります!

 

ステイタスバーの「デバイスセレクタ―」領域は、USBでつないだ実機の名前に切り替わっていたので、

[実行] → [デバッグの開始] でアプリ実行できるはず!!

 

うぉぉぉ、なんか、エラー出たえーん

 

「JSON」無いとかゆーとる…JSON…ぐぐるか…

 

よくわからんエラーだったけど、↓のサイトの「構成ファイルの作成」あたりを参考にして

 

launch.jsonファイルを作成」したら、エラー消えた!!

 

再度、[実行] → [デバッグの開始] 、たちあがったぞぉぉぉキラキラ


 

次は、アプリ立ち上げたままの更新、ホットリロードを試します!!

 

「main.dart」ファイル内の文字列を変更するっぽい。

日本語翻訳してると、どうゆう文章かわからないので、一度英語表示に戻してみた。

 

'You have pushed the button this many times'
  ↓
'You have clicked the button this many times'

 

ここだな!!

修正して、[ファイル]→[すべてを保存]したら、アプリの画面更新された~ニコニコ

とりあえず、デバックを停止しました。

 

デバック関係のアイコンのメモ鉛筆

 雷:↑でやった「ホットリロード」な保存。アプリ実行のまま更新する保存。

 :デバック停止。じゃないんだ…驚き

 

 

そんな感じで、試乗終了です。

簡単な使い方が分かった気がする。

 

次は、最初のキラキラアプリ作成キラキラですニコニコ