# DropDown 下拉菜单

## 基础用法
MillDropDownItem 传 options 自动渲染列表。 activeColor 为选中字体的颜色。
```dart
MillDropDown(
  activeColor: Color(0xffee0a24),
  children: [
    MillDropDownItem(key: ValueKey('filter'), options: _list1),
    MillDropDownItem(key: ValueKey('order'), options: _list2),
    MillDropDownItem(key: ValueKey('filter3'), options: _list2),
  ],
),
```
## 自定义下拉内容

传 child 后 options 失效，下拉框内为 child 为自定义的内容。 title 作为导航中展示的内容。
```dart
MillDropDown(
  activeColor: Color(0xffee0a24),
  children: [
    MillDropDownItem(key: ValueKey('filter'), options: _list1),
    MillDropDownItem(key: ValueKey('order'), options: _list2),
    MillDropDownItem(key: ValueKey('filter3'), options: _list2),
    MillDropDownItem(
      title: title,
      child: Container(
        child: Text(title),
      ),
    ),
  ],
),
```
## 仅作为导航存在

传 builder 后 child 失效，将作为 nav 存在，不会出现下拉菜单。
```dart
MillDropDown(
  activeColor: Color(0xffee0a24),
  children: [
    MillDropDownItem(key: ValueKey('filter'), options: _list1),
    MillDropDownItem(
      title: title,
      child: Container(
        child: Text(title),
      ),
    ),
    MillDropDownItem(
      builder: (BuildContext context) {
        return MillDropDownCustomItem(
          child: Container(
            alignment: Alignment.center,
            child: Text(title2),
          ),
        );
      },
    ),
  ],
),
```
![dropdown](../../images/dropdown1.jpg)

## disabled
在 MillDropDownItem 里设置 disabled 可以使 nav 不能点击。在 options 里设置 disabled。下拉选项不能点击。
```dart
List list = [
  {
    'name': '价格降序',
    'id': 1,
  },
  {
    'name': '价格升序',
    'id': 2,
  },
  {
    'name': '点击升序',
    'id': 3,
    'disabled': true,
  }
];

MillDropDown(
  activeColor: Color(0xffee0a24),
  children: [
    MillDropDownItem(
      key: ValueKey('filter'),
      options: list,
    ),
    MillDropDownItem(
      key: ValueKey('order'),
      options: list,
      disabled: true,
    ),
    MillDropDownItem(
      title: title,
      child: Container(
        child: Text(title),
      ),
    ),
    MillDropDownItem(
      builder: (BuildContext context) {
        return MillDropDownCustomItem(
          onTap: () {
            print('sss');
          },
          child: Container(
            alignment: Alignment.center,
            child: Text(title2),
          ),
        );
      },
    ),
  ],
),
```

![dropdown](../../images/dropdown2.jpg)

## Attributes
| 字段名称 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| onChange | change 回调 | Function |  |
| children | 列表 | List\<MillDropDownItem\> |  |
| activeColor | 选中时字体颜色 | Color | Color(0xff1989fa) |
| bgColor | 背景色 | Color | Color(0xffffffff) |
| activeBgColor | 下拉框出现时背景色 | Color | Color(0xffffffff) |
| direction | 方向， | String (down 、up) | down |

