Flutter-Dart简易随机数生成器UI不更新问题求助

你的代码有两个核心问题导致UI不更新：

• 你把randomNumber定义成了全局变量，Flutter的StatefulWidget只会监听State类内部的状态变量变化，全局变量的改动不会触发UI重建。
• 在randomNumberFunction的setState里，你重新声明了一个局部的randomNumber，修改的只是这个局部变量，完全没碰外面的全局变量，所以界面上显示的数值根本没变。

修正后的代码如下：

import 'dart:math';
import 'package:flutter/material.dart';

class RandomNum extends StatefulWidget {
  const RandomNum({super.key});

  @override
  State<RandomNum> createState() => _RandomNumState();
}

class _RandomNumState extends State<RandomNum> {
  // 把状态变量移到State类内部
  final Random random = Random();
  int randomNumber = 0;

  @override
  void initState() {
    super.initState();
    // 初始化生成第一个随机数
    randomNumber = random.nextInt(10);
  }

  void randomNumberFunction() {
    setState(() {
      // 直接修改State类的成员变量，不再声明局部变量
      randomNumber = random.nextInt(10);
      print(randomNumber);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Column(
        children: [
          Text(randomNumber.toString()),
          ElevatedButton(onPressed: randomNumberFunction, child: const Text('Guess'))
        ],
      ),
    );
  }
}

关键修改点：

1. 将random和randomNumber移到_RandomNumState类内部，作为状态成员变量。
2. 通过initState初始化初始的随机数，保证页面加载时就有数值显示。
3. 在setState里直接修改成员变量randomNumber，这样setState会标记状态改变，触发UI重建，更新Text组件的内容。

内容的提问来源于stack exchange，提问作者codebin