TextFieldComponent constructor
const
TextFieldComponent({
- dynamic onChanged()?,
- dynamic onSubmitted()?,
- String? initialText,
- AnsiColorType? foreground,
- AnsiColorType? background,
- TextComponentStyle? textStyle,
- String? placeHolder,
- TextComponentStyle? placeHolderStyle,
- TextComponentStyle? hoverStyle,
- bool obsecure = false,
- int maxWidth = 20,
Creates a text field component for user input.
The TextFieldComponent provides a configurable input field with support for styling, placeholders, text masking, and event callbacks.
Parameters:
onChanged: Callback triggered when the text content changes. Receives the current text value.onSubmitted: Callback triggered when the user presses Enter. Receives the final text value.initialText: The initial text content displayed in the field.foreground: The text color for user input.background: The background color of the text field.textStyle: Additional styling to apply to the entered text.placeHolder: Text displayed when the field is empty.placeHolderStyle: Styling to apply to the placeholder text.hoverStyle: Styling applied when the field is hovered or focused.obsecure: Iftrue, masks input characters (useful for passwords). Defaults tofalse.maxWidth: Maximum number of characters allowed in the field. Defaults to20.
Example:
TextFieldComponent(
initialText: 'Username',
foreground: Colors.white,
background: Colors.blue,
placeHolder: 'Enter your username...',
placeHolderStyle: TextComponentStyle(styles: {FontStyle.italic}),
maxWidth: 30,
onSubmitted: (value) => print('Submitted: $value'),
onChanged: (value) => print('Changed: $value'),
)
See also:
- TextComponentStyle for text styling options
- AnsiColorType for color implementations
Implementation
const TextFieldComponent({
this.onChanged,
this.onSubmitted,
this.initialText,
this.foreground,
this.background,
this.textStyle,
this.placeHolder,
this.placeHolderStyle,
this.hoverStyle,
this.obsecure = false,
this.maxWidth = 20,
});