來吧！Flutter(3)：第一個Flutter App
一個Hello World的App。
版本資訊
IDE: Android Studio 4.0
Flutter版本：1.17.3
安裝 Flutter 的流程
（略，可參考官方流程，若有問題可留言跟我討論）
利用 Android Studio 開啟一個 Flutter App
1、點選 Start a new Flutter project
2、選擇 Flutter Application
3、填入專案資訊，由上至下：專案名稱，Flutter SDK 路徑，專案位置，專案描述。
4、填寫 Package 名稱，點選 Finish，完成初始設定。
Flutter 資料夾結構
以下是四個重要的資料夾：
- android：原生 Android 的 code base。
- ios：原生 iOS 的 code base。
- lib：Flutter 程式碼位置。
- test：單元測試。
另外，pubspec.yaml 定義了 flutter 相關的參數。
真的要開始寫了
1、開啟 lib/main.dart
main.dart 是 flutter app 進入點，在這裡我們可以發現一個名為 main 的函式。在 main() 中，runApp 帶入的參數 MyApp()，就是我們 Flutter App 的第一個 Widget。
2、將 Sample Code 全部移除，並加入一個空白的 StatelessWidget。
StatelessWidget 顧名思義就是沒有狀態的 Widget，在 Flutter 中，所有的 Widget 都是不變的，所以 StatelessWidget 一經建立，就不會改變。
可以看到，MyApp 繼承了 StatelessWidget，並且實作一個名為 build 的方法。
在 Flutter 中，當畫面重新繪製，就會呼叫 build，進而將裡面所實作的畫面畫出來。
以上面的例子來說，這個 build 回傳了一個 Container，因為 Container 裡面沒有寫任何內容，所以結果會是空的（一片黑）。
3、將背景改為黃色，並填入文字“Hello world”
哎呀，Hello World 怎麼跑到畫面最左上方了？
這是因為我們在 MyApp() 中，直接回傳一個 Container，所以這個 Container 就會包含整個畫面，當 Container 裡的 Text 沒有說明要擺在哪邊時，就會以左上角為起始點。（因為我們的 textDirection 的參數為 TextDirection.ltr）
4、讓 Hello World 放到正中間。我們只要將 Text 用 Center Widget 包起來即可。
5、將字體調大
在 Text Widget 中，有一個名為 style 的參數（型態：TextStyle），我們可以在 TextStyle 中，設定字型、大小、顏色等等…
例如：將字體大小改為 50.0px，顏色改為綠色，字體為斜體
Text('Hello World', style:TextStyle(fontSize: 50.0, color: Colors.green, fontStyle: FontStyle.italic),)
小結
- main.dart 中的 void mainO{funApp(xxx)} 是 flutter 的起始點。
- StatelessWidget 一經建立就不會改變，繪製 Widget 時，會呼叫該 Widget 的 build function。
- 每一個物件都是 Widget，包含今天提到的 Container, Text, Center…
- Text Widget 的格式可以利用 TextStyle 來設定。
