Home > Mobile >  ElevatedButton doesn't react after clicking in Flutter
ElevatedButton doesn't react after clicking in Flutter

Time:08-19

i have two TextFormFields (name and age). After typing something in inputs and clicking 'send' nothing happens. Here's my code:

my edit_page

class UserForm extends StatefulWidget {
  const UserForm({Key? key}) : super(key: key);

  @override
  State<UserForm> createState() => _UserFormState();
}

class _UserFormState extends State<UserForm> {
  final formKey = GlobalKey<FormState>();
  final nameController = TextEditingController();
  final ageController = TextEditingController();

  @override
  void dispose() {
    super.dispose();
    nameController.dispose();
    ageController.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Form(
      key: formKey,
      child: Padding(
        padding: const EdgeInsets.all(10.0),
        child: Column(
          children: [
            TextFormField(
              decoration: const InputDecoration(),
              controller: nameController,
            ),
            TextFormField(
              decoration: const InputDecoration(),
              controller: ageController,
            ),
            ElevatedButton(
              child: const Text('Send'),
              onPressed: () {
                context.read<UserProvider>().updateUserInfo(
                      name: nameController.text,
                      age: ageController.text,
                    );
              },
            )
          ],
        ),
      ),
    );
  }
}

profile page (here is the code who should display data from that textfields:

Consumer<UserProvider>(builder: (context, user, _) {
            return Text('Name: ${user.data.name}, Age: ${user.data.age}');
          })

my class which creates user:

class UserProvider extends ChangeNotifier {
  final _user = User();

  User get data => _user;

  void updateUserInfo({String? name, String? age}) {
    _user
      ..name = name ?? ''
      ..age = age ?? '';

    notifyListeners();
  }
}

class User {
  String name = '';
  String age = '';
}

i also have these lines in my main.dart file in Stateless Widget:

 @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (context) => UserProvider(),

It looks like i forgot about something but i really don't know where.

CodePudding user response:

You need to define the Button style. Code should look similar to this:

 ElevatedButton(
                  style: ButtonStyle(
                      overlayColor: myColor(tabicon, containerback)),
                  onPressed: () {
                    authController.signOut();
                  },
                  child: Text('Logout'),
                ),

and here is my "myColor" method:

  myColor(Color color, Color colorPressed) {
    final myColor = (Set<MaterialState> states) {
      if (states.contains(MaterialState.pressed)) {
        return colorPressed;
      } else {
        return color;
      }
    };
    return MaterialStateProperty.resolveWith(myColor);
  }

but if you just need a quick generalized answer here is another solution:

  ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    primary: Colors.deepPurpleAccent, // background
                    onPrimary: Colors.amber,
                    // foreground
                  ),
                  onPressed: () {
                    authController.signOut();
                  },
                  child: Text('Logout'),
                ),

CodePudding user response:

It's really weird i copy this code, and its working for me. Maybe try flutter clean -> flutter pub get, or some of your imports...

MyConsumer:

 class UserPage extends StatelessWidget {
      const UserPage({Key? key}) : super(key: key);
    
     @override
          Widget build(BuildContext context) {
            return Column(
              children: [
                Consumer<UserProvider>(builder: (context, user, _) {
                  return Text('Name: ${user.data.name}, Age: ${user.data.age}');
                })
              ],
            );
          }
        }

My FormSubmit ElevatedButton:

 ElevatedButton(
                    child: const Text('Send'),
                    onPressed: () {
                      context.read<UserProvider>().updateUserInfo(
                            name: nameController.text,
                            age: ageController.text,
                          );
                      Navigator.push(
                          context,
                          MaterialPageRoute(
                              builder: (context) => const UserPage()));
                    },
                  )

My main.dart:

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (context) => UserProvider(),
      child: MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: const UserForm(),
      ),
    );
  }
}

Trying too with consumer under form in the same page, it also works....

  • Related