Search code examples
flutterdartfont-sizetextformfield

How can we change the font Size of the error message of TextFormField


` TextFormField( maxLength: 50,

              decoration: const InputDecoration(label: Text('Name')),
              keyboardType: TextInputType.text,
              validator: (value) {
                if (value == null ||
                    value.isEmpty ||
                    value.trim().length <= 1 ||
                    value.trim().length > 50) {
                  return "Must be between 1 and 50 characters";
                }
                return null;
              },
            ),`

Error message font size


Solution

  • You use the errorStyle parameter of the inputdecorationtheme:

    import 'package:flutter/material.dart';
    
    void main() => runApp(const MyApp());
    
    class MyApp extends StatelessWidget {
      const MyApp({super.key});
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          theme: ThemeData(
            inputDecorationTheme: const InputDecorationTheme(
              errorStyle: TextStyle(
                color: Colors.red,
                fontSize: 32,
              ),
            ),
          ),
          home: const MyForm(),
        );
      }
    }
    
    class MyForm extends StatefulWidget {
      const MyForm({super.key});
    
      @override
      _MyFormState createState() => _MyFormState();
    }
    
    class _MyFormState extends State<MyForm> {
      final _formKey = GlobalKey<FormState>();
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Center(
            child: Padding(
              padding: const EdgeInsets.all(32),
              child: Form(
                key: _formKey,
                child: Column(
                  children: [
                    TextFormField(
                      validator: (value) {
                        if (value!.isEmpty) {
                          return 'Please enter some text';
                        }
                        return null; // Indicates no error
                      },
                    ),
                    ElevatedButton(
                      onPressed: () {
                        if (_formKey.currentState!.validate()) {
                          // Form is valid, do something
                        }
                      },
                      child: const Text('Submit'),
                    ),
                  ],
                ),
              ),
            ),
          ),
        );
      }
    }