本篇文章中心思想

之前的文章有分享實現的方案，細心的同學會發現不能自定義圖示，圖示是用的Flutter自帶的一個圖示庫，今天這篇文章教大家實現自定義的底部操作按鈕。

Flutter實現的一個效果，好看吧。

第一步：實現啟動頁面

下面這張圖片大家應該認識吧，很簡單的一個Flutter專案的架構，左邊選單時候專案的一個整體結構，右邊是程式碼區，第一行是兩個匯入包，一般的專案都是這樣匯入的，按照匯入就行了，第五行的程式碼就是一個啟動方法，一個專案必須有這一行，代表程式開啟要執行的第一個方法。

void main() => runApp(MyApp());

然後接著往下看，第7行，Flutter中的StatelessWidget是一個不需要狀態更改的widget - 它沒有要管理的內部狀態。簡單理解就是每個專案都有這個，是一個沒有狀態的，不能更新狀態的一個activity.

主頁

第二個類大家也來看看Home類

無需解釋，大家一看就懂，如果有不懂的可以關注我，來私信問我哈。簡單解釋一下，這個類用了Flutter的StatefulWidget，一個有狀態的框架，別為那麼多，按照寫，多動手，看不懂也沒關係。動起來是程式設計師的關鍵。

有個類我還的解釋一下：Scaffold，這個玩意就是一個框架，相當於一個佈局。翻譯過來意識是腳手架。別問那麼多，按照寫就對了。

關鍵類就是MenuTabBar，是的，就是它我們自定義的一個它。這個類我們馬上來看看。

第二個類

第三個類，關鍵類，有動畫，有操作的類

3張圖片證明了我們這個類的強大，就是一些動畫，按鈕，拖動點選的操作，

第四個我們專案還用到了第三方庫rxdart,RxDart是 Frank Pepermans 和 Brian Egan兩位大神主導的專案，是Rx大家族對Dart語言的支援。如果你已經使用過其他語言的Rx庫，那麼對於RxDart應該很容易上手，因為很多方法函式上聽起來都差不多。

總結

今天就實現這些了，後續繼續更新其他的實現方式。學習是一件很累的事情，邊學習邊整理也是一種提升自己的方式，我的提升需要大家的監督，需要原始碼的可以關注私信獲取哈。