DropDownMenuItem 中的多个文本

Posted 2023-03-12

【中文标题】DropDownMenuItem 中的多个文本

【英文标题】：Multiple text in DropDownMenuItem

【发布时间】：2021-07-17 07:02:36

【问题描述】：

我一直在尝试构建下拉菜单项，如下图所示。

我需要在“语言级别...”文本下方的图像中开发扩展的下拉菜单，下拉菜单项中有 2 个文本。我将分享 DropDownMenuItem 的代码。

DropdownButton<String>(
  underline: Container(),
  isExpanded: true,
  isDense: true,
  value: selected,
  icon: Icon(Icons.arrow_downward),
  iconSize: 24,
  elevation: 16,
  style: TextStyle(color: Colors.black),
  onChanged: (value) 
    selectedCallback(value);
    setState(() 
      selected = value;
    );
  ,
  
  items: list.map<DropdownMenuItem<String>>((e) 
    return DropdownMenuItem<String>(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [Text(e)],
      ),
      value: e,
    );
  ).toList(),
  selectedItemBuilder: (context) => list
      .map((e) => Text(
            e,
            style: TextStyle(color: Colors.black),
          ))
      .toList(),
)

请帮助我。 谢谢

【参考方案1】：

我找到了解决办法

DropdownButton<LanguageModel>(
  underline: Container(),
  isExpanded: true,
  isDense: true,
  value: selected,
  icon: Icon(Icons.arrow_downward),
  iconSize: 24,
  elevation: 16,
  style: TextStyle(color: Colors.black),
  onChanged: (value) 
    selectedCallback(value);
    setState(() 
      selected = value;
    );
  ,
  onTap: () 
    setState(() 
      check = true;
    );
  ,
  selectedItemBuilder: (ctxt) 
    return list.map<DropdownMenuItem<LanguageModel>>((e) 
      return DropdownMenuItem<LanguageModel>(
        child: Text(e.level),
        value: e,
      );
    ).toList();
  ,
  items: list.map((e) 
    return DropdownMenuItem(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(e.level,style: TextStyle(fontWeight: FontWeight.w400),),
          Text(e.description,style: TextStyle(color: Color.fromARGB(100, 166, 166, 166).withOpacity(1.0),fontSize: 12),),
          Divider(color: Colors.grey,thickness: 1,)
        ],
      ),
      value: e,
    );
  ).toList(),
);