flutter - 如何在 Flutter 中将 setState 发送到第二页？

Question

我有一个关于发送 setState 的基本问题 到与此方法相同的类中的第二页，如

_GoToNextPage(){
    Navigator.of(context).push(MaterialPageRoute(builder: (context) {...})
}

问题是当我在第二页中更改背景颜色时它没有 change color in the same page 但它改变了 prime 主页的颜色。

这是完整的代码...

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(
      home: SetStateToSecondPage(),
    ));

class SetStateToSecondPage extends StatefulWidget {
  @override
  _SetStateToSecondPageState createState() => _SetStateToSecondPageState();
}

class _SetStateToSecondPageState extends State<SetStateToSecondPage> {
  Color color = Colors.deepPurpleAccent;
  bool Switch = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: color,
      appBar: AppBar(
        title: Text('setState to Second Page ?'),
        elevation: 0.0,
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: <Widget>[
            RaisedButton(
              onPressed: () {
                setState(() {
                  Switch = !Switch;

                  color = Switch ? Colors.white : Colors.green;
                });
              },
              child: Text('Change Back GroundColor'),
            ),
            RaisedButton(
              onPressed: () {
                _GoToNextPage(context);
              },
              child: Text('To Next Page..'),
            ),
          ],
        ),
      ),
    );
  }

//------------- This is second Page ----------//

  _GoToNextPage(BuildContext context) {
    return Navigator.of(context).push(MaterialPageRoute(builder: (context) {
      return Scaffold(
        appBar: AppBar(
          title: Text('Second Page'),
        ),
        backgroundColor: color,
        body: Center(
          child: RaisedButton(
            onPressed: () {
              setState(() {
                color = Colors.red;
              });
            },
            child: Text('Change Back GroundColor'),
          ),
        ),
      );
    }));
  }
}

谢谢

Answer 1

SetState 特定于您所在的对象。当您调用它时，您会通知框架状态已更改。所以在 _SetStateToSecondPageState 中调用 setState 不会影响 Second Page 所以你需要创建另一个 StatefulWidget

class SecondPage extends StatefulWidget {
  MaterialColor secondColor ;
  SecondPage({this.secondColor});
  @override
  _SecondPageState createState() => new _SecondPageState();
}

class _SecondPageState extends State<SecondPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Second Page'),
      ),
      backgroundColor: widget.secondColor,
      body: Center(
        child: RaisedButton(
          onPressed: () {
            setState(() {
              widget.secondColor = Colors.amber;
            });
          },
          child: Text('Change Back GroundColor'),
        ),
      ),
    );
  }
}

并且当您调用 _GoToNextPage 时，使用 SecondPage 构造函数来更改颜色

  _GoToNextPage(BuildContext context) {
    return Navigator.of(context).push(MaterialPageRoute(builder: (context) {
      return SecondPage(
      );
    }));
  }