android - 在 Flutter 中更新 MaterialPageRoute 的状态

Question

我有一个显示用户列表的小部件。单击列表元素时，将创建一个新的 MaterialPageRoute 并将其推送到导航器以打开显示消息历史记录的该用户的聊天屏幕。

class Users extends StatefulWidget {
  final User user;

  Users({this.user});

  @override
  UsersState createState() => new UsersState();
}

class UsersState extends State<Users> {
  Map<String, Conversation> _conversations = new Map<String, Conversation>();

  void _sendMessage(String message, String username) {
    setState(() {
      _conversations[username].messages.add(
        new Message(text: message, isFromUser: true)
      );
    });
  }

  void _openChat(String username) {
    Navigator.of(context).push(
      new MaterialPageRoute(
        builder: (context) {
          return new Chat(
            user: widget.user,
            conversation: _conversations[username],
            sendMessage: _sendMessage,
          );
        }
      )
    );
  }

  @override
  Widget build(BuildContext context) {
    return new Column(
      children: _onlineUsers.map((username) {
        return new ListTile(
          leading: new CircleAvatar(
              child: new Text(username[0].toUpperCase())
          ),
          title: new Text(username),
          onTap: () => _openChat(username),
        );
      }).toList()
    );
  }
}

在聊天小部件中，按下发送按钮时，将调用 UsersState._sendMessage，它通过更新当前对话来更改状态。然后运行 ​​UsersState 类的构建方法，但是聊天小部件没有更新添加的消息(我猜，因为没有再次调用 onTap 函数)。

我试图将创建页面路由作为构建方法的直接函数，但这也不起作用。当在创建它的类中设置状态时，如何自动更新新屏幕的状态？

Answer 1

您想做的与您拥有的有点不同；据我所知，您拥有的是一个小部件，它可以保存对话，然后在每次对话发生变化时创建一条新路线。

我建议研究使用数据库来存储消息；在某些时候，您无论如何都需要这样做。如果您只是存储在设备上，sqflite是一个很好的解决方案，而如果您希望使用 FireStore 将其保存到服务器可能是最简单的。

您可以让主小部件列出用户，但每个聊天小部件本身应该是有状态小部件，每次添加新消息时状态都会更改。您注册更改的方式取决于您使用的插件。

如果您真的只想在内存中为半健壮的应用程序执行此操作，我建议您查看 StreamBuilder并使用流将每条消息发送到各个聊天室，或编写您自己的简单发布/订阅系统(即在创建小部件时注册收听，在处理小部件时注销)。您必须传递管理注册的对象 - 我建议不要使用导航器的推送，而是使用 pushNamed 并从 Navigator/MaterialApp/WidgetApp 管理内容。

虽然只是一个简单的例子(正如你在评论中所说的那样)，你可以使用 InheritedWidget向下传播变化。您只需确保 InheritedWidget 位于您的两个页面的小部件树中；如果您手动使用 Navigator，则只需确保 Navigator 是 InheritedWidget 的子项，而如果您使用的是 MaterialApp 或 WidgetsApp，则可以使用 builder 参数来指定一个函数，它在 MaterialApp/WidgetsApp 下方但在导航器上方构建继承的小部件。

stock app example不完全是你在做什么，但它是一个应用程序的例子，它有一个列表页面和单独的页面。