flutter_form_builder 下拉布局修改

Question

如何更改 flutter_form_builder DROPDOWN 的布局并获得类似于附加屏幕截图的结果（左侧的 labelText 和右侧的值）？我找到了如何更改库源代码，但这种方式看起来不对。我是 Flutter 框架的新手 :)。谢谢

Answer 1

flutter_form_builder 不会限制应用的布局。因此，您可以在行小部件中使用下拉菜单并实现类似的效果。

请注意，在您的情况下，您不需要在InputDecorarion 中设置labelText。

Row(
    children: <Widget>[
        Expanded(
            flex: 2,
            child: Text('Cycle'),
        ),
        Expanded(
            flex: 1,
            child: FormBuilderDropdown(
                attribute: 'cycle',
                decoration: InputDecoration(
                    border: InputBorder.none,
                    enabledBorder: InputBorder.none,
                ),
                hint: Text('Select Cycle'),
                items: ['7 Day', '14 Day', '21 Day']
                    .map((c) => DropdownMenuItem(
                        value: c,
                        child: Text('$c'),
                        ))
                    .toList(),
             ),
        ),
    ],
),

这是我能够实现的：

如果这不是您想要的，flutter_form_builder 有 FormBuilderCustomField，您可以使用它创建自己的自定义字段。