Flutter：如何從其他小部件調用 openDrawer

Question

問：我想從 Header.dart 的 onPressed() 調用 openDrawer

抽屜.dart、Header.dart和Home.ZBB14127678960FAE157D873950EA文件是分開的。

我試過Scaffold.of(context).openDrawer(); 沒用。

我嘗試使用cotroller但它不起作用。 也許它沒有以正確的方式使用。

我會很感激你能給我的任何建議。

代碼：

代碼被省略。

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: Header('App'),
      endDrawer: Menu(),
    )}}

class Header extends StatefulWidget implements PreferredSizeWidget {
  const Header(this.heading, {Key? key});
  final String heading;
  @override
  Size get preferredSize => const Size.fromHeight(kToolbarHeight);

  @override
  State<Header> createState() => _HeaderState(heading);
}

class _HeaderState extends State<Header> {
  _HeaderState(this.heading);

  final String heading;

  @override
  Widget build(BuildContext context) {
    return AppBar(
      centerTitle: false,
      actions: <Widget>[
        IconButton(
          icon: const Icon(Icons.menu, size: 30.0),
          tooltip: '',
          onPressed: () {
            // _key.currentState!.openDrawer();
          },
        ),]
    );
  }
}

class Menu extends StatelessWidget {
  const Menu({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Drawer()
}

Answer 1

您使用的是末端抽屜，因此您應該使用Scaffold.of(context).openEndDrawer()而不是Scaffold.of(context).openDrawer() (context).openDrawer() ：

class _HeaderState extends State<Header> {
  _HeaderState(this.heading);

  final String heading;

  @override
  Widget build(BuildContext context) {
    return AppBar(
      centerTitle: false,
      actions: <Widget>[
        IconButton(
          icon: const Icon(Icons.menu, size: 30.0),
          tooltip: '',
          onPressed: () {
            Scaffold.of(context).openEndDrawer();
          },
        ),]
    );
  }
}

---

旁注：您不需要將arguments從StatefulWidget傳遞到State - State的每個實例都有一個widget屬性，您可以使用它來訪問小部件的父屬性。

在您的情況下，它看起來像：

class Header extends StatefulWidget implements PreferredSizeWidget {
  const Header(this.heading, {Key? key});

  final String heading;

  @override
  Size get preferredSize => const Size.fromHeight(kToolbarHeight);

  @override
  State<Header> createState() => _HeaderState();
}

class _HeaderState extends State<Header> {
  @override
  Widget build(BuildContext context) {
    return AppBar(
      centerTitle: false,

      // Assuming this is what the heading argument is for
      title: Text(widget.heading), 

      actions: <Widget>[
        IconButton(
          icon: const Icon(Icons.menu, size: 30.0),
          tooltip: '',
          onPressed: () {
            Scaffold.of(context).openEndDrawer();
          },
        ),
      ],
    );
  }
}