当另一个RaisedButton被按下时，锁定一个RaisedButton

Question

我有这个代码我只需要选择一个选项从三个按钮"每月，每季度和每年"当选择一个时，阻止其他两个。

我已经搜索，但我只发现如何阻止我刚刚选择的按钮，我需要阻止那些没有选择的。

这些是我用来在选择时改变颜色的变量。

bool pressMensual = false;
bool pressTrimes = false;
bool pressAnual = false;
bool _isPressed = false;

Container(
padding: EdgeInsets.symmetric(horizontal: 2.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
padding: EdgeInsets.only(left: 10.0, right: 10.0),
child: Column(
children: [
Text('PERIODO'),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(3.0),
child: RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)
),
child: Text('MENSUAL'),
color:  pressMensual ? Colors.blue[100] : Color(0xFF94D500),
onPressed: () {
_isPressed = true;
setState(() {
pressMensual = !pressMensual;
});
},
),
),
RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)
),
color: pressTrimes ? Colors.blue[100]  : Color(0xFF94D500),
child: Text('TRIMESTRAL'),         
onPressed: () {
setState(() {
pressTrimes = !pressTrimes;
});
},
),
RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)
),
color: pressAnual ? Colors.blue[100] : Color(0xFF94D500),
child: Text('ANUAL'),                        
onPressed: () {
setState(() {
pressAnual = !pressAnual;
});
},
),
],
),
],
),
);

Answer 1

当其他两个为假时，试试这个方法。我们喜欢把按下的按钮设为真，而把其他按钮设为假。为了存档，我们需要更新setState中的三个值来更新UI。

setState(() {
pressMensual = true; // because `Mensual` is pressed here
pressTrimes = false;
pressAnual = false;
});

锁定按键功能

这里我们可以通过null来防止RaisedButton像onPressed:null一样的分接事件。在这种情况下，我们需要像您那样包含另一个变量，或者您可以检查这三个bool变量。

使用_isPressedbool将为

onPressed: _isPressed
? null
: () {
setState(() {
pressMensual = false;
pressTrimes = true;
pressAnual = false;
_isPressed = true;
});
},

或者你也可以这样做，避免使用另一个bool。

onPressed: pressMensual || pressTrimes || pressAnual
? null
: () {
setState(() {
pressMensual = false;
pressTrimes = true;
pressAnual = false;
});
},

使用null会/会失去你的样式功能在这种情况下，而不是传递null给onPressed传递空函数，如

onPressed: _isPressed
? () {}
: () {
setState(() {
pressMensual = false;
pressTrimes = false;
pressAnual = true;
_isPressed = true;
});
},

全部部件

class _TestWState extends State<STD> {
bool pressMensual = false;
bool pressTrimes = false;
bool pressAnual = false;
bool _isPressed = false;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
padding: EdgeInsets.symmetric(horizontal: 2.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
padding: EdgeInsets.only(left: 10.0, right: 10.0),
child: Column(
children: [
Text('PERIODO'),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(3.0),
child: RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)),
child: Text('MENSUAL'),
color: pressMensual
? Colors.blue[100]
: Color(0xFF94D500),
onPressed: _isPressed
? null //* will loss style
: () {
setState(() {
pressMensual = true;
pressTrimes = false;
pressAnual = false;
_isPressed = true;
});
},
),
),
RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)),
color:
pressTrimes ? Colors.blue[100] : Color(0xFF94D500),
child: Text('TRIMESTRAL'),
onPressed: pressMensual || pressTrimes || pressAnual //* without using separate variable
? () {}
: () {
setState(() {
pressMensual = false;
pressTrimes = true;
pressAnual = false;
_isPressed = true;
});
},
),
RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)),
color:
pressAnual ? Colors.blue[100] : Color(0xFF94D500),
child: Text('ANUAL'),
onPressed: _isPressed
? () {}
: () {
setState(() {
pressMensual = false;
pressTrimes = false;
pressAnual = true;
_isPressed = true;
});
},
),
],
),
],
),
)
],
),
),
);
}
}