How to have a unique error message for two textfields - flutter

Question

Hi I have a little problem since a few days... I'm trying to find out how to make two fields display an error message at the same place.
I tried with a Formfield but it bugs me because the second textformfield falls in error since I have only one state. I also tried with a simple Formfield but I can't set my validator message in a variable and then display it in a padding.
Would you have an idea please?
Thanks in advance.
Example : I would like to display my error message instead of the Text widget "Error message".

Answer 1

I managed to solve your problem.
Take a look at this screenshot and code:
Screenshot -
Code:
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({super.key});
#override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
String _errorText = '';
final GlobalKey<FormState> _key = GlobalKey<FormState>();
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Form(
key: _key,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
height: 100,
width: 50,
child: TextFormField(
validator: (value) {
if (value == null || value.isEmpty) {
setState(() {
_errorText = 'Please enter some text';
});
}
return null;
},
),
),
const SizedBox(
width: 50,
),
SizedBox(
height: 100,
width: 50,
child: TextFormField(
validator: (value) {
if (value == null || value.isEmpty) {
setState(() {
_errorText = 'Please enter some text';
});
}
return null;
},
),
),
],
),
),
Text(_errorText),
ElevatedButton(
onPressed: () {
if (_key.currentState!.validate()) {}
},
child: const Text('Submit'),
),
],
),
),
),
);
}
}