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.

activar campo de texto utilizando botón, getX

24 Jul, 2023 Programación

Cómo activar el textField y hacer aparecer el teclado usando un botón o un GestureDetector, ya he creado el código, pero cuando hago clic en el botón o en el GestureDetector por segunda vez, el teclado no aparece y el cursor en el textField sigue ahí.

Estoy usando getX.

GestureDetector

GestureDetector(
      onTap: () {
        FocusScope.of(context).requestFocus(controller.textFieldFocus);
      },
      child: Container(
        // height: 25.0,
        margin: EdgeInsets.symmetric(horizontal: 20.0),
        padding:
            EdgeInsets.only(left: 5.0, right: 240.0, top: 5.0, bottom: 5.0),
        decoration: Ui.getBoxDecoration(
          color: Get.theme.primaryColor,
          border: Border.all(
            color: Color.fromRGBO(149, 151, 161, 1),
            width: 1.0,
          ),
          radius: 14.0,
        ),

        child: Text(
          "responder al comentario...",
          style: TextStyle(
            color: Color.fromRGBO(149, 151, 161, 1),
            fontFamily: 'Roboto',
            fontSize: 12,
            letterSpacing: 0,
            fontWeight: FontWeight.normal,
            height: 1,
          ),
        ),
      ),
    );

TextField

TextField(
                  controller: controller.textEditingController,
                  onSubmitted: (value) {
                    //
                  },
                  focusNode: controller.textFieldFocus, //usando getX
                  style: TextStyle(
                    color: Color.fromRGBO(149, 151, 161, 1),
                    fontFamily: 'Roboto',
                    fontSize: 12,
                    letterSpacing: 0,
                    fontWeight: FontWeight.normal,
                    height: 1,
                  ),
                  autofocus: false,
                  cursorColor: Get.theme.focusColor,
                  decoration: Ui.getInputDecoration(
                    hintText: "agregar un comentario...",
                  ),
                  keyboardType: TextInputType.multiline,
                  maxLines: null,
                  expands: true,
                ),
Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para activar el textField y mostrar el teclado usando un botón o GestureDetector y asegurarse de que funcione para clics posteriores, puedes hacer lo siguiente:

    1. Crea una función que establezca el enfoque en el textField usando el FocusNode:
    void setTextFieldFocus() {
    if (!controller.textFieldFocus.hasFocus) {
        FocusScope.of(context).requestFocus(controller.textFieldFocus);
    }
}
    1. Llama a esta función en el evento onTap del GestureDetector o en el evento onPressed del botón:
    GestureDetector(
    onTap: () {
        setTextFieldFocus();
    },
    ...
    1. Para asegurarte de que el textField se borre cuando pierde el enfoque, puedes agregar un evento onBlur al TextField:
    TextField(
    ...
    focusNode: controller.textFieldFocus,
    onBlur: () {
        controller.textEditingController.text = '';
    }
    ...

    Con estos cambios, la función setTextFieldFocus se llamará cada vez que se presione el botón o GestureDetector, sin importar si el textField ya tiene el enfoque o no. Además, el textField se borrará cuando pierda el enfoque, lo que facilitará la entrada de un nuevo comentario.

Comments are closed.