Flutter：如何在 Onpressed 时从不同的 dart 文件中调用独立的小部件

Question

我有一个按钮表，当单击按钮时出现，当所有内容都在一个 dart 文件上时它工作正常，但是因为我必须在不同的屏幕上使用一些小部件，所以我决定将小部件拆分为不同的 dart 文件，现在我已经做到了，但是当单击按钮时，其他小部件没有发生同样的事情，所以我想这与我如何设置它有关

波纹管是底片代码

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

import '../widgets/calendarPicker.dart';

class NewTodo extends StatefulWidget {
  final Function addTx;

  NewTodo({this.addTx});
  @override
  _NewTodoState createState() => _NewTodoState();
}

class _NewTodoState extends State<NewTodo> {
  @override
  Widget build(BuildContextcontext) {
    showModalBottomSheet(
      backgroundColor: Colors.white,
      isScrollControlled: true,
      shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.vertical(top: Radius.circular(25.0))),
      context: context,
      builder: (_) {
        return GestureDetector(
          onTap: () {},
          // Where i started the code pasting from
          child: Padding(
            padding: MediaQuery.of(context).viewInsets,
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Card(
                elevation: 0.000,
                child: Container(
                  padding: EdgeInsets.all(20),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.end,
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[
                      TextField(
                        decoration: InputDecoration(labelText: 'Title'),
                        controller: _titleController,
                        autofocus: true,
                        onSubmitted: null,
                        // onChanged: (val) {
                        //   titleInput = val;
                        // },
                      ),
                      TextField(
                        decoration: InputDecoration(labelText: 'Description'),
                        controller: _discriptionController,
                        onSubmitted: null,
                        // onChanged: (val) => amountInput = val,
                      ),
                      Container(
                        height: 70,
                        child: Row(
                          children: [
                            Text(selectedDateAndTime == null
                                    ? 'No Date Choosen'
                                    : DateFormat('MM/dd/yyyy HH:mm')
                                        .format(selectedDateAndTime)
                                // : DateFormat.yMd()
                                //     .format(_selectedDate),
                                ),
                            FlatButton(
                              textColor: Theme.of(context).primaryColor,
                              child: Icon(Icons.calendar_today),
                              // onPressed: () async {
                              //   var value = await _selectedTime();
                              // },
                              onPressed: () {
                                SelectDayAndTimeL();
                              },
                            ),
                          ],
                        ),
                      ),
                      RaisedButton(
                        child: Text('Save Todo'),
                        color: Theme.of(context).primaryColor,
                        textColor: Theme.of(context).textTheme.button.color,
                        onPressed: _submitData,
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        );
      },
    );
  }

  void _submitData() {
    // if (_amountController.text.isEmpty) {
    //   return;
    // }
    final enteredTitle = _titleController.text;
    final enteredDescription = _discriptionController.text;

    if (enteredTitle.isEmpty) {
      return;
    }

    widget.addTx(
      enteredTitle,
      enteredDescription,
      selectedDateAndTime,
    );
    Navigator.of(context).pop();
  }

  final _titleController = TextEditingController();
  final _discriptionController = TextEditingController();
  var favorite;
  // DateTime _selectedDate;
  DateTime selectedDateAndTime;
  @override
  void dispose() {
    super.dispose();
    _discriptionController.dispose();
    _titleController.dispose();
  }
}

然后下面是我尝试在 main.dart 上调用它的方法，我也在另一个屏幕上使用了相同的方法，但是单击按钮时它不显示小部件

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:schedule_todu/widgets/new_todu.dart';

import './widgets/todu_list.dart';

void main() {
  runApp(MaterialApp(
    home: ItemList(),
  ));
}

class ItemList extends StatefulWidget {
  final Function addTx;
  ItemList({this.addTx});
  @override
  _ItemListState createState() => _ItemListState();
}

class _ItemListState extends State<ItemList> {


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      drawer: Drawer(
        child: IconButton(icon: Icon(Icons.add), onPressed: null),
      ),
      appBar: AppBar(
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.add),
            onPressed: () {NewTodo();},
          ),
        ],
        title: Text('Todu Scheduled Tasks'),
        centerTitle: true,
        backgroundColor: Colors.redAccent,
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: () {NewTodo();},
        backgroundColor: Colors.redAccent,
      ),
      body: SingleChildScrollView(child: Lists()),
    );
  }
}

Answer 1

在 NewToDo 中，下面的构建检查中没有返回小部件，

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

import '../widgets/calendarPicker.dart';

class NewTodo extends StatefulWidget {
  final Function addTx;

  NewTodo({this.addTx});
  @override
  _NewTodoState createState() => _NewTodoState();
}

class _NewTodoState extends State<NewTodo> {
  @override
  Widget build(BuildContextcontext) {

    //remove bottom sheet here
    
        return GestureDetector(
          onTap: () {},
          // Where i started the code pasting from
          child: Padding(
            padding: MediaQuery.of(context).viewInsets,
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Card(
                elevation: 0.000,
                child: Container(
                  padding: EdgeInsets.all(20),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.end,
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[
                      TextField(
                        decoration: InputDecoration(labelText: 'Title'),
                        controller: _titleController,
                        autofocus: true,
                        onSubmitted: null,
                        // onChanged: (val) {
                        //   titleInput = val;
                        // },
                      ),
                      TextField(
                        decoration: InputDecoration(labelText: 'Description'),
                        controller: _discriptionController,
                        onSubmitted: null,
                        // onChanged: (val) => amountInput = val,
                      ),
                      Container(
                        height: 70,
                        child: Row(
                          children: [
                            Text(selectedDateAndTime == null
                                    ? 'No Date Choosen'
                                    : DateFormat('MM/dd/yyyy HH:mm')
                                        .format(selectedDateAndTime)
                                // : DateFormat.yMd()
                                //     .format(_selectedDate),
                                ),
                            FlatButton(
                              textColor: Theme.of(context).primaryColor,
                              child: Icon(Icons.calendar_today),
                              // onPressed: () async {
                              //   var value = await _selectedTime();
                              // },
                              onPressed: () {
                                SelectDayAndTimeL();
                              },
                            ),
                          ],
                        ),
                      ),
                      RaisedButton(
                        child: Text('Save Todo'),
                        color: Theme.of(context).primaryColor,
                        textColor: Theme.of(context).textTheme.button.color,
                        onPressed: _submitData,
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        );
      }

  void _submitData() {
    // if (_amountController.text.isEmpty) {
    //   return;
    // }
    final enteredTitle = _titleController.text;
    final enteredDescription = _discriptionController.text;

    if (enteredTitle.isEmpty) {
      return;
    }

    widget.addTx(
      enteredTitle,
      enteredDescription,
      selectedDateAndTime,
    );
    Navigator.of(context).pop();
  }

  final _titleController = TextEditingController();
  final _discriptionController = TextEditingController();
  var favorite;
  // DateTime _selectedDate;
  DateTime selectedDateAndTime;
  @override
  void dispose() {
    super.dispose();
    _discriptionController.dispose();
    _titleController.dispose();
  }
}

现在在 ItemList Screen 中，两个 onPress 方法都应该返回底部表，如下所示，

showModalBottomSheet(
      backgroundColor: Colors.white,
      isScrollControlled: true,
      shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.vertical(top: Radius.circular(25.0))),
      context: context,
      builder: (_) {
    return NewToDo();
    });