【Android】Flutter中无状态和有状态部件之间的区别

简介

要在 Flutter 中构建任何应用程序，我们必须创建一个 widget 类，这是 Flutter 应用程序的构建块。Flutter使用widget来创建现代移动应用程序。

Flutter中的部件被分为两种类型：无状态部件和有状态部件。考虑到这一点，我们将看看Flutter中的无状态和有状态部件是什么，并解释它们的区别。

让我们从这个问题开始。在Flutter中，widget的状态是什么？

小组件的状态

状态是指在构建时间内同步读取部件类的信息–也就是说，当部件在屏幕上显示时，如果信息在其生命周期内被改变，则可能发生变化。

Flutter有几个内置的小组件，它们都被分为有状态和无状态小组件。

无状态小组件

一个无状态的部件在Flutter应用程序的运行期间不能改变其状态。这意味着无状态小组件在应用程序运行时不能被重新绘制。出于这个原因，外观和属性在小组件的整个生命周期内保持不变。

当我们所描述的用户界面的一部分不依赖于任何其他部件时，无状态部件就很有用。无状态部件的例子是文本、图标、图标按钮和凸起按钮。

这是一个无状态部件的例子。

class StatelessScreen extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
   return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('LogRockets'),
          backgroundColor: Colors.blueGrey[600],
        ),
        backgroundColor: Colors.white,
        body: Container(),
      ),
    );
  }
} 

我们可以看到，在代码中，无状态小组件的名字是StatelessScreen ，它覆盖了build 方法。build 方法接受BuildContext 作为参数，并返回一个 widget。

当我们创建一个不需要反复重绘部件的应用程序时，我们会使用一个无状态的部件。例如，当我们创建一个AppBar ，一个无状态的widget可以是不需要改变的脚手架或图标。

一个无状态的widget类被调用一次，只在它被初始化的时候。即使有外部力量作用于它，它也不会被更新。

每当StatelessScreen widget被初始化时，build 方法被调用。之后，该部件将被打印在屏幕上。

但是，如果我们想让它在有动作时被更新，我们必须做一个有状态的部件。

有状态的部件

当用户界面的某些部分必须在运行时动态变化时，就会使用一个有状态的部件。有状态的部件可以在应用程序运行时多次重绘自己。

当我们所描述的用户界面的一部分动态变化时，有状态的小组件就很有用。如果我们创建一个按钮部件，在用户每次点击该按钮时都会自我更新，这就是一个有状态的部件。

这就是你如何使用一个有状态的部件。

class StatefulScreen extends StatefulWidget {
  @override
  _StatefulScreenState createState() => _StatefulScreenState();
}
class _StatefulScreenState extends State<StatefulScreen> {
  String title = 'Original title';
  @override
  Widget build(BuildContext context) {
    return Column(children: [
      Text(title),
      RaisedButton(
          child: Text('Click'),
          onPressed: () {
            setState(() {
              title = 'Changed title';
            });
          })
    ]);
  }
} 

我们创建了一个文本字段和一个按钮小组件。

一旦我们调用这个小组件并按下按钮，我们就让文本字段的值自动改变。

在这种类型的应用程序中，我们可以通过实现setState() 。setState() 是一个在有状态部件类中调用的方法。这个方法在每次被调用时都会改变有状态部件的值。

无状态和有状态之间的区别

为了回顾我们在上面的例子中所说明的内容，这个表格描述了无状态和有状态的部件之间的区别。

无状态小组件	有状态的小组件
只在初始化时更新	动态地改变
文本、图标和RaisedButtons	复选框、单选按钮和滑块
没有一个setState() 。它将被渲染一次，不会自我更新。	有一个内部的setState() ，如果输入数据发生变化，可以重新渲染。
静态小组件	动态小组件
在运行期间不能更新，除非有外部事件发生	可以在运行期间根据用户行动或数据变化进行更新

请注意，对于这两个小组件的创建，他们需要BuildContext ，作为返回小组件的一个参数。

总结

我们已经介绍了有状态和无状态部件之间的区别，以帮助您构建更好的Flutter应用程序。从这些例子中，我们了解了无状态和有状态widget的作用，以及如何知道你的用例需要哪个类。

最后

大家在正式学习了flutter之后就能够深入体会，flutter学习并不算难，难得是需要具有一个清晰、系统的思维，为了帮助大家更好的理解flutter，我给大家准备了一份《Flutter进阶学习笔记》，相信大家能在它的帮助下快速掌握flutter的知识。## 《Flutter进阶学习笔记》

目录

第一章 为什么 Flutter 是跨平台开发的终极之选

• 这是为什么？
• 跨平台开发
• 什么是Flutter
• Flutter特性
• Flutter 构建应用的工具
• 使用 Flutter 构建的热门应用
• 构建 Flutter 应用的成本

第二章 在Windows上搭建Flutter开发环境

• 使用镜像
• 系统要求
• 获取Flutter SDK
• 编辑器设置
• Android设置
• 起步: 配置编辑器
• 起步: 体验
• 体验热重载

第三章 编写您的第一个 Flutter App

• 创建 Flutter app
• 使用外部包(package)
• 添加一个 有状态的部件（Stateful widget）
• 创建一个无限滚动ListView
• 添加交互
• 导航到新页面
• 使用主题更改UI

第四章 Flutter开发环境搭建和调试

• 开发环境的搭建
• 模拟器的安装与调试
• 开发环境的搭建
• 模拟器的安装与调试

第五章 Dart语法篇之基础语法(一)

• 简述
• Hello Dart
• 数据类型
• 变量和常量
• 集合(List、Set、Map)
• 流程控制
• 运算符
• 异常
• 函数
• 总结

第六章 Dart语法篇之集合的使用与源码解析(二)

• List
• Set
• Map
• Queue
• LinkedList
• HashMap
• Map、HashMap、LinkedHashMap、SplayTreeMap区别
• 命名构造函数from和of的区别以及使用建议

第七章 Dart语法篇之集合操作符函数与源码分析(三)

• 简述
• Iterable
• forEach
• map
• any
• every
• where
• firstWhere和singleWhere和lastWhere
• join
• take
• takeWhile
• skip
• skipWhile
• follwedBy
• expand
• reduce
• elementAt

第八章 Dart语法篇之函数的使用(四)

• 简述
• 函数参数
• 匿名函数(闭包，lambda)
• 箭头函数
• 局部函数
• 顶层函数和静态函数
• main函数
• Function函数对象

第九章 Dart语法篇之面向对象基础(五)

• 简述
• 属性访问器(accessor)函数setter和getter
• 面向对象中的变量
• 构造函数
• 抽象方法、抽象类和接口
• 类函数
• 总结

第十章 Dart语法篇之面向对象继承和Mixins(六)

• 简述
• 类的单继承
• 基于Mixins的多继承
• 总结

第十一章 Dart语法篇之类型系统与泛型(七)

• 简述
• 可选类型
• 接口类型
• 泛型
• 类型具体化
• 总结

第十二章 Flutter中的widget

• Flutter页面-基础Widget
• Widget
• StatelessWidget
• State生命周期
• 基础widget
• DefaultTextStyle
• FlutterLogo
• Icon
• Iamge.asset
• CircleAvatar
• FadeInImage
• 按钮
• FlatButton
• OutlineButton
• TextFormField

有需要文中资料的可以扫码免费领取🎈🎈