es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

  • es.davy.ai/
  • Programación /
  • Moviendo la decoración de entrada hacia la izquierda en el widget InternationalPhoneNumberInput.

Moviendo la decoración de entrada hacia la izquierda en el widget InternationalPhoneNumberInput.

31 Jul, 2023 Programación

Quiero mover la decoración de entrada a la izquierda en el widget InternationalPhoneNumberInput. ¿Cómo puedo hacer esto? La imagen 1 muestra lo que quiero lograr, la imagen 2 muestra en qué estoy atascado y este es mi código actual para el widget.

InternationalPhoneNumberInput(
    textStyle: black14RegularTextStyle,
    autoValidateMode: AutovalidateMode.disabled,
    selectorTextStyle: black16MediumTextStyle,
    initialValue: number,
    textFieldController: controller,
    inputBorder: InputBorder.none,
    inputDecoration: InputDecoration(
        hintText: 'Número de teléfono',
        hintStyle: black14RegularTextStyle,
        border: InputBorder.none,
        isDense: true,  ///añadido
    ),
    selectorConfig: SelectorConfig(selectorType: PhoneInputSelectorType.DIALOG),
    onInputChanged: (PhoneNumber number) {
        print(number.phoneNumber);
    },
),

Imagen 1

Imagen 2

Enlace del paquete: https://pub.dev/packages/intlphone_number_input/example

Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para mover la decoración de entrada hacia la izquierda en el widget InternationalPhoneNumberInput, puedes agregar la propiedad contentPadding a la propiedad inputDecoration del widget y establecerla en EdgeInsets.only(left: cantidad de píxeles). Por ejemplo, para mover la decoración de entrada 20 píxeles a la izquierda, puedes agregar la siguiente línea a tu código:

    contentPadding: EdgeInsets.only(left: 20.0),

    Tu código actualizado se verá así:

    InternationalPhoneNumberInput(
  textStyle: black14RegularTextStyle,
  autoValidateMode: AutovalidateMode.disabled,
  selectorTextStyle: black16MediumTextStyle,
  initialValue: number,
  textFieldController: controller,
  inputBorder: InputBorder.none,
  inputDecoration: InputDecoration(
    hintText: 'Número de teléfono',
    hintStyle: black14RegularTextStyle,
    border: InputBorder.none,
    isDense: true,
    contentPadding: EdgeInsets.only(left: 20.0),  // se agregó esta línea
  ),
  selectorConfig: SelectorConfig(selectorType: PhoneInputSelectorType.DIALOG),
  onInputChanged: (PhoneNumber number) {
    print(number.phoneNumber);
  },
),

    Esto debería mover la decoración de entrada hacia la izquierda en el widget, similar a la primera imagen que proporcionaste.

Comments are closed.