当 dropdownbutton 有值时,如何在 Flutter 中启用一个按钮?
How to enable a button in Flutter,when dropdownbutton has value?
同事们!我是 Flutter.This 中的新手,这是我的第一个应用程序,我试图仅在用户从下拉按钮中选择一个值时启用该按钮。
我试图找到一个类似的问题,但没有找到。
class Reserve extends StatefulWidget {
@override
_ReserveState createState() => _ReserveState();
}
class _ReserveState extends State<Reserve> {
var _category;
final formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text(
globals.salonname == "" ? "Reserve" : globals.salonname),
backgroundColor: Colors.deepOrange,
),
drawer: new Drawer(
child: new ListView(children: <Widget>[
new ListTile(
title: new Text("Close"),
trailing: new Icon(Icons.arrow_upward),
onTap: () {
Navigator.of(context).pop();
})
])),
body: Card(
child: Padding(
padding: EdgeInsets.all(8.0),
child: Form(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
new Calendar(
isExpandable: true,
onDateSelected: null,
),
Row(children: <Widget>[
new Container(
alignment: Alignment(1.0, 0.0),
child: new Center(
child: new StreamBuilder<QuerySnapshot>
(
stream: Firestore.instance
.collection('salons').document(
globals.salonkey).collection(
'employee')
.snapshots(),
builder: (context, snapshot) {
try {
if
(snapshot.data.documents.length ==
0) {
return new Text("No employees
found!");
}
else {
return new DropdownButton(
hint: new Text(
"Choose an employee"),
items: snapshot.data.documents
.map(
(
DocumentSnapshot document) {
return DropdownMenuItem(
value: document
.data["name"],
child: new Text(
document
.data["name"]));
}).toList(),
value: _category,
onChanged: (value) {
setState(() {
_category = value;
});
});
}
}
catch (ex) {
return new Text("Try again!");
}
})),
)
]),
new Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
_buildButton(),
])
])))));
}
Widget _buildButton() {
return new RaisedButton(
padding: const EdgeInsets.all(8.0),
color: _category == true ? Colors.orangeAccent : Colors.grey,
child: Text("Choose employee"),
onPressed: _category==null ? null : () => setState(() => Navigator.of(context).push(
new MaterialPageRoute(
builder: (BuildContext context) =>
new ReserveTable()))));
}
}
所以我只想在下拉按钮中选择员工时启用“已升起”按钮。
谢谢。
您将需要稍微修改您的代码,如果您需要根据流更改按钮,请将 StreamBuilder
移动到 Column
级别并添加一个变量以检查何时流有数据
这里您的代码已修复:
class _ReserveState extends State<Reserve> {
var _category;
bool enableButton = false;
final formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title:
new Text(globals.salonname == "" ? "Reserve" : globals.salonname),
backgroundColor: Colors.deepOrange,
),
drawer: new Drawer(
child: new ListView(children: <Widget>[
new ListTile(
title: new Text("Close"),
trailing: new Icon(Icons.arrow_upward),
onTap: () {
Navigator.of(context).pop();
})
])),
body: Card(
child: Padding(
padding: EdgeInsets.all(8.0),
child: Form(
key: formKey,
child: new StreamBuilder<QuerySnapshot>(
stream: Firestore.instance
.collection('salons')
.document(globals.salonkey)
.collection('employee')
.snapshots(),
builder: (context, snapshot) {
return Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
new Calendar(
isExpandable: true,
onDateSelected: null,
),
Row(children: <Widget>[
new Container(
alignment: Alignment(1.0, 0.0),
child: new Center(
child: (!snapshot.hasData ||
snapshot.data.documents.length == 0)
? new Text("No employees found!")
: new DropdownButton(
hint:
new Text("Choose an employee"),
items: snapshot.data.documents.map(
(DocumentSnapshot document) {
return DropdownMenuItem(
value: document.data["name"],
child: new Text(
document.data["name"]));
}).toList(),
value: _category,
onChanged: (value) {
setState(() {
_category = value;
});
})))
]),
new Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
_buildButton(),
])
]);
})),
)));
}
Widget _buildButton() {
return new RaisedButton(
padding: const EdgeInsets.all(8.0),
color: _category!=null ? Colors.orangeAccent : Colors.grey,
child: Text("Choose employee"),
onPressed: _category==null
? null
: () => setState(() => Navigator.of(context).push(
new MaterialPageRoute(
builder: (BuildContext context) => ReserveTable()))));
}
}
同事们!我是 Flutter.This 中的新手,这是我的第一个应用程序,我试图仅在用户从下拉按钮中选择一个值时启用该按钮。 我试图找到一个类似的问题,但没有找到。
class Reserve extends StatefulWidget {
@override
_ReserveState createState() => _ReserveState();
}
class _ReserveState extends State<Reserve> {
var _category;
final formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text(
globals.salonname == "" ? "Reserve" : globals.salonname),
backgroundColor: Colors.deepOrange,
),
drawer: new Drawer(
child: new ListView(children: <Widget>[
new ListTile(
title: new Text("Close"),
trailing: new Icon(Icons.arrow_upward),
onTap: () {
Navigator.of(context).pop();
})
])),
body: Card(
child: Padding(
padding: EdgeInsets.all(8.0),
child: Form(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
new Calendar(
isExpandable: true,
onDateSelected: null,
),
Row(children: <Widget>[
new Container(
alignment: Alignment(1.0, 0.0),
child: new Center(
child: new StreamBuilder<QuerySnapshot>
(
stream: Firestore.instance
.collection('salons').document(
globals.salonkey).collection(
'employee')
.snapshots(),
builder: (context, snapshot) {
try {
if
(snapshot.data.documents.length ==
0) {
return new Text("No employees
found!");
}
else {
return new DropdownButton(
hint: new Text(
"Choose an employee"),
items: snapshot.data.documents
.map(
(
DocumentSnapshot document) {
return DropdownMenuItem(
value: document
.data["name"],
child: new Text(
document
.data["name"]));
}).toList(),
value: _category,
onChanged: (value) {
setState(() {
_category = value;
});
});
}
}
catch (ex) {
return new Text("Try again!");
}
})),
)
]),
new Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
_buildButton(),
])
])))));
}
Widget _buildButton() {
return new RaisedButton(
padding: const EdgeInsets.all(8.0),
color: _category == true ? Colors.orangeAccent : Colors.grey,
child: Text("Choose employee"),
onPressed: _category==null ? null : () => setState(() => Navigator.of(context).push(
new MaterialPageRoute(
builder: (BuildContext context) =>
new ReserveTable()))));
}
}
所以我只想在下拉按钮中选择员工时启用“已升起”按钮。
谢谢。
您将需要稍微修改您的代码,如果您需要根据流更改按钮,请将 StreamBuilder
移动到 Column
级别并添加一个变量以检查何时流有数据
这里您的代码已修复:
class _ReserveState extends State<Reserve> {
var _category;
bool enableButton = false;
final formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title:
new Text(globals.salonname == "" ? "Reserve" : globals.salonname),
backgroundColor: Colors.deepOrange,
),
drawer: new Drawer(
child: new ListView(children: <Widget>[
new ListTile(
title: new Text("Close"),
trailing: new Icon(Icons.arrow_upward),
onTap: () {
Navigator.of(context).pop();
})
])),
body: Card(
child: Padding(
padding: EdgeInsets.all(8.0),
child: Form(
key: formKey,
child: new StreamBuilder<QuerySnapshot>(
stream: Firestore.instance
.collection('salons')
.document(globals.salonkey)
.collection('employee')
.snapshots(),
builder: (context, snapshot) {
return Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
new Calendar(
isExpandable: true,
onDateSelected: null,
),
Row(children: <Widget>[
new Container(
alignment: Alignment(1.0, 0.0),
child: new Center(
child: (!snapshot.hasData ||
snapshot.data.documents.length == 0)
? new Text("No employees found!")
: new DropdownButton(
hint:
new Text("Choose an employee"),
items: snapshot.data.documents.map(
(DocumentSnapshot document) {
return DropdownMenuItem(
value: document.data["name"],
child: new Text(
document.data["name"]));
}).toList(),
value: _category,
onChanged: (value) {
setState(() {
_category = value;
});
})))
]),
new Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
_buildButton(),
])
]);
})),
)));
}
Widget _buildButton() {
return new RaisedButton(
padding: const EdgeInsets.all(8.0),
color: _category!=null ? Colors.orangeAccent : Colors.grey,
child: Text("Choose employee"),
onPressed: _category==null
? null
: () => setState(() => Navigator.of(context).push(
new MaterialPageRoute(
builder: (BuildContext context) => ReserveTable()))));
}
}