Text Field

class DefaultTextField extends StatefulWidget {
  const DefaultTextField({super.key});
 
  @override
  State<DefaultTextField> createState() => _DefaultTextFieldState();
}
 
class _DefaultTextFieldState extends State<DefaultTextField> {
  final TextEditingController _controller = TextEditingController();
 
  @override
  void initState() {
    super.initState();
  }
 
  @override
  Widget build(BuildContext context) => FTextField(
    controller: _controller,
    label: const Text('Username'),
    hint: 'JaneDoe',
    description: const Text('Please enter your username.'),
    maxLines: 1,
  );
 
  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }
}

FTextField(
  controller: _controller, // TextEditingController
  label: const Text('Username'),
  hint: 'JaneDoe',
  description: const Text('Please enter your username.'),
  maxLines: 1,
);

FTextField(
  controller: _controller, // TextEditingController
  label: const Text('Username'),
  hint: 'JaneDoe',
  description: const Text('Please enter your username.'),
  maxLines: 1,
  enabled: false,
);

class ClearableTextField extends StatefulWidget {
  @override
  State<ClearableTextField> createState() => ClearableTextFieldState();
}
 
class ClearableTextFieldState extends State<ClearableTextField> {
  late final TextEditingController _controller = TextEditingController(text: 'MyUsername');
 
  @override
  Widget build(BuildContext context) => Padding(
    padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 30),
    child: FTextField(
      controller: _controller,
      label: const Text('Username'),
      hint: 'JaneDoe',
      description: const Text('Please enter your username.'),
      maxLines: 1,
      clearable: (value) => value.text.isNotEmpty,
    ),
  );
}

FTextField.email(
  initialValue: 'jane@doe.com',
  controller: _controller, // TextEditingController
);

FTextField.password(
  controller: _controller, // TextEditingController
  obscuringCharacter: '*',
);

FTextField.multiline(
  controller: _controller, // TextEditingController
  label: const Text('Leave a review'),
  maxLines: 4,
);

class LoginForm extends StatefulWidget {
  const LoginForm({super.key});
 
  @override
  State<LoginForm> createState() => _LoginFormState();
}
 
class _LoginFormState extends State<LoginForm> {
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
  final TextEditingController _emailController = TextEditingController();
  final TextEditingController _passwordController = TextEditingController();
 
  @override
  void initState() {
    super.initState();
  }
 
  @override
  void dispose() {
    _emailController.dispose();
    _passwordController.dispose();
    super.dispose();
  }
 
  @override
  Widget build(BuildContext context) => Form(
    key: _formKey,
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        FTextField.email(
          controller: _emailController,
          hint: 'janedoe@foruslabs.com',
          autovalidateMode: AutovalidateMode.onUserInteraction,
          validator: (value) => (value?.contains('@') ?? false) ? null : 'Please enter a valid email.',
        ),
        const SizedBox(height: 10),
        FTextField.password(
          controller: _passwordController,
          autovalidateMode: AutovalidateMode.onUserInteraction,
          validator: (value) => 8 <= (value?.length ?? 0) ? null : 'Password must be at least 8 characters long.',
        ),
        const SizedBox(height: 20),
        FButton(
          child: const Text('Login'),
          onPress: () {
            if (!_formKey.currentState!.validate()) {
              return; // Form is invalid.
            }
 
            // Form is valid, do something.
          },
        ),
      ],
    ),
  );
}