在flutter中如何设置DropdownMenu的标签位置

问题描述 投票:0回答:1

作为 ThemeData 的一部分,我设置了背景颜色。因此,下拉菜单也获得相同的颜色,我希望它与文本字段具有相同的颜色。但是,当我发送下拉列表中的颜色时,标签不再位于顶部,而是与下拉列表的默认值重叠。

如何使下拉菜单的标签转到顶部。

主题数据

  theme: ThemeData(
    colorSchemeSeed: Colors.blueGrey,
    useMaterial3: true,
    appBarTheme: AppBarTheme(backgroundColor: Colors.blueGrey,),
    scaffoldBackgroundColor: const Color.fromARGB(255, 134, 173, 192),
    inputDecorationTheme: InputDecorationTheme(
     filled: true,
     fillColor: Colors.white,
    ),
   )

loadTypeDropdownMenu = DropdownMenu<String>(
  inputDecorationTheme: const InputDecorationTheme(
    fillColor: Colors.amber,
    filled: true,
    floatingLabelAlignment: FloatingLabelAlignment.center,
    floatingLabelBehavior: FloatingLabelBehavior.always,
    floatingLabelStyle: TextStyle( 
    color: Colors.red, 
    fontWeight: FontWeight.bold,         
    )
  ),
  initialSelection: defalutLoadType,
  label: const Text('Load Type'),
  dropdownMenuEntries: loadTypesEntries,
  onSelected: (String? loadType) {
    setState(() {
      selectedLoadType = loadType;
    });
  },
);

flutter dart
1个回答
0
投票

尝试下面的代码

DropdownButtonFormField<String>(
      decoration: InputDecoration(
          border: OutlineInputBorder(borderRadius: BorderRadius.circular(10)),
          focusedBorder: OutlineInputBorder(borderRadius: BorderRadius.circular(10),
          borderSide: BorderSide(color: Colors.grey),
         ),
         labelText: 'Load Type'),
         labelStyle: TextStyle(color: Colors.grey)
      value: selected,
      items: ["Load", "Pressure", "Work", "Pending", "Completed"]
          .map(
            (label) => DropdownMenuItem(
              child: Text(label),
              value: label,
            ),
          )
          .toList(),
      onChanged: (value) {
        setState(() => selected = value);
      },
    ),

结果:

  1. 选择前

  2. 选择后

© www.soinside.com 2019 - 2024. All rights reserved.