label property

Widget? label
final

Optional widget that describes the input field.

When the input field is empty and unfocused, the label is displayed on top of the input field (i.e., at the same location on the screen where text may be entered in the input field). When the input field receives focus (or if the field is non-empty), depending on floatingLabelAlignment, the label moves above, either vertically adjacent to, or to the center of the input field.

This can be used, for example, to add multiple TextStyle's to a label that would otherwise be specified using labelText, which only takes one TextStyle.

{@tool dartpad --template=stateless_widget_scaffold}

This example shows a TextField with a Text.rich widget as the label. The widget contains multiple Text widgets with different TextStyle's.

Widget build(BuildContext context) {
  return const Center(
    child: TextField(
      decoration: InputDecoration(
        label: Text.rich(
          TextSpan(
            children: <InlineSpan>[
              WidgetSpan(
                child: Text(
                  'Username',
                ),
              ),
              WidgetSpan(
                child: Text(
                  '*',
                  style: TextStyle(color: Colors.red),
                ),
              ),
            ],
          ),
        ),
      ),
    ),
  );
}

{@end-tool}

Only one of label and labelText can be specified.

Implementation

final Widget? label;