如何在 flutter 中自定义下拉列表，例如 flipkart dropdownlist

Question

我想要下拉列表，但我无法执行以下操作。

• 更改下拉按钮的宽度
• 使下拉列表从下拉按钮的高度开始，而不是默认高于它
• 调整下拉菜单项的高度

我想要的是

我有的是

代码如下

                                                child: ButtonTheme(
                                                  alignedDropdown: true,
                                                  child: DropdownButtonHideUnderline(
                                                    child: DropdownButton<String>(
                                                        // isDense: true,
                                                        // isExpanded: true,
                                                        itemHeight: null,
                                                        // menuMaxHeight: 10,
                                                        alignment: AlignmentDirectional.center,
                                                        elevation: 0,
                                                        value: selectedQuantity,
                                                        selectedItemBuilder: (BuildContext context) {
                                                          return _dropDownQuantities.map<Widget>((String item) {
                                                            return Container(
                                                              alignment: Alignment.center,
                                                              // color: Colors.green,
                                                              child: Text(
                                                                'Qty: $item',
                                                                style: TextStyle(fontSize: 14),
                                                              ),
                                                            );
                                                          }).toList();
                                                        },
                                                        items: _dropDownQuantities.map((e) {
                                                          return DropdownMenuItem(
                                                            alignment: AlignmentDirectional.topStart,
                                                            child: Container(
                                                                child: Column(
                                                              children: [Container(child: Text(e))],
                                                            )),
                                                            value: e,
                                                          );
                                                        }).toList(),
                                                        hint: Text("Qty: 1 "),
                                                        onChanged: (value) {
                                                          setState(() {
                                                            selectedQuantity = value!;
                                                          });
                                                        }),
                                                  ),
                                                ),

Answer 1

使用 DropdownButton2 来实现。

1. 使用 buttonWidth 属性 更改下拉按钮的宽度。
2. 使用offset 属性改变下拉菜单的位置。您应该将按钮的高度添加到 dy 偏移量以使其从下拉按钮的高度开始，如下所示：Offset(0.0, "button's height")
3. 使用itemHeight 属性调整下拉菜单项的高度。

免责声明：我是上述包的作者。