第四章：不破不立，永不放弃

做好了前期的准备，从这篇开始就跟着我一步一步地挖掘Flutter中的坑吧。 

视图的祖宗——widget

在安卓中提到View，你知道所有视图组件的祖宗都是View，但是这祖宗不亲民啊。可在Flutter中就不一样了，widget到处都是，可以说widget支撑起了Flutter的全部脸面。我们在开发界面中会对“树”的概念更加深刻，child和children比比皆是。你会发现widget嵌套是最正常不过了。我说这些的意思是想让大家思想发散一下，习惯一下widget。当你在Flutter开发中看到某个控件的属性需要一个widget类型的值，那么你就可以放心大胆的放你想要放的视图组件吧。

举个栗子：比如AppBar这个控件。就是我们平常见到的页面顶部标题栏。它有个title属性，平常我们在安卓中肯定认为这个属性也就是让写个String类型的标题，但在Flutter中你会发现title是Widget类型的，这个时候你就可以联想了，我是不是放任何组件都可以呢？如果我想让它显示文字我们就放个Text控件，如果我们让他显示图片我们就放个Image控件，甚至我们可以放个TabBar控件让它显示个选项卡。看到这里是不是感觉widget是不是很亲民，安卓中复杂的页面可能在Flutter中一个嵌套搞定了^_^。效果参考下图：

AppBar源码

AppBar嵌套Text的效果​​​​​

AppBar嵌套TabBar的效果

StatelessWidget和StatefulWidget两大门派

了解了Widget这个控件的伟大之处，那么下面我们就了解一下Widget的两大门派StatelessWidget和StatefulWidget。

为什么要有这两大门派呢？由这个问题就引出了另一个棘手的问题，Flutter有没有像Android项目中的R文件呢？没有R文件怎么指定刷新界面呢？我怎么找到Button添加点击事件呢？我们在android开发中通过给控件指定Id，就可以通过Id得到控件从而添加事件和刷新数据。我们在HTML网页开发中我们也可以通过控件的id属性完成事件添加和刷新数据。Flutter中咋办呢？

这就是Flutter的特别之处。Flutter没有Id这个东西，他直接给你分了两类，如果你想一个控件从这个页面创建到消失一成不变呢，你就继承StatelessWidget。如果你想在使用过程中改变它的内容呢（小到改变颜色，大到网络请求刷新数据），你就继承StatefulWidget。如果还不明白请读如何更新widget（温馨提示：点击链接阅读，温故而知新），是不是有点意思。

知道了SatelessWidget和StatefulWidget的由来，咱们就着重介绍一下这两个朋友。

StatelessWidget这个朋友呢我们就用一句话概括他：谁想一辈子就躺那儿跟我走。

StatefulWidget这个朋友我们就不能用一句话概括了，他干的活比较多。对于这个哥们我们用的最多的是他下面这两个方法：

//调用这个方法，可以使本控件内的页面重新build
setState(() {
   //TODO 将你想要改变的数据进行改变
});

//重写这个方法可以预先加载你的数据比如：提前加载网络数据等等。系统调用顺序是先调用initState然后调用build
@override
void initState() {
  super.initState();
  //TODO 初始化你的变量或你要预先加载的东西
}

到此两个朋友介绍完了，只讲重点。

路遥遥兮，坑不断。。。期待下篇吧^_^。

 

悄悄话：

安卓开发者的福利：小绿人  一个实用的安卓开发工具箱，搜集了数千个开源项目。拿走不谢^_^。