Print
Details: Category: บทความ Flutter | Published: 17 December 2018 | Hits: 8467

 การสร้าง โปรเจ็ค Flutter บน VS code จาก คอร์สสอนFlutter ตัวต่อตัว http://www.androidthai.in.th/private-project-android-flutter-course.html เราสามารถใช้ VS code ในการเขียน Flutter ด้วย Dart แทน Android Studio ได้ โดย

Screen Shot 2561 12 17 at 06.07.29

เปิด VS code ขึ้นมาเลยครับ (ถ้ามีโปรเจ็คเก่าปิดก่อน หรือ จะ New Windows ขึ้นมาใหม่ ได้ครับ)

Screen Shot 2561 12 17 at 06.08.57

ไปที่ View > Command Palette

Screen Shot 2561 12 17 at 06.09.07

จะได้แบบนี้ครับ

Screen Shot 2561 12 17 at 06.10.52

 

หลัง เทค ให้พิมพ์ flu จะเจอ Flutter:New Project

Screen Shot 2561 12 17 at 06.11.06

 

Screen Shot 2561 12 17 at 06.11.35

มาสเตอร์ ตั้งชื่อโปรเจ็คง่ายๆ ว่า master_ung_flutter อ้อ อย่าให้มีอักษรตัวใหญ่ หรือ อักษรพิเศษนะครับ (ยอมตัวเดียว _ under score)

Screen Shot 2561 12 17 at 06.12.06

หา Path ที่เก็บโปรเจ็ค Flutter ให้เขา

Screen Shot 2561 12 17 at 06.12.23

รอครับ ตัว VS code จะ Create Flutter Project ให้เรา

Screen Shot 2561 12 17 at 06.13.28

ได้มาละ โปรเจ็ค Flutter ของเรา บน VS code

Screen Shot 2561 12 17 at 06.13.40

ลองเปิด main.dart เดี๋ยวเรามาเจอกัน

Screen Shot 2561 12 17 at 06.15.26

ลองเปิด Termial และ Start Simulator  หรือ Genymotion ขึ้นมาทดสอบโค้ด Flutter โดยใช้คำสั่ง 

flutter run

 Screen Shot 2561 12 17 at 06.16.07

 รอครับ

Screen Shot 2561 12 17 at 06.16.42

 

Screen Shot 2561 12 17 at 06.16.45

 

ได้มาละ โปรเจ็ค Flutter ของเราที่จะต่อยอดไปทำอย่างอื่น สำหรับใครที่ทำไม่ได้หรือ อยากจะต่อยอด ลองดูที่ http://www.androidthai.in.th/private-project-android-flutter-course.html ได้ครับ