如何在 Flutter 中将菜单叠加在 DropdownMenu 之上？

Question

我正在尝试显示一个直接覆盖在 Flutter 中 DropdownMenu 顶部的自定义菜单，但该菜单没有出现在所需的位置。实现这种叠加效果并将自定义菜单精确定位在 DropdownMenu 顶部的最佳方法是什么？

我尝试过使用 MenuStyle 的对齐属性，但它似乎没有按预期工作。

Answer 1

您有关于如何编码和定制的更多信息吗？我或许可以帮助你。这是我的编码，由 DropdownMenu

使用

enum ColorLabel {
   blue('Blue', Colors.blue),
   pink('Pink', Colors.pink),
   green('Green', Colors.green),
   orange('Orange', Colors.orange),
   grey('Grey', Colors.grey);

   const ColorLabel(this.label, this.color);
   final String label;
   final Color color;
 }

ColorLabel? selectedColor;

@Widget
DropdownMenu<ColorLabel>(
                  initialSelection: ColorLabel.green,
                  controller: colorController,
                  requestFocusOnTap: true,
                  label: const Text('Color'),
                  onSelected: (ColorLabel? color) {
                    setState(() {
                      selectedColor = color;
                    });
                  },
                  dropdownMenuEntries: ColorLabel.values
                      .map<DropdownMenuEntry<ColorLabel>>(
                          (ColorLabel color) {
                    return DropdownMenuEntry<ColorLabel>(
                      value: color,
                      label: color.label,
                      enabled: color.label != 'Grey',
                      style: MenuItemButton.styleFrom(
                        foregroundColor: color.color,
                      ),
                    );
                  }).toList(),
                ),

结果是

结果下拉列表

如果您想了解有关 DropdownMenu 的更多信息。我推荐了这个文档DropdownMenu的文档

希望可以帮到你！