どーも、ぐるたか@guru_takaです。
Flutterの”Hello Wordl”をVScodeでやってみる方法を紹介します。
環境構築については、こちらを参考にしてみてください!
【Mac】Flutterの環境構築をまとめてみる
主な流れ
→エミュレーターから、flutter:new projectを選択→projectの名前入力してenter→プロジェクトのフォルダ場所を選んでして完了
STEP.1
VSCode上で
Cmd+Shift+P
ですべてのコマンド表示 MEMO
拡張機能Flutter
のインストールが必要ですSTEP.2
エミュレーター『lutter:new project』起動
![スクリーンショット 2019-08-25 12.27.14.png スクリーンショット 2019 08 25 12 27 14](https://gurutaka-log.com/wp-content/uploads/7e5e3044d1bf6ab7c608c8e418908fdf.png)
STEP.3
Project名を入力してEnter
![スクリーンショット 2019-08-25 12.28.18.png スクリーンショット 2019 08 25 12 28 18](https://gurutaka-log.com/wp-content/uploads/915389f10438eb8b114c141d7dafd677.png)
STEP.4
保存先を選択
すると、こんな感じでファイルはできあがります!
![スクリーンショット 2019-08-25 15.54.47.png スクリーンショット 2019 08 25 15 54 47]()
![スクリーンショット 2019-08-25 15.54.47.png スクリーンショット 2019 08 25 15 54 47](https://gurutaka-log.com/wp-content/uploads/004de7a582bd31ccbfe247a5ca8a21cb.png)
最後に:F5でデバック完了!
あとは、スマホとPCBをつないで、F5
を押せば完了。デバックコンソールにはこんな画面がでてきます!
そして、スマホにこんな画面がでてくればOKです。FlutterのHello Worldができました!
MEMO
![スクリーンショット 2019-08-25 16.00.08.png スクリーンショット 2019 08 25 16 00 08](https://gurutaka-log.com/wp-content/uploads/7e9c20e22405dc756064b3f204e0973c.png)
VSCodeのメニュー>デバック>デバックの開始
をクリックしてもデバックできます!
注意
Androidでデバックするとき、設定にてUSBの設定>ファイル転送
を選ぶ必要があるのでご注意ください!
コメントを残す