Flutter คือ Google Mobile ui framework ที่ถูกพัฒนาขึ้นมาใหม่ เพื่อให้สามารถพัฒนา application ให้มีความสวยงามและมีประสิทธิภาพมากขึ้น
รองรับการพัฒนา Native App ทั้ง IOS และ Android การใช้งานสามารถใช้ร่วมกับ IDE เช่น Android Studio, Visual Code , Intellij เป็นต้น
การติตตั้งร่วมกับ Android Studio ด้วยการคิดตั้ง plugin ดังนี้
ติดตั้ง flutter command
การติดตั้งจะติดตั้ง จาก github ดังนี้
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
// Clone $ git clone -b beta https://github.com/flutter/flutter.git //set ตัวแปร PATH ให้เรียบร้อย สำหรับ linux ตั้งเพิ่มใน ~/.bash_profile ด้วย // ส่วน window ก็ต้องเพ่ิมใน system environment $ export PATH=`pwd`/flutter/bin:$PATH $ flutter Checking Dart SDK version... Downloading Dart SDK from Flutter engine e61bb9ac3a3fd789754e2e54220bcfc27076a857... Unzipping Dart SDK... Updating flutter tool... Manage your Flutter app development. ╔════════════════════════════════════════════════════════════════════════════╗ ║ Welcome to Flutter! - https://flutter.io ║ ║ ║ ║ The Flutter tool anonymously reports feature usage statistics and crash ║ ║ reports to Google in order to help Google contribute improvements to ║ ║ Flutter over time. ║ ║ ║ ║ Read about data we send with crash reports: ║ ║ https://github.com/flutter/flutter/wiki/Flutter-CLI-crash-reporting ║ ║ ║ ║ See Google's privacy policy: ║ ║ https://www.google.com/intl/en/policies/privacy/ ║ ║ ║ ║ Use "flutter config --no-analytics" to disable analytics and crash ║ ║ reporting. ║ ╚════════════════════════════════════════════════════════════════════════════╝ //ติดตั้ง Dependency $ flutter doctor Downloading Material fonts... 2.2s Downloading package sky_engine... 1.5s Downloading common tools... 5.1s Downloading windows-x64 tools... 29.9s Downloading android-arm-profile/windows-x64 tools... 6.1s Downloading android-arm-release/windows-x64 tools... 6.6s Downloading android-arm64-profile/windows-x64 tools... 15.0s Downloading android-arm64-release/windows-x64 tools... 8.3s Downloading android-x86 tools... 30.5s Downloading android-x64 tools... 11.8s Downloading android-arm tools... 10.2s |
อ้างอิงจาก https://flutter.io/get-started/editor/
การใช้งานร่วมกับ Visual Code สามารถทำได้ดังนี้
1 2 3 4 |
1) เปิด VS code 2) กด View > Command Palette 3) เลือก Extensions: Install Extension’ 4) ใส่ค่า 'dart code' เพื่อค้นหา และทำการติดตั้ง |
Validate Setup
1 2 3 |
1) เปิด VS code 2) กด View > Command Palette 3) พิมพ์ 'Flutter: Run Flutter Doctor' |
การ start ios simulator
1 |
open -a Simulator |