(Flutter和Dart)单击按钮或单选按钮可清除文本框

3duebb1j  于 2022-11-30  发布在  Flutter
关注(0)|答案(2)|浏览(178)

我正在写一个获取用户详细信息的flutter程序。不幸的是,即使我的文本编辑控制器设置正确。每次我点击一个按钮或单选按钮,文本框立即被清除,即使我没有任何清除它们的代码
下面是代码

import 'package:flutter/material.dart';
import 'NavDrawer.dart';

class proFile extends StatelessWidget {
  static const String routeName = '/profile';

  const proFile({super.key});

  @override
  build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text("Profile"),
        ),
        drawer: const NavDrawer(),
        body: ProfileScreen());
  }
}

class ProfileScreen extends StatefulWidget {
  const ProfileScreen({super.key});

  @override
  _ProfileScreenState createState() {
    return _ProfileScreenState();
  }
}

enum Gender { male, female }
String getGender="";
class _ProfileScreenState extends State<ProfileScreen> {
  @override
  Gender? _gender = Gender.male;

  Widget build(BuildContext context1) {
    TextEditingController getUsername = TextEditingController();
    TextEditingController getFName = TextEditingController();
    TextEditingController getLName = TextEditingController();
    TextEditingController getPass = TextEditingController();
    TextEditingController getCPass = TextEditingController();
    TextEditingController getEmail = TextEditingController();
    TextEditingController var5 = TextEditingController();

    return SingleChildScrollView(

      child: Column(

        children: <Widget>[
          Row(
            children: <Widget>[
              Container(
                margin: EdgeInsets.all(20),
                child: Text("Enter Your Profile",
                    style: TextStyle(fontSize: 40, color: Colors.black)),
              ),
            ],
          ),
          //row2
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 50,
                width: 500,
                margin: EdgeInsets.all(10),
                child: TextField(
                    keyboardType: TextInputType.text,
                    controller: getUsername,
                    decoration: InputDecoration(
                        border: const OutlineInputBorder(
                            borderSide:
                                const BorderSide(color: Colors.lightGreen)),
                        labelText: "Enter Your UserName")),
              )
            ],
          ),
          //row3
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 50,
                width: 500,
                margin: EdgeInsets.all(10),
                child: TextField(

                    controller: getFName,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        border: const OutlineInputBorder(
                            borderSide:
                                const BorderSide(color: Colors.lightGreen)),
                        labelText: "Enter Your First Name")),
              )
            ],
          ),
          //row4
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 50,
                width: 500,
                margin: EdgeInsets.all(10),
                child: TextField(

                    controller: getLName,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        border: const OutlineInputBorder(
                            borderSide:
                                const BorderSide(color: Colors.lightGreen)),
                        labelText: "Enter Your Last Name")),
              )
            ],
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 50,
                width: 500,
                margin: EdgeInsets.all(10),
                child: TextField(

                    controller: getPass,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        border: const OutlineInputBorder(
                            borderSide:
                                const BorderSide(color: Colors.lightGreen)),
                        labelText: "Enter Your Password")),
              )
            ],
          ),

          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 50,
                width: 500,
                margin: EdgeInsets.all(10),
                child: TextField(

                    controller: getCPass,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        border: const OutlineInputBorder(),
                        labelText: "Confirm Your Password")),
              )
            ],
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 50,
                width: 500,
                margin: EdgeInsets.all(10),
                child: TextField(

                    controller: getEmail,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        border: const OutlineInputBorder(),
                        labelText: "Enter Your Email")),
              )
            ],
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 50,
                width: 400,
                child:ListTile(
                  title: const Text('Male'),
                  leading: Radio(
                    value: Gender.male,
                    groupValue: _gender,
                    onChanged: (Gender? value) {
                      setState(() {
                        _gender = value;
                      });
                    },
                  ),
                ),
              ),
              Container(
                height: 50,
                width: 400,
                child:ListTile(
                  title: const Text('Female'),
                  leading: Radio(
                    value: Gender.female,
                    groupValue: _gender,
                    onChanged: (Gender? value) {
                      setState(() {
                        _gender = value;

                      });
                    },
                  ),
                ),
              )

            ],
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                height: 100,
                width: 500,

                margin: EdgeInsets.all(1),
                child: TextField(
                    maxLines: 8,

                    controller: var5,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        border: const UnderlineInputBorder(borderSide:
                        const BorderSide(color: Colors.lightGreen)),
                        labelText: "")),
              )
            ],
          ),
          Row(
              //button
              children: <Widget>[
                const SizedBox(height: 55.0, width: 20.0),

                SizedBox(

                  width: 250.0,
                  height: 70,
                  child: ElevatedButton(
                    child: const Text("Submit!"),
                    style: ElevatedButton.styleFrom(
                        backgroundColor: Colors.green,

                        padding: EdgeInsets.all(20),
                        shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(20))),
                    onPressed: () {
                      setState(() {
                        String name = getUsername.text;
                        String fname = getFName.text;
                        String lname = getLName.text;
                        String pass = getPass.text;
                        String cpass = getCPass.text;
                        String email = getEmail.text;

                        var5.text="Inputted Result:\nName=$name\nFirst Name=$fname\nLast Name=$lname\nEmail=$email";
                      });
                    },
                  ),
                ),
              ]),

        ],
      ),
    );
  }
}

我尝试清除单选按钮,看看它是否是问题的根源,但它仍然发生在按钮上

6yjfywim

6yjfywim1#

这是因为您正在调用setState()。
每次调用setState时()您要求flutter检查更改并重建UI(小部件树)。因此,在您的情况下,您已设置状态(),这就是为什么UI会被重建,字段会被清除。想想如果你刷新浏览器,但没有保存到任何地方,表单会发生什么。如果你想save_gender =可以在不使用setState()情况下完成此操作。
提交按钮应该存储并验证字段中的所有内容,然后根据您的后续操作调用setState()。
我强烈推荐使用Form & FormField来完成您要完成的任务,因为这样可以更有效地维护状态。
也看看here

92dk7w1h

92dk7w1h2#

将按钮onPressed(){}代码替换为

var5.text ="Inputted Result:\nName=${getUsername.text}\nFirst Name=${getFName.text}\nLast Name=${getLName.text}\nEmail=${getEmail.text}";

相关问题