StatefulWidget和StatelessWidget是Flutter中所有Widget的兩個(gè)分類位他，StatefulWidget的內(nèi)部保存有狀態(tài)氛濒，當(dāng)狀態(tài)發(fā)生改變時(shí)，Widget的界面也會(huì)隨之改變（這點(diǎn)跟React類似）鹅髓；StatelessWidget的內(nèi)部沒有保存狀態(tài)舞竿，它的界面也不會(huì)發(fā)生改變。上面的代碼中已經(jīng)展示了定義一個(gè)無狀態(tài)Widget的步驟：繼承StatelessWidget并實(shí)現(xiàn)build方法即可窿冯。
如果是定義一個(gè)有狀態(tài)的Widget骗奖，代碼會(huì)稍微多一點(diǎn)，如下代碼所示：
import 'package:flutter/material.dart';
void main() => runApp(new MyStatefulWidget());
// 定義一個(gè)有狀態(tài)的組件
class MyStatefulWidget extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return new MyStatefulWidgetState();
}
}
// 定義一個(gè)有狀態(tài)的組件時(shí)靡菇，必須為該組件創(chuàng)建一個(gè)狀態(tài)類重归，這個(gè)類繼承自State類
class MyStatefulWidgetState extends State<MyStatefulWidget> {
String text = "Click Me!";
changeText() {
if (text == "Click Me!") {
setState(() {
text = "Hello World!";
});
} else {
setState(() {
text = "Click Me!";
});
}
}
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: "Test",
home: new Scaffold(
appBar: new AppBar(
title: new Text("Test"),
),
body: new Center(
// InkWell是Flutter內(nèi)置的一個(gè)Widget米愿，用于給其他Widget添加點(diǎn)擊事件厦凤，并且在點(diǎn)擊時(shí)會(huì)有水波紋擴(kuò)散效果
child: new InkWell(
child: new Text(text),
onTap: () {
this.changeText();
},
),
),
),
);
}
}
定義一個(gè)有狀態(tài)的組件的步驟如下：
- 創(chuàng)建類繼承自StatefulWidget并實(shí)現(xiàn)createState方法，注意育苟，這里跟StatelessWidget不同了较鼓，不是實(shí)現(xiàn)build方法。createState方法返回的是一個(gè)狀態(tài)State违柏。
- 為了讓第一步中的createState方法有返回值博烂，還需要?jiǎng)?chuàng)建一個(gè)狀態(tài)類繼承自State類，State類是個(gè)泛型類漱竖，你需要將第一步中創(chuàng)建的類傳給State禽篱。
- 創(chuàng)建完自定義的State類后，實(shí)現(xiàn)build方法馍惹，并返回你所需要的Widget躺率。
- 在自定義的State類中，用變量保存組件的狀態(tài)万矾，并在合適的時(shí)候改變這個(gè)狀態(tài)值悼吱。比如在上面的代碼中，我們需要在點(diǎn)擊文本時(shí)切換文本良狈，所以用一個(gè)text變量保存組件的文本值后添，當(dāng)點(diǎn)擊按鈕時(shí)，通過調(diào)用State組件的setState()方法薪丁，重新為text變量賦值遇西，從而達(dá)到改變文本的目的馅精。
