繁体   English   中英

我想在 flutter 中将数据从第二屏传递到第一屏

[英]I want to pass data from 2nd Screen to 1st Screen in flutter

我正在制作一个简单的 TODO 应用程序,我想将数据从我的应用程序的第二个屏幕传递到第一个屏幕。 我的第一个屏幕最初是空白的,没有任何内容可显示,它有一个浮动按钮来添加任务。 当它被点击时,它会进入第二页,用户输入任务和作者并点击“提交”按钮,然后将我们带到显示它的第一页。 我想将数据作为 List 传递。我在过去 24 小时内尝试使用 ModalRoute 实现的所有内容,还创建了一个 ToDo class 实例,这样它就不会给出 NULL 错误,但没有任何结果。 我附上代码,以便您了解我的问题。

这是我的 FirstScreen()

import 'package:flutter/material.dart';
import 'todo.dart';
import 'todocard.dart';

class ToDos extends StatefulWidget{
 @override
 _ToDosState createState() => _ToDosState();
}

class _ToDosState extends State<ToDos> {

@override
Widget build(BuildContext context) {

List<ToDo> todos =[

];
final routeArgs = ModalRoute.of(context).settings.arguments as Map ;
todos.add(ToDo(author: routeArgs['task'],task: routeArgs['author']));

 return Container(
  child: Scaffold(
    appBar: AppBar(
      title: Text("TODO LIST"),
      centerTitle: true,
    ),
    body: Column(
      children:todos.map((e) => ToDoCard(
          todo: e,
      )).toList(),
      //ToDoCard is just a Card widget

    ),
    floatingActionButton: FloatingActionButton(
      elevation: 0.0,
      child: Text("+"),
      onPressed: ()
      {
        Navigator.pushNamed(context, '/add_task');
      },
    ),
  ),

);

} }

我的 SecondScreen 是:

import 'package:flutter/material.dart';

class AddTask extends StatefulWidget {
  @override
  _AddTaskState createState() => _AddTaskState();
}

class _AddTaskState extends State<AddTask> {
  @override
  Widget build(BuildContext context) {
    String author,task;
    return Container(
        child: Scaffold(
          appBar: AppBar(
            title: Text("ADD TASK"),
            centerTitle: true,
          ),
          body: Column(
            children: <Widget>[
              Text("Enter Your Task"),
              TextField(
                decoration: InputDecoration(
                    border: InputBorder.none,
                    hintText: 'task'
                ),
                onChanged: (text){
                  task = text;
                },
              ),

              TextField(
                decoration: InputDecoration(
                    border: InputBorder.none,
                    hintText: 'author'
                ),
                onChanged: (text){
                  author = text;
                },
              ),

              Row(
                children: <Widget>[
                  RaisedButton(
                    onPressed: () {
                      Navigator.pop(context, {
                        'author': author,
                        'task': task,
                      });
                    },
                    child: Text("Submit"),
                  ),
                  SizedBox(width: 10.0,),
                  RaisedButton(
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    child: Text("Cancel"),
                  ),
                ],
              )

            ],
          ),
        ));
  }
}

主要的.dart如下:

import 'package:flutter/material.dart';
import 'todo.dart';
import 'add_task.dart';
import 'display_todo.dart';

void main() {
  runApp(MaterialApp(
    title: 'Passing Data',
    initialRoute: '/',
    routes: {
      '/': (context) => ToDos(),
      '/add_task': (context) => AddTask(),
    },
  ));
}

将信息显示为卡片的 ToDoCard:

import 'todo.dart';
import 'package:flutter/material.dart';

class ToDoCard extends StatelessWidget {
  final ToDo todo;
  ToDoCard({this.todo});
  @override
  Widget build(BuildContext context) {
    return Card(
      color: Colors.cyan,
      margin: EdgeInsets.fromLTRB(20, 20, 20, 0),
      child: Padding(
        padding: EdgeInsets.fromLTRB(13, 10, 13, 10),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[

            Text(
              todo.author,
              style: TextStyle(
                color: Colors.black,
                fontSize: 20.0,
              ),
            ),
            SizedBox(height: 10.0,),
            Text(
              todo.task,
              style: TextStyle(
                color: Colors.black,
                fontSize: 20.0,
              ),
            ),
            SizedBox(height: 10.0,),
//            RaisedButton.icon(onPressed: delete, icon: Icon(Icons.delete), label: 
Text("Delete quote"), color: Colors.red,),

          ],
        ),
      ),
    );
  }
}

待办事项 class:

class ToDo{
final String task;
final String author;
ToDo({this.task,this.author});
}

您可以将结果传回Navigator.pop()并通过await调用pushNamed来检索它。

检索第 1 页中的值:

onPressed: () async
{
  dynamic result = await Navigator.pushNamed(context, '/add_task');
  if(result != null) {
    setState(() {todos.add(result);});
  }
},

在提交按钮中从第 2 页传递值

onPressed: () {
  Navigator.pop(context, ToDo(task: task, author: author));
},

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM