在 CupertinoNavigationBar 中，我如何在前导中显示除后退按钮之外的按钮？答案

【问题标题】：In CupertinoNavigationBar how do i show a button besides back button in leading?在 CupertinoNavigationBar 中，我如何在前导中显示除后退按钮之外的按钮？
【发布时间】：2019-08-24 11:36:08
【问题描述】：

我尝试过这样的事情：

  @override
  Widget build(BuildContext context) {
    return CupertinoPageScaffold(
      navigationBar: CupertinoNavigationBar(
        middle: Text(widget.title),
      ),
      child: Center(
        child: Container(
          child: CupertinoButton.filled(
            child: const Text('Push screen'),
            onPressed: () {
              CupertinoNavigationBar navBar = CupertinoNavigationBar(
                leading: Row(children: <Widget>[
                  const CupertinoNavigationBarBackButton(),
                  CupertinoButton(
                    child: const Text('Button 2'),
                    padding: EdgeInsets.zero,
                    onPressed: () {},
                  ),
                ]),
              );
              Navigator.push(context, CupertinoPageRoute<CupertinoPageScaffold>(
                builder: (_) => CupertinoPageScaffold(
                  navigationBar: navBar,
                  child: Center(child: const Text('Content')),
                )
              ));
            },
          ),
        ),
      ),
    );
  }

当点击按钮时，它会失败

I/flutter (30855): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter (30855): The following NoSuchMethodError was thrown building CupertinoNavigationBarBackButton(dirty):
I/flutter (30855): The getter 'canPop' was called on null.
I/flutter (30855): Receiver: null
I/flutter (30855): Tried calling: canPop

原因是CupertinoNavigationBarBackButton中的这段代码返回null

final ModalRoute<dynamic> currentRoute = ModalRoute.of(context);

我想知道为什么会这样？是不是因为我按下按钮的时候，context还没有拿到路线？

手动添加后退按钮的正确方法是什么？

提前致谢。

【问题讨论】：

标签： dart flutter flutter-cupertino

【解决方案1】：

这是一个非常简单的sn-p代码。希望对你有帮助：

class DemoView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    return CupertinoPageScaffold(
      navigationBar: CupertinoNavigationBar(
        leading: GestureDetector(
          onTap: () {
            debugPrint('Back button tapped');
          },
          child: Row(
            children: <Widget>[
              Icon(CupertinoIcons.left_chevron),
              Text(
                'Back',
                style: TextStyle(
                  color: CupertinoColors.activeBlue,
                ),
              ),
            ],
          ),
        ),
        middle: Text('Demo'),
        trailing: GestureDetector(
          onTap: () {
            debugPrint('add icon tapped');
          },
          child: Icon(
            CupertinoIcons.add,
            color: CupertinoColors.black,
          ),
        ),
      ),
      child: Center(
        child: Text(
          'Content',
          style: TextStyle(fontSize: 36.0),
        ),
      ),
    );
  }
}

【讨论】：

debugPrint('add icon tapped')) 处出错；您必须在末尾删除一个括号

【解决方案2】：

手动添加后退按钮的正确方法是什么？

我使用这样的代码：

@override
Widget build(BuildContext context) {
  return CupertinoPageScaffold(
    navigationBar: CupertinoNavigationBar(
      middle: Text(widget.title),
      leading: CupertinoNavigationBarBackButton(
        onPressed: () => Navigator.of(context).pop(),
      ),
      child: _myAppBody() // return widget
    ),
  );
}

【讨论】：