Flutter语言 - 如何在屏幕上显示for循环结果

Question

这可能是非常基本的，但我不能弄清楚。我想在应用程序屏幕上显示我的for循环结果。尝试使用带有变量_result的Text小部件方法不会将结果显示在屏幕上。最初，在应用程序启动时，屏幕只显示0但是点击按钮后它不会改变。print命令在运行控制台中显示了正确的结果，但是这些结果没有显示在屏幕上。随着时间的推移，我尝试了很多我学到的东西，比如将int更改为String，但无济于事，它仍然不起作用。我在谷歌上搜索了很多次，但还是想不出来。我错过了什么?请帮助。

完整代码:

//import 'dart:html';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
// ignore: must_be_immutable
class MyApp extends StatelessWidget {
var sum = 25;
var _result = 0;
//static int _result = 0;
//String resultS;
//= _result.toString();
void callForLoop() {
print('The sum of ' '$sum' ' with 5 digits');
for (int z = 1; z <= 9; z++) {
for (int y = 1; y <= 9; y++) {
for (int x = 1; x <= 9; x++) {
for (int w = 1; w <= 9; w++) {
for (int v = 1; v <= 9; v++) {
if (z + y + x + w + v == sum) {
if (z < y) {
if (y < x) {
if (x < w) {
if (w < v) {
_result = (z + y + x + w + v);
print('$z + $y + $x + $w + $v');
//style: Theme.of(context).textTheme.headline4,
continue;
}
}
}
}
}
}
}
}
}
}
}
@override
Widget build(BuildContext context) {
//resultS = _result.toString();
return MaterialApp(
home: Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('$_result'),
//style: Theme.of(context).textTheme.headline4,
Container(
margin: const EdgeInsets.fromLTRB(20, 0, 20, 0),
child: RaisedButton(
onPressed: () => callForLoop(),
child: Text('Call For Loop'),
textColor: Colors.white,
color: Colors.lightBlue,
padding: EdgeInsets.fromLTRB(12, 12, 12, 12),
)),
]))));
}
}

Answer 1

将StatelessWidget转换为statfulwidget。如果使用Android Studio，突出显示类名，右键单击它，然后选择"转换为statefulwidget"。转换完成后，用setState()函数将为_result赋新值的代码行包装起来，如下所示:

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
// ignore: must_be_immutable
class MyApp extends StatelessWidget {
var sum = 25;
var _result = 0;
String _display = "";
//static int _result = 0;
//String resultS;
//= _result.toString();
void callForLoop() {
print('The sum of ' '$sum' ' with 5 digits');
for (int z = 1; z <= 9; z++) {
for (int y = 1; y <= 9; y++) {
for (int x = 1; x <= 9; x++) {
for (int w = 1; w <= 9; w++) {
for (int v = 1; v <= 9; v++) {
if (z + y + x + w + v == sum) {
if (z < y) {
if (y < x) {
if (x < w) {
if (w < v) {
_display = '$z + $y + $x + $w + $v';
//style: Theme.of(context).textTheme.headline4,
continue;
}
}
}
}
}
}
}
}
}
}
}
@override
Widget build(BuildContext context) {
//resultS = _result.toString();
return MaterialApp(
home: Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(_display),
//style: Theme.of(context).textTheme.headline4,
Container(
margin: const EdgeInsets.fromLTRB(20, 0, 20, 0),
child: RaisedButton(
onPressed: () => callForLoop(),
child: Text('Call For Loop'),
textColor: Colors.white,
color: Colors.lightBlue,
padding: EdgeInsets.fromLTRB(12, 12, 12, 12),
)),
]))));
}
}

setState()函数调用build()方法并重新绘制屏幕上的小部件。因此，当您在setState()方法中给_result赋一个新值时，它应该用新值更新Text小部件。