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

Question

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

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

问题是当我在第二页中更改背景颜色时它没有在同一个页面中改变颜色但是它改变了 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 不会影响第二页，因此您需要创建另一个 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(
      );
    }));
  }

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

How to send setState to Second Page in Flutter?

flutter

flutter-test

flutter-layout