TogieTextField

Este widget muestra un campo de texto altamente configurable. Permite definir el tipo de teclado, controlar la edición, manejar errores y utilizar un date picker en caso de campos de fecha. Además, ofrece opciones para personalizar colores, estilos y comportamiento según se requiera.

Importación

import 'package:togie/widgets/general/togie_text_field.dart';

Constructor:

const TogieTextField({
  super.key,
  this.label = "",
  this.controller,
  this.keyboardType = TextInputType.text,
  this.onEditingComplete,
  this.onChange,
  this.focusNode,
  this.enabledColor,
  this.disabledColor,
  this.backgroundColor,
  this.maxLines = 1,
  this.textAlignVertical,
  this.alignLabelWithHint,
  this.readOnly = false,
  this.enabled = true,
  this.textCapitalization = TextCapitalization.none,
  this.errorMessage = "",
  this.datePickerMode = TogieDatePickerMode.dateTime,
  this.onDatePicker,
  this.onDatePickerRange,
  this.initialDate,
  this.startDate,
  this.endDate,
  this.minDate,
  this.maxDate,
  this.isFilter = false,
  this.autofillHints,
  this.inputFormatters,
});

Parámetro del constructor:

Parámetro	Tipo	Descripción
`label`	String	Texto que se muestra como etiqueta del campo.
`controller`	TextEditingController?	Controlador para manejar el contenido del campo de texto.
`keyboardType`	TextInputType	Tipo de teclado a utilizar (por ejemplo, texto, número, fecha, etc.).
`onEditingComplete`	void Function()?	Callback que se ejecuta cuando se completa la edición.
`onChange`	void Function(String)?	Callback que se ejecuta al cambiar el texto del campo.
`focusNode`	FocusNode?	Nodo de enfoque para gestionar el foco del campo.
`enabledColor`	Color?	Color del texto cuando el campo está habilitado.
`disabledColor`	Color?	Color del texto cuando el campo está deshabilitado.
`backgroundColor`	Color?	Color de fondo del campo de texto.
`maxLines`	int?	Número máximo de líneas que se pueden mostrar en el campo.
`textAlignVertical`	TextAlignVertical?	Alineación vertical del texto dentro del campo.
`alignLabelWithHint`	bool?	Determina si la etiqueta se alinea con la pista de texto.
`readOnly`	bool	Indica si el campo es de solo lectura.
`enabled`	bool	Determina si el campo está habilitado para la entrada.
`textCapitalization`	TextCapitalization	Controla la capitalización del texto ingresado.
`errorMessage`	String	Mensaje de error a mostrar si ocurre alguna validación.
`datePickerMode`	TogieDatePickerMode	Modo del date picker (por ejemplo, fecha, hora o fecha y hora).
`onDatePicker`	void Function(DateTime?)?	Callback para manejar la selección de una fecha.
`onDatePickerRange`	void Function(DateTimeRange?)?	Callback para manejar la selección de un rango de fechas.
`initialDate`	DateTime?	Fecha inicial para el date picker.
`startDate`	DateTime?	Fecha de inicio para el date picker en modo rango.
`endDate`	DateTime?	Fecha final para el date picker en modo rango.
`minDate`	DateTime?	Fecha mínima permitida en el date picker.
`maxDate`	DateTime?	Fecha máxima permitida en el date picker.
`isFilter`	bool	Determina si el campo actúa como un filtro, volviéndose de solo lectura.
`autofillHints`	Iterable<String>?	Sugerencias de autocompletado para el campo.
`inputFormatters`	List<TextInputFormatter>?	Lista de formateadores para controlar el formato del texto ingresado.

Ejemplo de uso:

TogieTextField(
  label: "Ingrese su fecha de nacimiento",
  keyboardType: TextInputType.datetime,
  onDatePicker: (selectedDate) {
    // Lógica para manejar la fecha seleccionada
  },
  controller: TextEditingController(),
  backgroundColor: Colors.white,
  enabledColor: Colors.black,
  errorMessage: "",
)

TogieTextField