如何在底部抽屉中添加可滚动的列表视图而不占用更多空间?

4
这是我的主页,有两个抽屉,在最后一个抽屉中我需要显示通知列表。我尝试使用NestedScrolView,但它会创建一个我不需要的SliverAppBar。我只需要滚动列表数据并保持标题固定。我不想使用占用更多空间的DrawerHeader。
    class HomeScreen extends StatefulWidget {
      @override
      State<StatefulWidget> createState() {
        return new HomeScreenState();
      }
    }

    class HomeScreenState extends State<HomeScreen>{
      ScrollController _controller = new ScrollController();
      final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

      void _logout() async {
        var db = new DatabaseHelper();
        await db.deleteUsers();
      }

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          key: _scaffoldKey,
          endDrawer: new Drawer(
            child: new ListView(
              children: <Widget>[
                new ListTile(
                  title: new Text('Notifications',
                  style: new TextStyle(
                  fontSize: 24.0,
                  fontWeight: FontWeight.bold,
                ),
                textAlign: TextAlign.center,
              ),
            ),
            // List of notifications shld be done here...
            new CustomScrollView(
              shrinkWrap: true,
              controller: _controller,
              slivers: <Widget>[
                new SliverPadding(
                  padding: const EdgeInsets.all(20.0),
                  sliver: new SliverList(
                    delegate: new SliverChildListDelegate(
                    <Widget>[
                      const Text('I\'m dedicating every day to you'),
                      const Text('Domestic life was never quite my style'),
                      const Text('When you smile, you knock me out, I fall apart'),
                      const Text('And I thought I was so smart'),
                      const Text('I\'m dedicating every day to you'),
                      const Text('Domestic life was never quite my style'),
                      const Text('When you smile, you knock me out, I fall apart'),
                      const Text('And I thought I was so smart'),
                      const Text('I\'m dedicating every day to you'),
                      const Text('Domestic life was never quite my style'),
                      const Text('When you smile, you knock me out, I fall apart'),
                      const Text('And I thought I was so smart'),
                      const Text('I\'m dedicating every day to you'),
                      const Text('Domestic life was never quite my style'),
                      const Text('When you smile, you knock me out, I fall apart'),
                      const Text('And I thought I was so smart'),
                      const Text('I\'m dedicating every day to you'),
                      const Text('Domestic life was never quite my style'),
                      const Text('When you smile, you knock me out, I fall apart'),
                      const Text('And I thought I was so smart'),
                      const Text('I\'m dedicating every day to you'),
                      const Text('Domestic life was never quite my style'),
                      const Text('When you smile, you knock me out, I fall apart'),
                      const Text('And I thought I was so smart'),
                      const Text('I\'m dedicating every day to you'),
                      const Text('Domestic life was never quite my style'),
                      const Text('When you smile, you knock me out, I fall apart'),
                      const Text('And I thought I was so smart'),
                    ],
                  ),
                ),
              ),
            ],
            )
          ],
        )
      ),
      appBar: new AppBar(
        /* leading: new IconButton(icon: new Icon(Icons.notifications),
          onPressed: () => _scaffoldKey.currentState.openDrawer()), */
        backgroundColor: Colors.blueAccent.shade50,
        title: new Image.asset('assets/image.png', 
        fit: BoxFit.cover,
        height: 25.0,
        width: 210.0,
        alignment: Alignment.center,),
      actions: <Widget>[
        IconButton(
          icon: Icon(Icons.notifications),
            onPressed: () => _scaffoldKey.currentState.openEndDrawer()
          ),
        ],
    ),
    drawer: new Drawer(
      child: new ListView(
        children: <Widget>[
          new UserAccountsDrawerHeader(
            accountName: new Text('Demo user'),
            accountEmail: new Text('demouser@iotrl.io'),
            currentAccountPicture: new CircleAvatar(
              child: new Image.asset('assets/dp.png'),
              ),
            decoration: new BoxDecoration(
              color: Colors.blueAccent.shade200
              ),
          ),
          new ListTile(
            title: new Text('Dashboard'),
            trailing: new Icon(Icons.dashboard),
          ),
          new ListTile(
            title: new Text('Live Tracking'),
            trailing: new Icon(Icons.track_changes),
          ),
          new ListTile(
            title: new Text('History'),
            trailing: new Icon(Icons.history),
          ),
          new ListTile(
            title: new Text('Places'),
            trailing: new Icon(Icons.place),
          ),
          new ListTile(
            title: new Text('Reports'),
            trailing: new Icon(Icons.dock),
          ),
          new ListTile(
            title: new Text('Logout'),
            trailing: new Icon(Icons.exit_to_app),
            onTap: () {
              _logout();
              Navigator.of(context).pushReplacementNamed("/login");
            }
        ),
        ]
      ),
    ),
    backgroundColor: Colors.white,
    body: Center(
      child: Text("welcome user"),
    )
  );
 }
}

请查看下面的图片以了解。 可滚动通知
1个回答

3
您可以在 Column 中使用一个包含ListView的组件。
endDrawer: Drawer(
          child: Column(
            children: <Widget>[
              new Text('Notifications',
                  style: new TextStyle(
                  fontSize: 24.0,
                  fontWeight: FontWeight.bold,
                ),
                textAlign: TextAlign.center,
              ),
              Flexible(
                child: ListView(
                  children: List.generate(20, (i)=>ListTile(
                    title: Text('Notification $i'),
                  )),
                ),
              )
            ],
          ),
        ),

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接