書接上回,今天繼續完成最后的講解:
class _MyHomePageState extends State<MyHomePage> {int _counter = 0;void _incrementCounter() {setState(() {_counter++;});}
可以看到,這里的_MyHomePageState是一個類,繼承于 State<MyHomePage>,而由于之前的代碼里面的createState方法會基于此創建實例對象
下方的語法就很簡單了,定義一個整型的變量,然后定義一個函數,這些都是dart基礎語法里面的內容
值得注意的是,setState是一個flutter自帶的方法,其作用是用于通知Flutter框架,當前狀態已經發生了變化,需要重新構建UI
接下來進入最后一段代碼,也是大家最為熟悉的(如果看了我之前的文章的話):
@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(backgroundColor: Theme.of(context).colorScheme.inversePrimary,title: Text(widget.title),),body: Center(child: Column(mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[const Text('You have pushed the button this many times:'),Text('$_counter',style: Theme.of(context).textTheme.headlineMedium, ),],),),floatingActionButton: FloatingActionButton(onPressed: _incrementCounter, tooltip: 'Increment', child: const Icon(Icons.add), ), );}
}
還是常規操作,@override,下面的想必大家已經熟悉了,Scaffold,appBar,AppBar,title,Center,這些之前正著講的時候,都有說到用到過。這里就提一些之前沒有提到過的叭。
關于顏色,backgroundColor這里調用的是主題相關的顏色,title是之前取的title名,當然,是和標題相關的
Column指的是垂直方向的構架,而center則是中心,即垂直方向的中間
我們看見的按鈕是怎么來的呢?floatingActionButton就是那個懸浮按鈕,當“onPressed”的時候,執行我們之前的那個方法,tooltip會在當你把鼠標放在按鈕圖標上的時候顯示,而最后則是按鈕的圖像顯示,這里的add就是加號的圖像
至此,flutter基礎文件講解就此結束啦!
祝大家天天開心!代碼一遍就通!沒有debug的煩惱!