Flutter 如何从外部控制有状态窗口小部件本身

setState不应该从小部件本身的外部访问，它是隐藏的state类的一部分.

你可以采取类似于TextField的方法，并有一个控制器，允许你监听和修改你的计时器的内部状态.

class StopWatchController extends ValueNotifier<int> {
  StopWatchController() : super(0);

  /// The underlying [Timer].
  Timer? _timer;

  /// Flag to check a timer is running.
  bool get running => _timer != null;

  void start() {
    value = 0;
    _timer = Timer.periodic(
      const Duration(milliseconds: 1),
      (_) => value = value + 1,
    );
  }

  void stop() {
    value = 0;
    _timer?.cancel();
    _timer = null;
  }

  @override
  void dispose() {
    _timer?.cancel();
    super.dispose();
  }
}

然后，任何小部件都可以对该控制器发出的更改进行listen:

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

  @override
  State<App> createState() => _AppState();
}

class _AppState extends State<App> {
  final StopWatchController _controller = StopWatchController();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Stopwath Demo',
      home: Scaffold(
        body: StopWatch(controller: _controller),
        floatingActionButton: FloatingActionButton.small(
          child: ListenableBuilder(
            listenable: _controller,
            builder: (ctx, _) => Icon(_controller.running ? Icons.stop : Icons.play_arrow),
          ),
          onPressed: () {
            if (_controller.running) {
              _controller.stop();
            } else {
              _controller.start();
            }
          },
        ),
      ),
    );
  }
}

class StopWatch extends StatelessWidget {
  const StopWatch({super.key, required this.controller});

  final StopWatchController controller;

  @override
  Widget build(BuildContext context) {
    return ListenableBuilder(
      listenable: controller,
      builder: (ctx, _) {
        return Center(
          child: Text(controller.value.toString()),
        );
      },
    );
  }
}