flutter - 如何在 flutter 的抽屉中添加分隔符和字幕

Question

我想在抽屉导航中添加副标题和分隔符，如下图所示。



我已经为抽屉导航编写了以下代码，但无法找到可以放置字幕和分隔符的位置。

drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: const <Widget>[
            DrawerHeader(
              decoration: BoxDecoration(
                color: Colors.blue,
              ),
              child: Text(
                'Drawer Header',
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 24,
                ),
              ),
            ),
            ListTile(
              leading: Icon(Icons.message),
              title: Text('Messages'),
            ),
            ListTile(
              leading: Icon(Icons.account_circle),
              title: Text('Profile'),
            ),
            ListTile(
              leading: Icon(Icons.settings),
              title: Text('Settings'),
            ),
          ],
        ),
      ),

Answer 1

有一个名为 Divider 的小部件
您可以简单地添加一个分隔线作为 childrens 之一的ListView对于副标题，您可以添加 Text小部件并使用 TextStyle 设置样式以使其看起来像您需要的样子

drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: const <Widget>[
            DrawerHeader(...),
            Divider(), //here is a divider
            Text("subtitle", style: TextStyle(...)),
            ListTile(...),
            ListTile(...),
            Divider(), //here is a divider
            ListTile(...),
            //rest of your items
          ],
        ),
      ),