Как включить кнопку в Flutter, если выпадающая кнопка имеет значение?
Коллеги по работе! Я noob во Flutter. Это мое первое приложение, и я пытаюсь включить кнопку только тогда, когда пользователь выбирает значение из выпадающего меню. Я пытался найти похожий вопрос, но не нашел.
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()))));
}
}
Поэтому я хочу активировать кнопку "Поднятый", только если в выпадающем меню выбран сотрудник.
Благодарю.
1 ответ
Решение
Вам придется немного изменить свой код, если вам нужны изменения кнопок в соответствии с Stream, переместите 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()))));
}
}