首页 > 解决方案 > 是否有一个类似于 expandtile 的小部件,它允许我将标题作为单独的按钮单击?

问题描述

我的应用程序主页上需要一个导航菜单。我使用 ListView 和 ExpansionTile 作为子项,但我需要标题是一个单独的按钮,并且只有 down_arrow 才能打开扩展图块。我如何实现这一目标?我在这里缺少一个小部件吗?

我确实使用了 ExpansionPanelList 和 ExpansionPanel 但结果似乎很难看,顶部和底部都有边框。有没有自定义的方法来做到这一点?

我还尝试使用扩展磁贴作为列表磁贴的尾随元素,但视口超出范围。

扩展瓦部分代码

  return Expanded(
      child: ListView(
        children: gridTiles
            .map(
              (tile) => ListTile(
                contentPadding: EdgeInsets.all(10),
                leading: ClipRRect(
                  borderRadius: BorderRadius.circular(4),
                  child: Container(
                    padding: EdgeInsets.all(7),
                    color: tile['color'],
                    child: Icon(
                      tile['icon'],
                      color: Colors.white,
                    ),
                  ),
                ),
//                title: Text("Test"),
                title: ExpansionTile(
                  title: Text(
//                    tile['title'],
                  '',
                    style: TextStyle(
                      color: Colors.black,
                    ),
                  ),
                  children: <Widget>[
                    Text("test"),
                  ],
                ),
              ),
            )
            .toList(),
      ),
    );

扩展面板部分代码

 return ExpansionPanelList(
      expansionCallback: (int index, bool isExpanded) {
        setState(() {
            isExpanded1 = !isExpanded;
        });
      },
      children: gridTiles.map<ExpansionPanel>((tile) {
        return ExpansionPanel(
          body: Text("test body"),
          headerBuilder: (BuildContext context, bool isExpanded) {
            return ListTile(
              leading: Icon(Icons.title),
              title: Text("test"),
              onTap: () => print("Test"),
            );
          },
          canTapOnHeader: true,
          isExpanded: isExpanded1,
        );
      }).toList(),
    );

标签: androidflutter

解决方案


是的,您可以,只需将您想要的小部件添加为标题,然后只有箭头会打开磁贴,您可以根据需要处理小部件上的操作,例如FlatButton

ExpansionTile(
          title: FlatButton(
            child: Text('Button'),
            onPressed: () {
              // clicking the button will trigger this and not open the list tile
              // only the arrow will open it 
              print('button got clicked');
            },
          ),


推荐阅读