Flutter最佳入門方式——寫一個計算器
摘要：
工作以來，我在學習新知識的時候，常常與在應試教育階段被傳授的方法作鬥爭——把書本的內容100%複製到腦中才算學會嗎？不會被使用或者不常用的知識，花費大量功夫去記憶才算完美嗎？
Flutter的入門文件給予了我很大的啟發，它並沒有把API文件或者是整個框架的內容直接展現給初學者，而是通過一...
工作以來，我在學習新知識的時候，常常與在應試教育階段被傳授的方法作鬥爭——把書本的內容100%複製到腦中才算學會嗎？不會被使用或者不常用的知識，花費大量功夫去記憶才算完美嗎？
Flutter的入門文件給予了我很大的啟發，它並沒有把API文件或者是整個框架的內容直接展現給初學者，而是通過一個簡單的計數器例子，從基礎的元件到手勢的監聽，再到狀態的改變，將Flutter最核心的思想展現的淋漓盡致。
我見過許多初學者，喜歡先將入門文件、API文件和教學視訊一字不漏地全部看完，卻從來沒有開啟編輯器，哪怕寫上一句Hello World。
我認為的高效學習的方法是， 學習掌握恰到好處可以開始的基礎知識，通過操作來深入學習 ，邊玩邊學，在這個過程中發現自己不懂的部分，通過查閱資料，掌握不懂的知識，最後將所學知識從大腦中提取出來，以別人能夠理解的方式教授給別人。
為什麼是計算器？
- 佈局經典，能學會使用最重要幾個的 Widget用法 ，迅速掌握常用的佈局，如Container、ListView、Row、Column、Expanded、FractionallySizedBox等等。
- 樣式簡單，能學會使用最常用的幾個 佈局屬性 ，如padding、color、style、decoration（圓角、描邊）、alignment等等。
- 有輸入，能學會 手勢的捕獲 以及元件間的 資料流動 。
- 有處理，能學會Dart的 基本資料型別 的用法，如String、List、int、double、num、bool等。
- 有輸出，能學會何時使用 StatelessWidget 和 StatefulWidget 。
- 不依賴UI，不依賴介面，成功執行Hello World就可以 立即開發 ，不要一開始就追求完美，因為它會阻止你行動，要知道「開始做」遠比「做好」重要。
如何開發？
1. 【總】觀察佈局，全域性出發。
從全域性出發，可以發現是一個Column（垂直）佈局，子元件們按照一定的權重分配內部空間。顯而易見，頂部Text的權重為2（flex:2），其餘子元件ListView和Row的權重均為1（flex:1）。
2. 【分】拆分元件，逐個擊破。
拆分元件，可以按照業務邏輯拆分，也可以按照佈局是否相同來拆分，在這裡筆者選擇的是按照佈局是否相同來進行拆分，原因是業務邏輯並不複雜，佈局可以複用的地方更多。如圖所示，以NumberButton元件及NumberButtonGroup元件為例：
3. 【總】整合元件，理清邏輯。
實現每一部分的元件之後，就要回到整體的計算器邏輯，即如何完成 輸入->處理->輸出 ？
