title: How to pass data arguments to a named route in flutter?
body: <p>Hi I'm a newbie in flutter, I have a screen that I'm using <code>Navigator.push</code>. i'd like to route from my Button Page to the chat message page.</p>
  <p>Please see code below:</p>
  <p>Issue: My problem is that I need to pass arguments in the <code>IndividualPage()</code> for navigation</p>
  <pre><code>class ButtonScreen extends StatelessWidget {
     @override
     Widget build(BuildContext context) {
       return Scaffold(
         appBar: AppBar(backgroundColor: Colors.red, title: const Text(&quot;Chat Request&quot;)),
         body: Center(
           child: ElevatedButton(
             onPressed: () {
               Navigator.push(
                   context,
                   MaterialPageRoute(
                     builder: (context) =&gt;  IndividualPage(),),);
             },
             child: const Text(
               'Request Chat',
             ),
           ),
         ),
       );
     }
   }
  </code></pre>
  <p>Please also see my  <code>IndividualPage Widget</code></p>
  <pre><code>import 'package:chats_s/ownMessageCard.dart';
  import 'package:chats_s/replyCard.dart';
  import 'package:chats_s/Model/chat_model.dart';
  import 'package:chats_s/Model/message_model.dart';
  import 'package:emoji_picker/emoji_picker.dart';
  import 'package:flutter/material.dart';
  import 'package:flutter_svg/svg.dart';
  import 'package:socket_io_client/socket_io_client.dart' as IO;
  
  class IndividualPage extends StatefulWidget {
    const IndividualPage({ Key? key, required this.chatModel, required this.sourchat})
        : super(key: key);
    final ChatModel chatModel;
    final ChatModel sourchat;
  
    @override
    _IndividualPageState createState() =&gt; _IndividualPageState();
  }
  
  class _IndividualPageState extends State&lt;IndividualPage&gt; {
    bool show = false;
    FocusNode focusNode = FocusNode();
    bool sendButton = false;
    List&lt;MessageModel&gt; messages = [];
    TextEditingController _controller = TextEditingController();
    ScrollController _scrollController = ScrollController();
    late IO.Socket socket;
    @override
    void initState() {
      super.initState();
      // connect();
  
      focusNode.addListener(() {
        if (focusNode.hasFocus) {
          setState(() {
            show = false;
          });
        }
      });
      connect();
    }
  
    void connect() {
      // MessageModel messageModel = MessageModel(sourceId: widget.sourceChat.id.toString(),targetId: );
      socket = IO.io(&quot;http://10.0.2.2:5000&quot;, &lt;String, dynamic&gt;{
        &quot;transports&quot;: [&quot;websocket&quot;],
        &quot;autoConnect&quot;: false,
      });
      socket.connect();
      socket.emit(&quot;signin&quot;, widget.sourchat.id);
      socket.onConnect((data) {
        print(&quot;Connected&quot;);
        socket.on(&quot;message&quot;, (msg) {
          print(msg);
          setMessage(&quot;destination&quot;, msg[&quot;message&quot;]);
          _scrollController.animateTo(_scrollController.position.maxScrollExtent,
              duration: Duration(milliseconds: 300), curve: Curves.easeOut);
        });
      });
      print(socket.connected);
    }
  
    void sendMessage(String message, int sourceId, int targetId) {
      setMessage(&quot;source&quot;, message);
      socket.emit(&quot;message&quot;,
          {&quot;message&quot;: message, &quot;sourceId&quot;: sourceId, &quot;targetId&quot;: targetId});
    }
  
    void setMessage(String type, String message) {
      MessageModel messageModel = MessageModel(
          type: type,
          message: message,
          time: DateTime.now().toString().substring(10, 16));
      print(messages);
  
      setState(() {
        messages.add(messageModel);
      });
    }
  
    @override
    Widget build(BuildContext context) {
      return Stack(
        children: [
          Image.asset(
            &quot;assets/whatsapp_Back.png&quot;,
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
            fit: BoxFit.cover,
          ),
          Scaffold(
            backgroundColor: Colors.transparent,
            appBar: PreferredSize(
              preferredSize: Size.fromHeight(60),
              child: AppBar(
                leadingWidth: 70,
                titleSpacing: 0,
                leading: InkWell(
                  onTap: () {
                    Navigator.pop(context);
                  },
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Icon(
                        Icons.arrow_back,
                        size: 24,
                      ),
                      CircleAvatar(
                        child: SvgPicture.asset(
                          widget.chatModel.isGroup
                              ? &quot;assets/groups.svg&quot;
                              : &quot;assets/person.svg&quot;,
                          color: Colors.white,
                          height: 36,
                          width: 36,
                        ),
                        radius: 20,
                        backgroundColor: Colors.blueGrey,
                      ),
                    ],
                  ),
                ),
                title: InkWell(
                  onTap: () {},
                  child: Container(
                    margin: EdgeInsets.all(6),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          widget.chatModel.name,
                          style: TextStyle(
                            fontSize: 18.5,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        Text(
                          &quot;last seen today at 12:05&quot;,
                          style: TextStyle(
                            fontSize: 13,
                          ),
                        )
                      ],
                    ),
                  ),
                ),
                actions: [
                  IconButton(icon: Icon(Icons.videocam), onPressed: () {}),
                  IconButton(icon: Icon(Icons.call), onPressed: () {}),
                  PopupMenuButton&lt;String&gt;(
                    padding: EdgeInsets.all(0),
                    onSelected: (value) {
                      print(value);
                    },
                    itemBuilder: (BuildContext contesxt) {
                      return [
                        PopupMenuItem(
                          child: Text(&quot;View Contact&quot;),
                          value: &quot;View Contact&quot;,
                        ),
                        PopupMenuItem(
                          child: Text(&quot;Media, links, and docs&quot;),
                          value: &quot;Media, links, and docs&quot;,
                        ),
                        PopupMenuItem(
                          child: Text(&quot;Whatsapp Web&quot;),
                          value: &quot;Whatsapp Web&quot;,
                        ),
                        PopupMenuItem(
                          child: Text(&quot;Search&quot;),
                          value: &quot;Search&quot;,
                        ),
                        PopupMenuItem(
                          child: Text(&quot;Mute Notification&quot;),
                          value: &quot;Mute Notification&quot;,
                        ),
                        PopupMenuItem(
                          child: Text(&quot;Wallpaper&quot;),
                          value: &quot;Wallpaper&quot;,
                        ),
                      ];
                    },
                  ),
                ],
              ),
            ),
            body: Container(
              height: MediaQuery.of(context).size.height,
              width: MediaQuery.of(context).size.width,
              child: WillPopScope(
                child: Column(
                  children: [
                    Expanded(
                      // height: MediaQuery.of(context).size.height - 150,
                      child: ListView.builder(
                        shrinkWrap: true,
                        controller: _scrollController,
                        itemCount: messages.length + 1,
                        itemBuilder: (context, index) {
                          if (index == messages.length) {
                            return Container(
                              height: 70,
                            );
                          }
                          if (messages[index].type == &quot;source&quot;) {
                            return OwnMessageCard(
                              message: messages[index].message,
                              time: messages[index].time,
                            );
                          } else {
                            return ReplyCard(
                              message: messages[index].message,
                              time: messages[index].time,
                            );
                          }
                        },
                      ),
                    ),
                    Align(
                      alignment: Alignment.bottomCenter,
                      child: Container(
                        height: 70,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.end,
                          children: [
                            Row(
                              children: [
                                Container(
                                  width: MediaQuery.of(context).size.width - 60,
                                  child: Card(
                                    margin: EdgeInsets.only(
                                        left: 2, right: 2, bottom: 8),
                                    shape: RoundedRectangleBorder(
                                      borderRadius: BorderRadius.circular(25),
                                    ),
                                    child: TextFormField(
                                      controller: _controller,
                                      focusNode: focusNode,
                                      textAlignVertical: TextAlignVertical.center,
                                      keyboardType: TextInputType.multiline,
                                      maxLines: 5,
                                      minLines: 1,
                                      onChanged: (value) {
                                        if (value.length &gt; 0) {
                                          setState(() {
                                            sendButton = true;
                                          });
                                        } else {
                                          setState(() {
                                            sendButton = false;
                                          });
                                        }
                                      },
                                      decoration: InputDecoration(
                                        border: InputBorder.none,
                                        hintText: &quot;Type a message&quot;,
                                        hintStyle: TextStyle(color: Colors.grey),
                                        prefixIcon: IconButton(
                                          icon: Icon(
                                            show
                                                ? Icons.keyboard
                                                : Icons.emoji_emotions_outlined,
                                          ),
                                          onPressed: () {
                                            if (!show) {
                                              focusNode.unfocus();
                                              focusNode.canRequestFocus = false;
                                            }
                                            setState(() {
                                              show = !show;
                                            });
                                          },
                                        ),
                                        suffixIcon: Row(
                                          mainAxisSize: MainAxisSize.min,
                                          children: [
                                            IconButton(
                                              icon: Icon(Icons.attach_file),
                                              onPressed: () {
                                                showModalBottomSheet(
                                                    backgroundColor:
                                                        Colors.transparent,
                                                    context: context,
                                                    builder: (builder) =&gt;
                                                        bottomSheet());
                                              },
                                            ),
                                            IconButton(
                                              icon: Icon(Icons.camera_alt),
                                              onPressed: () {
                                                // Navigator.push(
                                                //     context,
                                                //     MaterialPageRoute(
                                                //         builder: (builder) =&gt;
                                                //             CameraApp()));
                                              },
                                            ),
                                          ],
                                        ),
                                        contentPadding: EdgeInsets.all(5),
                                      ),
                                    ),
                                  ),
                                ),
                                Padding(
                                  padding: const EdgeInsets.only(
                                    bottom: 8,
                                    right: 2,
                                    left: 2,
                                  ),
                                  child: CircleAvatar(
                                    radius: 25,
                                    backgroundColor: Color(0xFF128C7E),
                                    child: IconButton(
                                      icon: Icon(
                                        sendButton ? Icons.send : Icons.mic,
                                        color: Colors.white,
                                      ),
                                      onPressed: () {
                                        if (sendButton) {
                                          _scrollController.animateTo(
                                              _scrollController
                                                  .position.maxScrollExtent,
                                              duration:
                                                  Duration(milliseconds: 300),
                                              curve: Curves.easeOut);
                                          sendMessage(
                                              _controller.text,
                                              widget.sourchat.id,
                                              widget.chatModel.id);
                                          _controller.clear();
                                          setState(() {
                                            sendButton = false;
                                          });
                                        }
                                      },
                                    ),
                                  ),
                                ),
                              ],
                            ),
                            show ? emojiSelect() : Container(),
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
                onWillPop: () {
                  if (show) {
                    setState(() {
                      show = false;
                    });
                  } else {
                    Navigator.pop(context);
                  }
                  return Future.value(false);
                },
              ),
            ),
          ),
        ],
      );
    }
  
    Widget bottomSheet() {
      return Container(
        height: 278,
        width: MediaQuery.of(context).size.width,
        child: Card(
          margin: const EdgeInsets.all(18.0),
          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 20),
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    iconCreation(
                        Icons.insert_drive_file, Colors.indigo, &quot;Document&quot;),
                    SizedBox(
                      width: 40,
                    ),
                    iconCreation(Icons.camera_alt, Colors.pink, &quot;Camera&quot;),
                    SizedBox(
                      width: 40,
                    ),
                    iconCreation(Icons.insert_photo, Colors.purple, &quot;Gallery&quot;),
                  ],
                ),
                SizedBox(
                  height: 30,
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    iconCreation(Icons.headset, Colors.orange, &quot;Audio&quot;),
                    SizedBox(
                      width: 40,
                    ),
                    iconCreation(Icons.location_pin, Colors.teal, &quot;Location&quot;),
                    SizedBox(
                      width: 40,
                    ),
                    iconCreation(Icons.person, Colors.blue, &quot;Contact&quot;),
                  ],
                ),
              ],
            ),
          ),
        ),
      );
    }
  
    Widget iconCreation(IconData icons, Color color, String text) {
      return InkWell(
        onTap: () {},
        child: Column(
          children: [
            CircleAvatar(
              radius: 30,
              backgroundColor: color,
              child: Icon(
                icons,
                // semanticLabel: &quot;Help&quot;,
                size: 29,
                color: Colors.white,
              ),
            ),
            SizedBox(
              height: 5,
            ),
            Text(
              text,
              style: TextStyle(
                fontSize: 12,
                // fontWeight: FontWeight.w100,
              ),
            )
          ],
        ),
      );
    }
  
    Widget emojiSelect() {
      return EmojiPicker(
          rows: 4,
          columns: 7,
          onEmojiSelected: (emoji, category) {
            print(emoji);
            setState(() {
              _controller.text = _controller.text + emoji.emoji;
            });
          });
    }
  }
  
  </code></pre>
  <p>I tried to remove the <code>required</code> but it gives me and error.</p>
  <p>Here is my chatModel:</p>
  <pre><code>  String name;
    String icon;
    bool isGroup;
    String time;
    String currentMessage;
    String status;
    bool select = false;
    int id;
    ChatModel({
      required this.name,
      required this.icon,
      required this.isGroup,
      required this.time,
      required this.currentMessage,
      required this.status,
      this.select = false,
      required this.id,
    });
  }
  </code></pre>