Flutter初體驗

接上一篇文章：Flutter環境搭建，本文主要講解如何利用Android Studio和VsCode開發一個簡單的Flutter應用，如果要了解在原生APP中接入Flutter，可以參考下面兩篇文章：iOS原生項目集成 Flutter和Android原生項目集成Flutter

創建項目

根據Flutter官方文檔的介紹，新建Flutter應用主要有三種手段：Android Studio、VS Code和Terminal + 編輯器方式，下面就從這三種方式來給大家講解。

Android Studio

新建應用

在Android Studio中，依次選擇File->New Flutter Project-> Flutter application，然後填寫相關信息點擊「Next」，最後點擊「Finish」。如下圖：

創建的項目的源碼位於lib/main.dart下，我們可以修改main.dart的源碼內容（如果你對dart語言比較熟悉）。

運行應用程序

運行程序也非常的簡單，定位到Android Studio 工具欄，然後點擊運行按鈕即可。

熱重載

Flutter 可以通過 熱重載（hot reload） 實現快速的開發周期，熱重載就是無需重啟應用程序就能實時載入修改後的代碼，並且不會丟失狀態。簡單來說，就是當代碼被更改後，系統會告知IDE或命令行工具需要重新載入（點擊reload按鈕），此時你就會在設備或模擬器上看到更改的內容。

1. 將字元串』You have pushed the button this many times:』 更改為 『You have clicked the button this many times:』。
2. 不要按「Stop」按鈕; 讓您的應用繼續運行。
3. 要查看您的更改, 只需調用 Save All (cmd-s / ctrl-s), 或點擊 熱重載按鈕 (帶有閃電??圖標的按鈕)即可。

VS Code

VS Code是一個輕量級編輯器，支持Flutter運行和調試，開發Flutter應用之前，需要先安裝Flutter和Dart插件。

新建項目

啟動VS Code，依次選擇 View>Command Palette…，輸入 『flutter』, 然後選擇 『Flutter: New Project』 action，輸入 Project 名稱 (如myapp), 然後按回車鍵，指定放置項目的位置，然後選擇藍色的確定按鈕即可。

運行項目

請確保在VS Code的右下角選擇了目標設備，然後按 F5 鍵或調用Debug>Start Debugging等待應用程序啟動。如果一切正常，在應用程序建成功後，您應該在您的設備或模擬器上看到應用程序。

Terminal + 編輯器

創建項目

除了上面介紹的兩種方式，您還可以使用編輯器與Flutter的終端工具結合的方式構建和運行Flutter項目。

1，使用 flutter create 命令創建一個project，命令如下：

flutter create myappcd myapp

此時，就創建了一個名為myapp的Flutter項目，項目的代碼位於 lib/main.dart中。

運行項目

1，檢查Android或iOS設備是否處於運行狀態，如果沒有，請先啟動設備。可以使用下面的命令來查看設備的連接情況：

flutter devices

2，使用命令「 flutter run」來運行項目。

flutter run

如果一切正常，在應用程序建成功後，您應該在您的設備或模擬器上看到應用程序。