Flutter中FormBuilderTextField的labelText左对齐

Question

我想像在第一个文本字段中那样左对齐第二个文本字段的 FormBuilderTextField 标签。当我为 prefixIcon 添加下拉菜单时，标签被推到了中心。我想把那个标签移到左边。

Padding(
  padding: EdgeInsets.only(top: 8, bottom: 8),
  child: FormBuilderTextField(
    controller: controller,
    name: name!,
    initialValue: initialValue,
    style: TextStyle(color: Colors.black),
    enabled: enabled,
    keyboardType: keyBoardType,
    decoration: InputDecoration(
      prefixIcon: Container(
        width: 120.0,
        child: FormBuilderDropdown(
          name: "countryList",
          iconSize: 0.0,
          decoration: InputDecoration(
            icon: null,
            labelStyle: TextStyle(
                color: enabled
                    ? Colors.black54
                    : Theme.of(context).disabledColor),
            contentPadding: EdgeInsets.all(8),
            enabledBorder: InputBorder.none,
          ),
          enabled: enabled,
          items: countries
              .map((Country country) => DropdownMenuItem(
                    value: country.id,
                    child: Row(
                      children: [
                        CachedNetworkImage(
                          width: 30,
                          height: 20,
                          imageUrl: country.photo!.path!,
                          imageBuilder: (context, imageProvider) =>
                              Container(
                            decoration: BoxDecoration(
                              image: DecorationImage(
                                  image: imageProvider, fit: BoxFit.fill),
                            ),
                          ),
                          placeholder: (context, url) =>
                              CircularProgressIndicator(),
                          errorWidget: (context, url, error) =>
                              Icon(Icons.error),
                        ),
                        SizedBox(
                          width: 10.0,
                        ),
                        Text("+${country.phoneCode}" ?? "")
                      ],
                    ),
                  ))
              .toList(),
        ),
      ),
      labelText: label,
      labelStyle: TextStyle(
          color:
              enabled ? Colors.black54 : Theme.of(context).disabledColor),
      contentPadding: EdgeInsets.all(16),
      focusedBorder: OutlineInputBorder(
        borderSide: BorderSide(color: Theme.of(context).primaryColor),
      ),
      border: new OutlineInputBorder(borderSide: new BorderSide()),
    ),
    validator: validator,
    obscureText: obscureText!,
  ),
);

Answer 1

使用 prefix 而不是 prefixIcon 它应该可以解决您的问题。

Flutter中FormBuilderTextField的labelText左对齐

Left Align the labelText of FormBuilderTextField in Flutter

flutter

flutter-form-builder