颤振:导航抽屉和扩展瓷砖

时间:2018-11-12 21:57:57

标签: flutter flutter-layout

我正在尝试构建带有扩展图块的导航抽屉,当我单击标题时它会折叠,反之亦然 但是当我将抽屉标头设置为ExpansionTile的子级时,原始标头填充会丢失

enter image description here

 Widget _buildDrawer() {
return Drawer(
    child: ExpansionTile(
  title: UserAccountsDrawerHeader(
    decoration: BoxDecoration(color: Colors.deepPurple),
    accountName: Text("Mohamed Ali"),
    accountEmail: Text("mohamed.ali6996@hotmail.com"),
    currentAccountPicture: CircleAvatar(
      child: Text("M"),
      backgroundColor: Colors.white,
    ),
  ),
  children: <Widget>[
    ListTile(
      title: Text("page one"),
      trailing: Icon(Icons.android),
      onTap: () => _onSelectedItem(0),
    ),
    ListTile(
      title: Text("page two"),
      trailing: Icon(Icons.accessible),
      onTap: () => _onSelectedItem(1),
    ),
    Divider(),
    ListTile(
      title: Text("Log out"),
      trailing: Icon(Icons.exit_to_app),
    ),
  ],
  initiallyExpanded: false,
)

); }

1 个答案:

答案 0 :(得分:0)

问题在于标头取代了ExpansionTile中的第一个图块。

一种可能的解决方案是使用Stack并用Align调整内容,以便扩展图标位于标题的底部。

更改展开图标的颜色可能不适合您。有一个报告的issue here,我已经提交了一个PR here。不知道什么时候会降落在主人身上。

_buildDrawer(BuildContext context) {
  ThemeData theme = Theme.of(context);
  return Drawer(
    child: Stack(
      children: <Widget>[
        UserAccountsDrawerHeader(
          decoration: BoxDecoration(color: Colors.indigo),
        ),
        Positioned(
          top: 120.0,
          left: 0.0,
          right: 0.0,
          child: Theme(
            data: theme.copyWith(
              textTheme: theme.textTheme.copyWith(
                subhead: theme.textTheme.subhead.copyWith(
                  color: Colors.grey,
                ),
              ),
              accentColor: Colors.white,
              unselectedWidgetColor: Colors.grey,
              iconTheme: theme.iconTheme.copyWith(color: Colors.white),
              dividerColor: Colors.transparent,
            ),
            child: ExpansionTile(
              title: Align(
                heightFactor: 0.4,
                alignment: Alignment.bottomCenter,
                child: UserAccountsDrawerHeader(
                  decoration: BoxDecoration(color: Colors.transparent),
                  accountName: Text("Mohamed Ali"),
                  accountEmail: Text("mohamed.ali6996@hotmail.com"),
                  currentAccountPicture: CircleAvatar(
                    child: Text("M"),
                    backgroundColor: Colors.white,
                  ),
                ),
              ),
              children: <Widget>[
                ListTile(
                  title: Text("page one"),
                  trailing: Icon(Icons.android),
                  onTap: () => {},
                ),
                ListTile(
                  title: Text("page two"),
                  trailing: Icon(Icons.accessible),
                  onTap: () => {},
                ),
                Container(
                  height: 1.0,
                  color: Color(0xFFDDDDDD),
                ),
                ListTile(
                  title: Text("Log out"),
                  trailing: Icon(Icons.exit_to_app),
                ),
              ],
              initiallyExpanded: false,
            ),
          ),
        ),
      ],
    ),
  )
}