我有三个单选按钮,以便用户可以选择其性别。但是,只有男性单选按钮被突出显示。即使我的控制台在选择时打印了其他单选按钮,它们也不会在屏幕上突出显示。我不知道该怎么办,因此我们将不胜感激!
import 'package:flutter/material.dart';
import 'package:vibing/User_Login.dart';
import 'package:vibing/register_user.dart';
import 'package:vibing/register_user.dart';
class UserDetails extends StatefulWidget {
@override
_UserDetailsState createState() => _UserDetailsState();
}
enum Gender{
Male, Female, Others
}
class _UserDetailsState extends State<UserDetails> {
@override
Widget build(BuildContext context) {
final formkey = GlobalKey<FormState>();
String user_name;
String user_age;
int group_value = -1;
Gender _gender = Gender.Male;
final _userName = Container(
padding: EdgeInsets.only(left: 10, right: 10),
child: TextFormField(
autofocus: false,
keyboardType: TextInputType.text,
validator: (value) {
if(value.isEmpty)
{
return 'Field cannot be empty';
}
return null;
},
onSaved: (value)=> user_name = value,
decoration: InputDecoration(
hintText: 'Enter Name',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10)
),
),
),
);
final _userAge = Container(
padding: EdgeInsets.only(left: 10, right: 10),
child: TextFormField(
keyboardType: TextInputType.number,
autofocus: false,
validator: (value) {
if(value.isEmpty)
{
return 'Field cannot be empty';
}
return null;
},
onSaved: (value)=> user_age = value,
decoration: InputDecoration(
hintText: 'Enter Age',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10)
),
),
),
);
final _male = Radio(
value: Gender.Male,
activeColor: Colors.black,
groupValue: _gender,
onChanged: (Gender value){
setState(() {
print(value);
_gender = value;
});
},
);
final _female = Radio(
activeColor: Colors.black,
value: Gender.Female,
groupValue: _gender,
onChanged: (Gender value){
setState(() {
print(value);
_gender = value;
});
},
);
final _others = Radio(
activeColor: Colors.black,
value: Gender.Others,
groupValue: _gender,
onChanged: (Gender value){
setState(() {
print(value);
_gender = value;
});
},
);
return Scaffold(
backgroundColor: Colors.yellow,
body: Container(
key: formkey,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text("Register",
style: TextStyle(fontSize: 64.0, fontWeight: FontWeight.bold),),
SizedBox(height: 50,),
_userName,
SizedBox(height: 20,),
_userAge,
SizedBox(height: 30,),
Row(
crossAxisAlignment: CrossAxisAlignment.center ,
children: <Widget>[
Text(" Gender: ", style: TextStyle(fontSize: 20.0),),
_male,
Text("Male"),
_female,
Text("Female"),
_others,
Text("Others"),
],
),
Row(
crossAxisAlignment: CrossAxisAlignment.center ,
children: <Widget>[
FloatingActionButton.extended(
heroTag: "next_button",
backgroundColor: Colors.yellow,
foregroundColor: Colors.black,
onPressed: ()=> Navigator.push(context, MaterialPageRoute(builder: (context)=>UserReg())),
label: Text("Next", style: TextStyle(fontWeight: FontWeight.bold),)
),
SizedBox(width: 230,),
FloatingActionButton.extended(
heroTag: "prev_button",
backgroundColor: Colors.yellow,
foregroundColor: Colors.black,
onPressed: ()=> Navigator.push(context, MaterialPageRoute(builder: (context)=>UserLogin())),
label: Text("Prev", style: TextStyle(fontWeight: FontWeight.bold),)
),
],
),
],
),
),
);
}
}
答案 0 :(得分:2)
它不起作用,因为您在build函数中声明了状态。将其移出:
class _UserDetailsState extends State<UserDetails> {
String user_name;
String user_age;
int group_value = -1;
Gender _gender = Gender.Male;
通过这种方式,您可以为每个枚举值生成窗口小部件:
children: <Widget>[
for(var gender in Gender.values)
Radio(
value: gender,
activeColor: Colors.black,
groupValue: _gender,
onChanged: (Gender value){
setState(() {
print(value);
_gender = value;
});
},
);
]
确保pubspec.yaml中的最低SDK版本为2.6.0或更高版本