Flutter-在PageView中传递数据

问题描述

我正在尝试在网页浏览的一个“页面”上键入一条消息，并希望将该消息显示在另一“页面”上。我了解如何使用两个单独的Scaffold小部件来完成此操作，但是我却难以将方法环绕在具有嵌套Stack / Pageview的单个支架中。

在这里设置浏览量：

class FrontOfCard extends StatefulWidget {

  String documentid;
  FirebaseImage image;

  FrontOfCard({this.documentid,this.image});

  @override
  _FrontOfCardState createState() => _FrontOfCardState();
}

class _FrontOfCardState extends State<FrontOfCard> {
  PageController _pageController = PageController(
    initialPage: 0
  );

  int currentPage = 0;

  @override
  void dispose() {
    super.dispose();
    _pageController.dispose();
  }

  _onPageChanged(int index) {
    setState(() {
      currentPage = index;
    });
  }

  //Creating the message here
  String _message;

  Widget build(BuildContext context) {
    return Scaffold(
      resizetoAvoidBottomInset: false,appBar: PreferredSize(
        preferredSize: const Size.fromHeight(80),child: MainAppBar(
          text: 'front',),body: Stack(
        alignment: AlignmentDirectional.bottomCenter,children: <Widget> [ PageView(
          scrollDirection: Axis.horizontal,controller: _pageController,onPageChanged: _onPageChanged,children: [
            Container(
              child: Padding(
                padding: const EdgeInsets.all(8.0),child: Image(image: widget.image),InsideLeft(),InsideRight(message: _message),// This is where the message variable will be populated with a String
    
            EndView(message: _message),// This is where I need the message to be displayed
          ],Stack(
            children: <Widget> [
              Container(
                margin: const EdgeInsets.only(bottom: 35),child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,children: <Widget> [
                    for (int i = 0; i<=3; i++)
                      if (i == currentPage)
                        SlideDots(true) else SlideDots(false)
                  ],],]),);
  }
}

这是我的InsideRight（），我希望用户在其中键入消息：

class InsideRight extends StatefulWidget {
  const InsideRight({
    @required this.message,Key key
  }) : super(key: key);


  final String message;

  @override
  _InsideRightState createState() => _InsideRightState(message: this.message);
}

class _InsideRightState extends State<InsideRight> {

  String message;

  _InsideRightState({
    @required this.message,});
  
  final myController = TextEditingController(
  );


  @override
  void dispose() {
    // Clean up the controller when the widget is disposed.
    myController.dispose();
    super.dispose();
  }


  FontWeight fontWeight = FontWeight.w400;
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Padding(
        padding: const EdgeInsets.all(8.0),child: Column(
          children: [
            Container(
                decoration: Boxdecoration(
                  border: Border.all(color: Colors.black26),width: MediaQuery.of(context).size.width * 0.8,height: MediaQuery.of(context).size.height * 0.7,child: Padding(
                  padding: const EdgeInsets.all(8.0),child: TextField(
                    decoration: new Inputdecoration.collapsed(
                        hintStyle: TextStyle(fontFamily: FontNameDefault),hintText: ''),keyboardType: TextInputType.multiline,maxLines: null,controller: myController,onChanged:  (String _) {
                      setState(() {
                        message = _;
                      });
                    },)),);
  }
}

我需要显示消息的EndView：

    class EndView extends StatefulWidget {
  const EndView({
    @required this.message,Key key
  }) : super(key: key);

  final String message;


  @override
  _EndViewState createState() => _EndViewState(message: this.message);
}



class _EndViewState extends State<EndView> {

  String message;

  _EndViewState({
    @required this.message,});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(message ?? 'Empty'),);
  }
}

有什么建议吗？谢谢

解决方法

提供程序包对于使用屏幕和小部件之间传输的数据非常有用。

包裹：https://pub.dev/packages/provider
例如，我使用此程序包在屏幕之间传输身份验证和存储数据，而无需为下一个屏幕和下一个屏幕传递相同的参数。
我强烈建议您阅读文档，但如果您确实不满意，我可以向您推荐一些可能会有所帮助的YouTube视频：https://www.youtube.com/watch?v=vFxk_KJCqgk&ab_channel=Fireship