void main() {
  runApp(MyApp());
}

繼續看這個...

我們現在知道「main」是程式的進入點、啟動APP後電腦會來這地方看看要做些什麼事情。

而runApp則是「顯示這個Widget作為UI」。

什麼叫Widget？又為什麼要顯示它作為UI？如果main裡面不設定執行runApp會發生什麼事？

各種平台上的各種風格UI，基本原理都只是「在螢幕上輸出文字線條色彩」而已。

所謂的「按鈕」只是個背景加了框線（還會有點擊動畫效果）的文字而已，所謂的表格只是畫幾條線，然後在空白處有規律性的寫上文字而已。電腦會即刻運算「這段文字要從螢幕座標的(x,y)開始寫起...」「這條線的起點會在螢幕座標(x1,y1)，終點會在螢幕座標（x2,y2）...」，如果螢幕可以一秒鐘顯示32幀，電腦一秒鐘就要連續畫32次，如果畫面可以滾動，那x/x1/x2/y/y1/y2通通都要在每幀顯示時即刻運算....

所以一段文字在電腦中並不僅僅是「一段文字」而已，還需要「用來顯示的座標」「文字大小」「文字顏色」「背景」...等資訊做為搭配。

但，基本上就是「要在螢幕上的哪個範圍內畫上什麼樣的內容」而已。

可以將這種思維擴展開來，我們也可以得到「一個APP的畫面通常固定由標題、抽屜選單、主畫面幾個項目構成」這樣的原則。──有些時候，APP設計的標題會複雜一些，有些時候APP不需要抽屜選單，雖然這樣劃分並不能包含太多實用的UI設計重點，但這卻是個相較之下可以歸納分類並重複使用的原則。──而這個原則就是個Widget。

像下面這段程式碼就是規劃了一個Widget，裡面含有「appBar（標題）」、「floatingActionButton（浮動按鈕）」、和「body（主畫面）」。

 @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }

可以看到appBar和body內都有使用Text這個「函數」，而這個函數後面都接收了會顯示在畫面上的文字，也就是說Text的功能就是「在特定範圍內畫上一段文字」。

如果將body的內容作點「修改」，像下面這樣...

body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Test Text',
            ),
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),

按下執行後就會看到主畫面上多了一行文字「Test Text」。

但「Text」是怎麼決定文字的座標與範圍？...這是另一個議題。

以上所說，是一種理解跟構思「程式設計」的思維方向。

但很遺憾的，它其實很入門很初階，不是因為這些程式碼中還有很多東西還沒解釋介紹，而是因為以上所說的思維方向是「函數化/結構式」的思維，但Flutter並不是種使用「函數化/結構式」思維的程式語言，如果要更能掌握Flutter這些程式碼的意義與應用方式，就需要懂物件導向和資料結構。