本头条核心宗旨

欢迎来到「技术刚刚好」作者，「技术刚刚好」是个人维护，每天至少更新一篇Flutter技术文章，实时为大家播报Flutter最新消息。如果你刚好也在关注Flutter这门技术，那就跟我一起学习进步吧，你的赞，收藏，转发是对我个人最大的支持，维护不易，欢迎关注。

技术刚刚好经历

近几年，移动端跨平台开发技术层出不穷，从Facebook家的ReactNative，到阿里家WEEX，前端技术在移动端跨平台开发中大展身手，技术刚刚好作为一名Android开发，经历了从Reactjs到Vuejs的不断学习。而在2018年，我们的主角变成了Flutter，这是Goolge开源的一个移动端跨平台解决方案，可以快速开发精美的移动App。希望跟大家一起学习，一起进步！

本文核心要点

有状态窗口小部件定义为在其生命周期内更改其状态的任何窗口小部件

StatefulWidget：

有状态窗口小部件是一个窗口小部件，它通过构建一个更具体地描述用户界面的其他窗口小部件来描述用户界面的一部分 . 构建过程以递归方式继续，直到用户界面的描述完全具体（例如，完全由RenderObjectWidgets组成，其描述具体的RenderObjects） .

当您描述的用户界面的一部分可以动态改变时，有状态小部件很有用，例如，由于具有内部时钟驱动状态，或取决于某些系统状态 . 对于仅依赖于对象本身中的配置信息以及窗口小部件膨胀的BuildContext的组合，请考虑使用StatelessWidget .

StatefulWidget实例本身是不可变的，并将其可变状态存储在由createState方法创建的单独State对象中，或者存储在该State所订阅的对象中，例如Stream或ChangeNotifier对象，其引用存储在StatefulWidget的最终字段中本身 .

有状态

main.dart文件

<code>import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    home: MyButton(),
  ));
}

class MyButton extends StatefulWidget {
  @override
  MyButtonState createState() {
    return MyButtonState();
  }
}

class MyButtonState extends State<mybutton> {
  int counter = 0;
  List<string> strings = ['Flutter', 'is', 'cool', "and","awesome!"];
  String displayedString = "Hello World!";

  void onPressOfButton() {
    setState(() {
      displayedString = strings[counter];
      counter = counter < 4 ? counter + 1 : 0;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Stateful Widget"),
        backgroundColor: Colors.green,
      ),
      body: Container(
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <widget>[
              Text(displayedString, style: TextStyle(fontSize: 40.0)), 

              Padding(padding: EdgeInsets.all(10.0)),
              RaisedButton(
                child: Text(
                  "Press me",
                  style: TextStyle(color: Colors.white),
                ),
                color: Colors.red,
                onPressed: onPressOfButton,
              )
            ],
          ),
        ),
      ),
    );
  }
}/<widget>/<string>/<mybutton>/<code>