首页 > 解决方案 > Flutter - 我如何从嵌套的脚手架访问抽屉

问题描述

这个父底部导航栏

import 'package:flutter/material.dart';

class BottomNavigation extends StatefulWidget {
  BottomNavigation({
    Key? key,
  }) : super(key: key);
  @override
  _BottomNavigationState createState() => _BottomNavigationState();
}

class _BottomNavigationState extends State<OARBottomNavigation> {
  int _selectedIndex = 0;
  List<Widget> _widgetOptions = [
    Screen1(),
    Screen2(),
  ];

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      drawer: SideDrawer(),
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.assignment_turned_in),
            label: 'Screen 1',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.people),
            label: 'Screen 2',
          ),
   
        ],
        currentIndex: _selectedIndex,
        onTap: _onItemTapped,
      ),
      body: Scaffold(
        body: _widgetOptions.elementAt(_selectedIndex),
      ),
    );
  }
}



现在在屏幕 1 上,我想打开 Drawer()。

import 'package:flutter/material.dart';

class Screen1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Screen 1 Title'),
      ),
      body: Container(
        child: Text('This is Screen 1'),
        ),
      ),
    );
  }
}


如何从屏幕 1 打开抽屉?

标签: flutter

解决方案


请检查以下代码。有BottomNavigationBarDrawer(BottomNavigationBar 的顶部)

return Scaffold(
      appBar: AppBar(),
      drawer: Drawer(
        child: Container(
          color: Colors.red,
          child: ListView.builder(
            itemBuilder: (context, index) {
              return ListTile(
                title: InkWell(
                  onTap: () {},
                  child: Text(
                    index.toString(),
                  ),
                ),
              );
            },
            itemCount: 3,
          ),
        ),
      ),
      bottomNavigationBar: BottomNavigationBar(items: [
        BottomNavigationBarItem(icon: Icon(Icons.home), label: "Home"),
        BottomNavigationBarItem(icon: Icon(Icons.settings), label: "Settings"),
      ]),
    );

抽屉

打开抽屉


推荐阅读