Form- custom textfield

readme.md

Form- custom textfield

Created with <3 with dartpad.dev.

main.dart

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Form(
            child: CustomFormField(
              autovalidateMode: AutovalidateMode.onUserInteraction,
              initialValue: "Salut la compagnie",
              inputDecoration: const InputDecoration(
                hintText: "Toto only",
                suffixIcon: Icon(Icons.catching_pokemon),
              ),
              validator: (value) {
                if (value?.toLowerCase() != "toto") return "No no !";
                return null;
              },
            ),
          ),
        ),
      ),
    );
  }
}

class CustomFormField extends FormField<String> {
  CustomFormField({
    super.key,
    this.inputDecoration,
    FormFieldValidator<String>? validator,
    AutovalidateMode? autovalidateMode,
    String? initialValue,
    FocusNode? focusNode,
  }) : super(
          validator: validator,
          initialValue: initialValue,
          autovalidateMode: autovalidateMode,
          builder: (FormFieldState<String> state) {
            return Builder(
              builder: (context) => TextField(
                focusNode: focusNode,
                decoration: inputDecoration?.copyWith(
                  errorText: state.errorText,
                  suffixIcon: state.hasError
                      ? Icon(
                          Icons.error,
                          color: Theme.of(context).colorScheme.error,
                        )
                      : inputDecoration.suffixIcon,
                ),
                onChanged: state.didChange,
              ),
            );
          },
        );

  final InputDecoration? inputDecoration;
}