我如何从flutter的showModalBottomSheet内部的CupertinoTimerPicker返回数据？

Question

如何在Flutter上从CupertinoTimerPicker（timerpicker.dart）返回数据到showModalBottomSheet（form.dart）？

我想使用navigator.pop或sth，但是它不像ondismissed（）函数吗？

timerpicker.dart

class TimerModal extends StatefulWidget {
  @override
  _TimerModalState createState() => _TimerModalState();
}

class _TimerModalState extends State<TimerModal> {
  Duration _initialtimer = new Duration();

  @override
  Widget build(BuildContext context) {
    return Container(
        height: MediaQuery.of(context).copyWith().size.height / 3,
        child: SizedBox.expand(
          child: CupertinoTimerPicker(
            mode: CupertinoTimerPickerMode.hm,
            minuteInterval: 1,
            secondInterval: 1,
            initialTimerDuration: _initialtimer,
            onTimerDurationChanged: (Duration changedtimer) {
              setState(() {
                _initialtimer = changedtimer;
              });
            },
          ),
        )
      );
  }
}

form.dart

  FlatButton _timerPickerModal() {
    return FlatButton(
      color: Colors.white,
      textColor: Colors.grey,
      disabledColor: Colors.grey,
      disabledTextColor: Colors.black,
      // padding: EdgeInsets.all(8.0),
      // splashColor: Colors.blueAccent,
      onPressed: () async {
        final result = await showModalBottomSheet(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(20.0),
          ),
          backgroundColor: Colors.white,
          context: context,
          builder: (builder) => TimerModal()
        );
        print(result);
        // setState(() {
        //   _newTimer = result;
        // });
      },
      child: Row(
        children: <Widget>[
          Expanded(
            child: Text(
              "Timer: " + _checkTimerText(_newTimer),
              style: TextStyle(fontSize: 20.0),
            ),
          ),
          Icon(Icons.arrow_forward_ios),
        ],
      ),
    );
  }

Answer 1

您必须提供对onDateTimeChanged的回调CupertinoDatePicker。

每次选择日期，都会执行回调。

在这种情况下，您可以向TimerModal添加回调并将其提供给CupertinoDatePicker。像这样的东西：

FlatButton _timerPickerModal() {
    return FlatButton(
      color: Colors.white,
      textColor: Colors.grey,
      disabledColor: Colors.grey,
      disabledTextColor: Colors.black,
      onPressed: () async {
        final result = await showModalBottomSheet(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(20.0),
          ),
          backgroundColor: Colors.white,
          context: context,
          builder: (builder) => TimerModal(
            onDateTimeChanged: (DateTime date) {
              // In date variable you have the new date selected
              // Here you can do anything you need with it
              print(date);
            },
          ),
        );
        print(result);
        // setState(() {
        //   _newTimer = result;
        // });
      },
      child: Row(
        children: <Widget>[
          Expanded(
            child: Text(
              "Timer: " + _checkTimerText(_newTimer),
              style: TextStyle(fontSize: 20.0),
            ),
          ),
          Icon(Icons.arrow_forward_ios),
        ],
      ),
    );
  }