无法在 Flutter 中将变量值从一个无状态 Widget 传递到另一个
[英]Cannot pass variable value from one stateless Widget to another in Flutter
问题描述
Thank you for your answers in front.
谢谢你在前面的回答。 I'm trying to pass the "username, email, password" from the TextField widget in GetTextField StatelessWidget to the print function in the GestureDetector widget in GetSignup StatelessWidget.我正在尝试将 GetTextField StatelessWidget 中的 TextField 小部件中的“用户名、email、密码”传递给 GetSignup StatelessWidget 中 GestureDetector 小部件中的打印 function。 I tried two ways but both "user name: null, user email: null, user password: null" messages appears after filling the fields and pressing the button.我尝试了两种方法，但在填写字段并按下按钮后都会出现“用户名：null，用户 email：null，用户密码：null”消息。 What could be possibly wrong?什么可能是错的？
Method 1:方法一：
class SignupScreen extends StatefulWidget {
static const id = "signup_screen";
@override
_SignupScreenState createState() => _SignupScreenState();
}
class _SignupScreenState extends State<SignupScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomPaint(
painter: BackgroundSignup(),
child: Stack(
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(
horizontal: 35,
),
child: Column(
children: <Widget>[
GetHeader(),
GetTextField(),
GetSignup(),
GetButtonRow(),
],
),
),
GetBackButton(),
],
),
),
);
}
}
class GetTextField extends StatelessWidget {
String email;
String password;
String username;
@override
Widget build(BuildContext context) {
return Expanded(
flex: 4,
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: (value) {
username = value;
},
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الاسم كاملا",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: (value) {
email = value;
},
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الإيميل",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: (value) {
password = value;
},
obscureText: true,
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "كلمة السر",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 25,
),
],
),
);
}
}
class GetSignup extends StatelessWidget {
GetTextField getTextField = GetTextField();
@override
Widget build(BuildContext context) {
return Expanded(
flex: 1,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
GestureDetector(
onTap: () {
print('user name: ${getTextField.username}');
print('user email: {getTextField.email}');
print('user password: ${getTextField.password}');
},
child: CircleAvatar(
backgroundColor: Colors.grey.shade800,
radius: 40,
child: Icon(
Icons.arrow_back,
color: Colors.white,
),
),
),
Text(
"انشئ حسابك",
style: TextStyle(
fontSize: 25,
fontWeight: FontWeight.bold,
),
),
],
),
);
}
}
Method 2:方法二：
class SignupScreen extends StatefulWidget {
static const id = "signup_screen";
@override
_SignupScreenState createState() => _SignupScreenState();
}
class _SignupScreenState extends State<SignupScreen> {
GetTextField getTextField = GetTextField();
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomPaint(
painter: BackgroundSignup(),
child: Stack(
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(
horizontal: 35,
),
child: Column(
children: <Widget>[
GetHeader(),
GetTextField(),
GetSignup(
username: getTextField.username,
email: getTextField.email,
password: getTextField.password,
),
GetButtonRow(),
],
),
),
GetBackButton(),
],
),
),
);
}
}
class GetTextField extends StatelessWidget {
String email;
String password;
String username;
@override
Widget build(BuildContext context) {
return Expanded(
flex: 4,
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: (value) {
username = value;
},
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الاسم كاملا",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: (value) {
email = value;
},
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الإيميل",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: (value) {
password = value;
},
obscureText: true,
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "كلمة السر",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 25,
),
],
),
);
}
}
class GetSignup extends StatelessWidget {
final username;
final email;
final password;
GetSignup({this.username, this.email, this.password});
@override
Widget build(BuildContext context) {
return Expanded(
flex: 1,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
GestureDetector(
onTap: () {
print('user name: $username');
print('user email: $email');
print('user password: $password');
},
child: CircleAvatar(
backgroundColor: Colors.grey.shade800,
radius: 40,
child: Icon(
Icons.arrow_back,
color: Colors.white,
),
),
),
Text(
"انشئ حسابك",
style: TextStyle(
fontSize: 25,
fontWeight: FontWeight.bold,
),
),
],
),
);
}
}
2 个解决方案
解决方案1
1 2020-05-10 10:50:19
Update your GetTextField class like this:像这样更新您的 GetTextField class：
class GetTextField extends StatelessWidget {
Function(String) onEmail;
Function(String) onPassword;
Function(String) onUsername;
GetTextField({Key key, this.onEmail,this.onPassword,this.onUsername}) : super(key: key);
@override
Widget build(BuildContext context) {
return Expanded(
flex: 4,
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: onUsername,
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الاسم كاملا",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: onEmail
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الإيميل",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: onPassword
obscureText: true,
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "كلمة السر",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 25,
),
],
),
);
}
Use it in SignupScreen like this:->像这样在 SignupScreen 中使用它：->
class SignupScreen extends StatefulWidget {
static const id = "signup_screen";
@override
_SignupScreenState createState() => _SignupScreenState();
}
class _SignupScreenState extends State<SignupScreen> {
String email="",username="",password="";
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomPaint(
painter: BackgroundSignup(),
child: Stack(
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(
horizontal: 35,
),
child: Column(
children: <Widget>[
GetHeader(),
GetTextField(
onEmail(email){
setState(() {
email = email;
});
},
onUsername(username){
setState(() {
username = username;
});
}
onPassword(pass){
setState(() {
password = pass;
});
}
),
GetSignup(
username: username,
email: email,
password: password,
),
GetButtonRow(),
],
),
),
GetBackButton(),
],
),
),
);
}
}
解决方案2
0 2020-05-10 18:11:53
First: I tried to implement Shikhar Singh instruction but I get the same output "username= null, email = null, password = null" here is the code after modification" First: I tried to implement Shikhar Singh instruction but I get the same output "username= null, email = null, password = null" here is the code after modification"
class SignupScreen extends StatefulWidget {
static const id = "signup_screen";
@override
_SignupScreenState createState() => _SignupScreenState();
}
class _SignupScreenState extends State<SignupScreen> {
String email;
String username;
String password;
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomPaint(
painter: BackgroundSignup(),
child: Stack(
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(
horizontal: 35,
),
child: Column(
children: <Widget>[
GetHeader(),
GetTextField(
onEmail: (value) {
setState(() {
value = email;
});
},
onUsername: (value) {
setState(() {
value = username;
});
},
onPassword: (value) {
setState(() {
value = password;
});
},
),
GetSignup(
username: username,
email: email,
password: password,
),
GetButtonRow(),
],
),
),
GetBackButton(),
],
),
),
);
}
}
class GetTextField extends StatelessWidget {
Function(String) onEmail;
Function(String) onPassword;
Function(String) onUsername;
GetTextField({Key key, this.onEmail, this.onPassword, this.onUsername})
: super(key: key);
@override
Widget build(BuildContext context) {
return Expanded(
flex: 4,
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: onUsername,
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الاسم كاملا",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: onEmail,
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "الإيميل",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 15,
),
Directionality(
textDirection: TextDirection.rtl,
child: TextField(
onChanged: onPassword,
obscureText: true,
textAlign: TextAlign.start,
decoration: InputDecoration(
labelText: "كلمة السر",
labelStyle:
TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white),
),
),
),
),
SizedBox(
height: 25,
),
],
),
);
}
}
class GetSignup extends StatelessWidget {
final username;
final email;
final password;
GetSignup({Key key, this.username, this.email, this.password})
: super(key: key);
@override
Widget build(BuildContext context) {
return Expanded(
flex: 1,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
GestureDetector(
onTap: () {
//TODO: fill circle avatar
print('user name: $username');
print('user email: $email');
print('user password: $password');
},
child: CircleAvatar(
backgroundColor: Colors.grey.shade800,
radius: 40,
child: Icon(
Icons.arrow_back,
color: Colors.white,
),
),
),
Text(
"انشئ حسابك",
style: TextStyle(
fontSize: 25,
fontWeight: FontWeight.bold,
),
),
],
),
);
}
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
如何将 flutter textediting controller 值从一个无状态小部件传递到另一个无状态小部件 - How can I pass flutter textediting controller value from one stateless widget to another stateless widget
如何将数据传递给从另一个无状态小部件调用的无状态小部件？ - How to pass data to stateless widget calling from another stateless widget?
如何将变量值从一个颤动页面传递到另一个页面 - how to pass a variable value from one flutter page to another
将参数传递给 Flutter 中的无状态小部件 - Pass params to stateless widget in Flutter
Flutter - 从另一个有状态小部件设置一个有状态小部件的变量值 - Flutter - Setting value of a variable of one stateful widget from another stateful widget
在颤振中将一个变量值传递给另一个变量 - pass one variables value to another variable in flutter
在无状态小部件中创建的变量不能在子小部件中使用（Flutter） - Variable created in stateless widget cannot be used in child widgets (Flutter)
Flutter 将数据从一个 class 传递到另一个（有状态小部件） - Flutter pass data from one class to another(statefull widget)
在 Flutter 的表单中将数据从一个小部件传递到另一个小部件 - Pass data from one widget to another in a Form in Flutter
如何在Stateless Widget上传递flutter中的数据？ - How to pass data in flutter on Stateless Widget?
相关标签