Flutter Text重新恢复（在设置状态后）

huangapple
go评论120阅读模式
英文:

Flutter Text Reverting Back (after set state)

问题

我基本上在我的应用程序上有一个编辑名称的功能（目前是硬编码的），允许用户更改他们的名称。但是，名称在页面加载之前被获取，所以我在一个未来生成器类型的小部件中执行了这个操作。不幸的是，名称更改本身是有效的，但当我再次回到文本字段并尝试再次更改名称时，名称会恢复到旧的状态。下面是一些屏幕截图，展示了我的意思。

在我尝试更改名称之前：[![Before I tried to change the name][1]][1]

当我更改了名称：[![When I changed the name][2]][2]

恢复为'BOB'![![What I want fixed][3]][3]

以下是我的代码（非常感谢！我已经在这个上面工作了好几天！）：

  1. class ProfileInfo extends StatefulWidget {
  2.   String? name;
  3.   String? email;
  5.   ProfileInfo({this.name, this.email});
  7.   @override
  8.   _ProfileInfoState createState() => _ProfileInfoState();
  9. }
  11. class _ProfileInfoState extends State<ProfileInfo> {
  12.   var nameController = TextEditingController();
  14.   void updateName(String newName) async {
  15.     SharedPreferences prefs = await SharedPreferences.getInstance();
  16.     prefs.setString('name', newName);
  18.     setState(() {
  19.       nameController.text = newName;
  20.       widget.name = newName;
  21.     });
  22.   }
  24.   void _showEditNameDialog(BuildContext context) {
  25.     // Set the nameController.text to the current name
  26.     nameController.text = widget.name ?? '';
  28.     showDialog(
  29.       context: context,
  30.       builder: (BuildContext context) {
  31.         return AlertDialog(
  32.           title: Text('Edit Name'),
  33.           content: TextField(
  34.             controller: nameController,
  35.             decoration: InputDecoration(hintText: 'Enter your name'),
  36.           ),
  37.           actions: <Widget>[
  38.             TextButton(
  39.               onPressed: () {
  40.                 Navigator.of(context).pop();
  41.               },
  42.               child: Text('Cancel'),
  43.             ),
  44.             ElevatedButton(
  45.               onPressed: () {
  46.                 // Save the edited name if needed
  47.                 updateName(nameController.text);
  48.                 Navigator.of(context).pop();
  49.               },
  50.               child: Text('Save'),
  51.             ),
  52.           ],
  53.         );
  54.       },
  55.     );
  56.   }
  58.   void redirtohome() async {
  59.     var t = await getQuote();
  60.     Navigator.of(context).pushReplacement(
  61.       MaterialPageRoute(
  62.         fullscreenDialog: true,
  63.         builder: (context) => home_page(quotes: t),
  64.       ),
  65.     );
  66.   }
  68.   @override
  69.   Widget build(BuildContext context) {
  70.     Size size = MediaQuery.of(context).size;
  71.     return Column(
  72.       children: [
  73.         SizedBox(
  74.             width: size.width * .9,
  75.             child: Row(
  76.               children: [
  77.                 InkWell(
  78.                   onTap: Navigator.of(context).pop,
  79.                   child: Image.asset(
  80.                     "assets/images/whitebackarrow.png",
  81.                     width: size.width * .05,
  82.                   ),
  83.                 ),
  84.                 SizedBox(width: 10),
  85.                 Text(
  86.                   'Edit Profile',
  87.                   style: TextStyle(color: Colors.white, fontSize: 20),
  88.                 ),
  89.                 Spacer(),
  90.                 SizedBox(
  91.                   width: size.width * .3,
  92.                   height: size.height * .065,
  93.                   child: ElevatedButton(
  94.                     style: ElevatedButton.styleFrom(
  95.                       shape: RoundedRectangleBorder(
  96.                         borderRadius: BorderRadius.circular(20),
  97.                       ),
  98.                       backgroundColor: Colors.transparent,
  99.                       shadowColor: Colors.transparent,
  100.                     ),
  101.                     onPressed: () {
  102.                       redirtohome();
  103.                     },
  104.                     child: Text(
  105.                       'JustLift',
  106.                       style: TextStyle(
  107.                         color: Colors.white,
  108.                         fontSize: 16.0,
  109.                         fontWeight: FontWeight.bold,
  110.                       ),
  111.                     ),
  112.                   ),
  113.                 ),
  114.               ],
  115.             )),
  116.         SizedBox(height: 10),
  117.         SizedBox(height: 10),
  118.         Container(
  119.           height: size.height * 0.3,
  120.           width: size.width * .9,
  121.           child: Stack(
  122.             alignment: Alignment.center,
  123.             children: <Widget>[
  124.               Icon(
  125.                 Icons.circle,
  126.                 color: Color(0xff11b779),
  127.                 size: size.height * 0.3,
  128.               ),
  129.               Text(
  130.                 widget.name!.length >= 2
  131.                     ? widget.name!.substring(0, 2).toUpperCase()
  132.                     : widget.name!,
  133.                 style: TextStyle(
  134.                     fontSize: size.height * 0.13,
  135.                     color: Colors.white,
  136.                     fontWeight: FontWeight.bold),
  137.               ),
  138.             ],
  139.           ),
  140.         ),
  141.         SizedBox(height: 10),
  142.         Container(
  143.           width: size.width * .9,
  144.           height: 30,
  145.           color: Colors.grey.withOpacity(.14),
  146.           padding: EdgeInsets.only(top: 4, left: 10),
  147.           child: Text(
  148.             'NAME',
  149.             style: TextStyle(
  150.               fontSize: 18,
  151.               color: Colors.grey.withOpacity(.8),
  152.               fontWeight: FontWeight.bold,
  153.             ),
  154.           ),
  155.         ),
  156.         Container(
  157.             width: size.width * .9,
  158.             child: TextButton(
  159.                 onPressed: () {
  160.                   _showEditNameDialog(context);
  161.                 },
  162.                 child: Row(children: [
  163.                   Text(
  164.                     widget.name!,
  165.                     style: const TextStyle(
  166.                       color: Color(0xFFCECECE),
  167.                       fontSize: 18,
  168.                       fontWeight: FontWeight.bold,
  169.                     ),
  170.                   ),
  171.                   Spacer(),
  172.                   Icon(Icons.edit, color: Color(0xFFCECECE)),
  173.                 ]))),
  174.         Container(
  175.           width: size.width * .9,
  176.           height: 30,
  177.           color: Colors.grey.withOpacity(.14),
  178.           padding: EdgeInsets.only(top: 4, left: 10),
  179.           child: Text(
  180.             'EMAIL',
  181.             style: TextStyle(
  182.               fontSize: 18,
  183.               color: Colors.grey.withOpacity(.8),
  184.               fontWeight: FontWeight.bold,
  185.             ),
  186.           ),
  187.         ),
  188.         Container(
  189.           width: size.width * .9,
  190.           padding: EdgeInsets.all(10),
  191.           child: Text(
  192.             widget.email!,
  193.             style: const TextStyle(
  194.               color: Color(0xFFCECECE),
  195.               fontSize: 18,
  196.               fontWeight: FontWeight.bold,
  197.             ),
  198.           ),
  199.         )
  200.       ],
  201.     );
  202.   }
  203. }
  205. class EditProfilePage extends StatefulWidget {
  206.   @override
  207.   _EditProfilePageState createState() => _EditProfilePageState();
  208. }
  210. class _EditProfilePageState extends State<EditProfilePage> {
  211.   String? name = '';
  212.   String? email = '';
  214.   @override
  215.   void initState() {
  216.     super.initState();
  217.     getInfo();
  218.   }
  220.   Future<void> getInfo() async {
  221.     SharedPreferences prefs = await SharedPreferences.getInstance();
  222.     setState(() {
  223.       name = prefs.getString('name');
  224.       email = prefs.getString('email');
  225.     });
  226.   }
  228.   @override
  229.   Widget build(BuildContext context) {
  230.     if (name == null || email == null) {
  231.       return Center(
  232.         child: SizedBox(
  233.           height: 50.0,
  234.           width: 50.0,
  235.           child: CircularProgressIndicator(),
  236.         ),
  237.       );
  238.     } else {
  239.       return buildPage(context);
  240.     }
  241.   }
  243.   @override
  244.   Widget buildPage(BuildContext context) {
  245.     Size size = MediaQuery.of(context).size;
  246.     double height = MediaQuery.of(context).viewPadding.top;
  247.     return Scaffold
  249. <details>
  250. <summary>英文:</summary>
  252. I basically have an edit name feature on my app, (for now hardcoded), that allows users to change their name. However the name is fetched before the page loads, so I do that in a future builder type widget. Unfortunatly **the name changing itself works, but when I go back into the text field and attempt to change the name again, the name reverts back to its old self. here are some screenshots showing what I mean**
  254. Before I tried to change the name: [![Before I tried to change the name][1]][1]
  256. When I changed the name: [![When I changed the name][2]][2]
  258. REVERTED BACK TO &#39;BOB&#39;![![What I want fixed][3]][3]
  260. Here is my code (THANK YOU SOOO MUCH! I&#39;VE BEEN WORKING ON THIS FOR DAYS!!!!):

class ProfileInfo extends StatefulWidget {
String? name;
String? email;

ProfileInfo({this.name, this.email});

@override
_ProfileInfoState createState() => _ProfileInfoState();
}

class _ProfileInfoState extends State<ProfileInfo> {
var nameController = TextEditingController();

void updateName(String newName) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs.setString('name', newName);

  1. setState(() {
  2. nameController.text = newName;
  3. widget.name = newName;
  4. });

}

void _showEditNameDialog(BuildContext context) {
// Set the nameController.text to the current name
nameController.text = widget.name ?? '';

  1. showDialog(
  2. context: context,
  3. builder: (BuildContext context) {
  4. return AlertDialog(
  5. title: Text(&#39;Edit Name&#39;),
  6. content: TextField(
  7. controller: nameController,
  8. decoration: InputDecoration(hintText: &#39;Enter your name&#39;),
  9. ),
  10. actions: &lt;Widget&gt;[
  11. TextButton(
  12. onPressed: () {
  13. Navigator.of(context).pop();
  14. },
  15. child: Text(&#39;Cancel&#39;),
  16. ),
  17. ElevatedButton(
  18. onPressed: () {
  19. // Save the edited name if needed
  20. updateName(nameController.text);
  21. Navigator.of(context).pop();
  22. },
  23. child: Text(&#39;Save&#39;),
  24. ),
  25. ],
  26. );
  27. },
  28. );

}

void redirtohome() async {
var t = await getQuote();
Navigator.of(context).pushReplacement(
MaterialPageRoute(
fullscreenDialog: true,
builder: (context) => home_page(quotes: t),
),
);
}

@override
Widget build(BuildContext context) {
Size size = MediaQuery.of(context).size;
return Column(
children: [
SizedBox(
width: size.width * .9,
child: Row(
children: [
InkWell(
onTap: Navigator.of(context).pop,
child: Image.asset(
"assets/images/whitebackarrow.png",
width: size.width * .05,
),
),
SizedBox(width: 10),
Text(
'Edit Profile',
style: TextStyle(color: Colors.white, fontSize: 20),
),
Spacer(),
SizedBox(
width: size.width * .3,
height: size.height * .065,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
backgroundColor: Colors.transparent,
shadowColor: Colors.transparent,
),
onPressed: () {
redirtohome();
},
child: Text(
'JustLift',
style: TextStyle(
color: Colors.white,
fontSize: 16.0,
fontWeight: FontWeight.bold,
),
),
),
),
],
)),
SizedBox(height: 10),
SizedBox(height: 10),
Container(
height: size.height * 0.3,
width: size.width * .9,
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Icon(
Icons.circle,
color: Color(0xff11b779),
size: size.height * 0.3,
),
Text(
widget.name!.length >= 2
? widget.name!.substring(0, 2).toUpperCase()
: widget.name!,
style: TextStyle(
fontSize: size.height * 0.13,
color: Colors.white,
fontWeight: FontWeight.bold),
),
],
),
),
SizedBox(height: 10),
Container(
width: size.width * .9,
height: 30,
color: Colors.grey.withOpacity(.14),
padding: EdgeInsets.only(top: 4, left: 10),
child: Text(
'NAME',
style: TextStyle(
fontSize: 18,
color: Colors.grey.withOpacity(.8),
fontWeight: FontWeight.bold,
),
),
),
Container(
width: size.width * .9,
child: TextButton(
onPressed: () {
_showEditNameDialog(context);
},
child: Row(children: [
Text(
widget.name!,
style: const TextStyle(
color: Color(0xFFCECECE),
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
Spacer(),
Icon(Icons.edit, color: Color(0xFFCECECE)),
]))),
Container(
width: size.width * .9,
height: 30,
color: Colors.grey.withOpacity(.14),
padding: EdgeInsets.only(top: 4, left: 10),
child: Text(
'EMAIL',
style: TextStyle(
fontSize: 18,
color: Colors.grey.withOpacity(.8),
fontWeight: FontWeight.bold,
),
),
),
Container(
width: size.width * .9,
padding: EdgeInsets.all(10),
child: Text(
widget.email!,
style: const TextStyle(
color: Color(0xFFCECECE),
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
)
],
);
}
}

class EditProfilePage extends StatefulWidget {
@override
_EditProfilePageState createState() => _EditProfilePageState();
}

class _EditProfilePageState extends State<EditProfilePage> {
String? name = '';
String? email = '';

@override
void initState() {
super.initState();
getInfo();
}

Future<void> getInfo() async {
SharedPreferences prefs = await SharedPreferences.getInstance();
setState(() {
name = prefs.getString('name');
email = prefs.getString('email');
});
}

@override
Widget build(BuildContext context) {
if (name == null || email == null) {
return Center(
child: SizedBox(
height: 50.0, // or another size
width: 50.0,
child: CircularProgressIndicator(),
),
);
} else {
return buildPage(context);
}
}

@override
Widget buildPage(BuildContext context) {
Size size = MediaQuery.of(context).size;
double height = MediaQuery.of(context).viewPadding.top;
return Scaffold(
resizeToAvoidBottomInset: false,
backgroundColor: AppColors('Default').main2,
body: Column(children: [
SizedBox(height: MediaQuery.of(context).padding.top + 10),
Expanded(
child: ProfileInfo(name: name, email: email),
),
Align(alignment: Alignment.bottomCenter, child: Footer(tab: 'More'))
]));
}
}

  2. [1]: https://i.stack.imgur.com/3NkGW.png
  3. [2]: https://i.stack.imgur.com/HH8Tc.png
  4. [3]: https://i.stack.imgur.com/yi326.png
  5. </details>
  6. # 答案1
  7. **得分**: 2
  8. 你可以在initState()中将widget.name放入TextEditingController中：
  9. ```dart
  10. var nameController = TextEditingController();
  11. @override
  12. void initState() {
  13. super.initState();
  14. nameController.text = widget.name ?? '';
  15. }

然后在Text widget中使用nameController：

  1. Text(nameController.text,)

使用widget.name来初始化nameController，然后使用nameController来实现业务逻辑。

英文:

For now you can put widget.name to TextEditingController in initState()

  1. var nameController = TextEditingController();
  2. @override
  3. void initState() {
  4. super.initState();
  5. nameController.text = widget.name??&#39;&#39;;
  6. }

Then use the nameController in Text widget.

Text(nameController.text,)

Use widget.name to initialize nameController then user nameController to implement business logic.

答案2

得分: 1

  1. var textEditingController = TextEditingController();
  2.   @override
  3.   void initState() {
  4.     super.initState();
  5.     textEditingController.text = widget.name??'';
  6.   }
英文: 
  1. var textEditingController = TextEditingController();
  2. @override
  3. void initState() {
  4. super.initState();
  5. textEditingController.text = widget.name??&#39;&#39;;
  6. }

huangapple
  • 本文由 发表于 2023年6月22日 12:48:50
  • 转载请务必保留本文链接：https://go.coder-hub.com/76528680.html
  • android
  • dart
  • flutter
  • ios
  • text
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定