使用复选框自定义下拉式颤动
使用复选框自定义下拉式颤动
提问于 2021-08-12 05:03:40
我是个新手。它是自定义的下拉列表，所有边框都有圆角。以及带有复选框的下拉菜单与其一起列出。
我尝试了几个渲染对象的例子。但是我不知道如何得到这个设计。
有人能帮我做这个设计吗？
示例
class _DropdowncustomState extends State<Dropdowncustom> {
late String valueChoose;
List listitem = [
"Item 1","Item 1","Item 1","Item 1","Item 1"
];
List _gender = [ 'Male','Female','Other'];
String ? _genderval;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Container(
padding: EdgeInsets.only(left:10,right:10),
decoration: BoxDecoration(
border: Border.all(color:Colors.transparent),
borderRadius: BorderRadius.all(Radius.circular(30)),
color: Colors.white,
),
child: DropdownButton(
hint: Text('Gender'),
dropdownColor: Colors.white,
// dropdownColor: Colors.grey[200],
value: _genderval,
isExpanded: true,
onChanged: (value)
{
setState(() {
_genderval= value as String?;
});
},
items: _gender.map((value)
{
return DropdownMenuItem(
value: value,
child: Text(value) ,);
}
).toList(),
),
),
),
);
}
}回答 2
Stack Overflow用户
回答已采纳
发布于 2021-08-12 05:36:17
点击链接Flutter Dropdown。
如果您不想搜索，只需设置-> showSearchBox: false，
第二件事是你必须用flutter复选框替换图标。
在DropDownSearch()中使用这两个特性
dropdownBuilder: _customDropDownExample,
popupItemBuilder: _customPopupItemBuilderExample,这些是-
Widget _customDropDownExample(
BuildContext context, UserModel? item, String itemDesignation) {
if (item == null) {
return Container();
}
return Container(
child: (item.avatar == null)
? ListTile(
contentPadding: EdgeInsets.all(0),
leading: CircleAvatar(),
title: Text("No item selected"),
)
: ListTile(
contentPadding: EdgeInsets.all(0),
leading: CircleAvatar(
// this does not work - throws 404 error
// backgroundImage: NetworkImage(item.avatar ?? ''),
),
title: Text(item.name),
subtitle: Text(
item.createdAt.toString(),
),
),
);}
第二个是-
Widget _customPopupItemBuilderExample(
BuildContext context, UserModel item, bool isSelected) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 8),
decoration: !isSelected
? null
: BoxDecoration(
border: Border.all(color: Theme.of(context).primaryColor),
borderRadius: BorderRadius.circular(5),
color: Colors.white,
),
child: ListTile(
selected: isSelected,
title: Text(item.name),
subtitle: Text(item.createdAt.toString()),
leading: CircleAvatar(
// this does not work - throws 404 error
// backgroundImage: NetworkImage(item.avatar ?? ''),
),
),
);}
Stack Overflow用户
发布于 2021-08-12 05:53:22
为了实现这一点，你可以将你的下拉菜单包装在一个卡片小部件中，并且为了使方框变成圆角，你可以像这样设置卡片的形状值：
Card (child: ... ,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(//whatever value you want),
topRight: Radius.circular(),
...
));页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/68751839
复制相关文章
相似问题
腾讯云开发者
