单击后如何在按钮下方显示文本?

问题描述

用户单击后,我想在按钮下方显示一个文本(“请检查您的电子邮件”),并使文本字段不显示。在将电子邮件发送给用户之后,我尝试过使用它,但是它没有显示任何内容,然后我添加了setState,但仍然无法正常工作。请找到以下代码

Theme(
                  data: ThemeData(hintColor: Colors.red),child: Padding(
                    padding: EdgeInsets.only(top: 50),child: TextFormField(
                      validator: (val) =>
                          val.isEmpty ? 'Enter your email' : null,onChanged: (val) {
                        setState(() => email = val);
                      },cursorColor: Colors.purple,keyboardType: TextInputType.emailAddress,textInputAction: TextInputAction.done,style: TextStyle(color: Colors.black),decoration: Inputdecoration(
                        hintText: "Enter your email",enabledBorder: UnderlineInputBorder(
                          borderSide: BorderSide(
                            color: Colors.black38,),focusedBorder: UnderlineInputBorder(
                          borderSide: BorderSide(color: Colors.purple),//  when the TextFormField in focused
                        ),hintStyle:
                            TextStyle(fontSize: 12.0,color: Colors.black38),SizedBox(
                  height: 30,InkWell(
                  child: Container(
                    width: 160,height: 60,decoration: Boxdecoration(
                      gradient: LinearGradient(
                        colors: [
                          Color(0xffba68c8),Color(0xFF9c27b0),],borderRadius: BorderRadius.circular(6.0),BoxShadow: [
                        BoxShadow(
                          color: Color(0xFF6078ea).withOpacity(0.3),offset: Offset(0.0,8.0),blurRadius: 8.0,)
                      ],child: Material(
                      color: Colors.transparent,child: InkWell(
                        onTap: () async {
                          if (_formKey.currentState.validate()) {
                            FirebaseAuth.instance
                                .sendPasswordResetEmail(email: email)
                                .then((_) {
                              setState(() {
                                Center(child: Text('Check your email'));
                              });
                            });
                          }
                        },child: Center(
                          child: Text(
                            'SEND EMAIL',style: TextStyle(
                              color: Colors.white,fontFamily: 'Anton',fontSize: 18.0,letterSpacing: 1.0,)

解决方法

在setState()中使用小部件将无济于事,因为如果您观察代码,则会发现您只是在setState()中初始化小部件

要向用户显示消息,可以在setState()中使用SnackBar

小吃栏示例:

Scaffold.of(context).showSnackBar(SnackBar(
      content: Text("Your message text"),));

请注意:为快餐栏设置一个单独的方法并从setState()调用它总是很好。