更新Flutter中的文本小工具

Question

我是Flutter的新手，我面临一个问题，因为我想用从numbers()函数中传递的值更新Text widget。

问题是当我按下按钮时，Text内的值在屏幕上没有改变，但在控制台中却改变了。

class _HomeState extends State<Home> {


int n = 10;

  @override
  Widget build(BuildContext context) {
    return Scaffold(

  backgroundColor: Colors.deepPurpleAccent,
  body: Center(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [

        Text(n.toString()),

        RaisedButton(
          onPressed: (){
            n += numbers();
            print(n.toString());
          },
        ),
      ],
    ),
  ),
);
  }
}
int numbers (){

  List<int> numbersList = List(1);

  numbersList[0] = 30;

  int n1 = numbersList[0];

  return n1;

  print(numbersList[0].toString());
}

Answer 1

如果你想更新用户界面，那么你应该调用 setState((){}); flutter中的方法。StatefulWidget

您应该实施以下方式

class _HomeState extends State<Home> {
  int n = 10;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.deepPurpleAccent,
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(n.toString()),
            RaisedButton(
              onPressed: () {
                setState(() {
                  n += numbers();
                });
              },
            ),
          ],
        ),
      ),
    );
  }
}

int numbers() {
  List<int> numbersList = List(1);

  numbersList[0] = 30;

  int n1 = numbersList[0];

  return n1;
}

Answer 2

这是预料之中的，因为在flutter中，每当你想 "刷新 "屏幕时，你必须调用 setState() 为您要更新的小组件。所以，你要做的是，在你的onPressed函数中，你要做以下事情。

setState(){
   n += numbers();
}
print(n.toString());

你可以阅读更多关于有状态的widget和setState的信息。此处

Answer 3

这样你就可以改变它

RaisedButton(
  onPressed: (){
     final newVal = numbers();
     setState((){
              n += newVal;
             });
   print(n.toString());
       },
     ),