搭建直播带货平台Flutter学习指南，UI布局和控件

搭建直播带货平台Flutter学习指南，UI布局和控件
在 Flutter 里，UI 控件就是所谓的 Widget。通过组合不同的 Widget，来实现我们用户交互界面。
Widget 分为两种，一种是无状态的，叫 StatelessWidget，它只能用来展示信息，不能有动作（用户交互）；另一种是有状态的，叫 StatefulWidget，这种 Widget 可以通过改变状态使得 UI 发生变化，它可以包含用户交互。
StatelessWidget 的使用非常简单，我们只需要继承 StatelessWidget，然后实现 build 方法就可以了：

class FooWidget extends StatelessWidget { @override Widget build(BuildContext context) { // ... }}

关于 build 方法的实现，在后面我们学习具体的控件时读者就会了解的，这里暂时忽略掉。
StatefulWidget 用起来麻烦一些，他还需要一个 State：

class BarWidget extends StatefulWidget { @override State createState() { return _BarWidgetState(); }}class _BarWidgetState extends State<BarWidget> { @override Widget build(BuildContext context) { // ... }}

 

这里看起来可能有些绕，BarWidget 依赖了 _BarWidgetState，而 _BarWidgetState 又继承了 State<
BarWidget>。如果读者不太理解，其实也没有什么关系，这只是一个样板代码，照着写就行了。
从 BarWidget 的实现来看，好像跟前面使用 StatelessWidget 没有什么区别，都是在 build 方法里面返回一个 Widget，只是 stateful widget 把这个方法挪到了 State 里面。实际上，两者的区别非常大。stateless widget 整个生命周期里都不会改变，所以 build 方法只会执行一次。而 stateful widget 只要状态改变，就会调用 build 方法重新创建 UI。
为了触发 UI 的重建，我们可以调用 setState 方法。下面的代码读者留意一下即可，在后面我们学习了相关的控件后再回过头来看。

class BarWidget extends StatefulWidget { @override State createState()
{ return _BarWidgetState(); }}class _BarWidgetState extends State<BarWidget>
{ var i = 0; @override Widget build(BuildContext context)
{ return Row( children: <Widget>[ Text('i = $i'), RaisedButton( onPressed: ()
{ setState(() { ++i; }); },
child: Text('click'), ) ], ); }}

 

以上就是 搭建直播带货平台Flutter学习指南，UI布局和控件的相关代码，更多内容欢迎关注之后的文章