跳至主要內容

DropdownButtonFormField

xiaoye小于 1 分钟

DropdownButtonFormField

DropdownButtonFormField 是一个组合控件,将[DropdownButton]包装在[FormField]中,用法如下:

var _value='语文';


Widget build(BuildContext context) {
  return DropdownButtonFormField(
    value: _value,
    items: [
      DropdownMenuItem(
        child: Text('语文'),
        value: '语文',
      ),
      DropdownMenuItem(child: Text('数学'), value: '数学'),
      DropdownMenuItem(child: Text('英语'), value: '英语'),
    ],
    onChanged: (String value){
      setState(() {
        _value = value;
      });
    },
  );
}
DropdownButtonFormField_1
DropdownButtonFormField_1

selectedItemBuilder用于自定义选中item的控件,此属性的子控件要和items一一对应,

DropdownButtonFormField(
  items: [
    DropdownMenuItem(
      child: Text('语文'),
      value: '语文',
    ),
    DropdownMenuItem(child: Text('数学'), value: '数学'),
    DropdownMenuItem(child: Text('英语'), value: '英语'),
  ],
  selectedItemBuilder: (context) {
    return [
      OutlineButton(child: Text('语文'),onPressed: (){},),
      OutlineButton(child: Text('数学'),onPressed: (){},),
      OutlineButton(child: Text('英语'),onPressed: (){},),
    ];
  },
  ...
)
image-20200526122917813
image-20200526122917813

当value为null时,设置提示

DropdownButtonFormField(
  hint: Text('请选择'),
  value: null,
  ...
)
image-20200526123158187
image-20200526123158187

decoration是装饰属性,具体信息查看InputDecorationopen in new window

onSavedvalidatorFormFieldopen in new window组件的相关参数。

而剩余属性均为DropdownButtonopen in new window属性。