Flutter - как переключить цвет RaisedButton при нажатии?
Я пытаюсь переключить цвет выпуклой кнопки. Изначально кнопка должна быть синей, а при нажатии становится серой. Прямо сейчас у меня есть значение типа bool с именем pressAttention, и для него установлено значение false. Я использую это, чтобы изначально установить значение false. При нажатии кнопки происходит переключение на pressAttention bool, но кажется, что виджет больше никогда не обновляется.
new RaisedButton(
child: new Text("Attention"),
textColor: Colors.white,
shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0)),
color: pressAttention?Colors.grey:Colors.blue,
onPressed: () => doSomething("Attention"),
)
void doSomething(String buttonName){
if (buttonName == "Attention"){
if (pressAttention = false){
pressAttention = true;
} else {
pressAttention = false;
}
}
}
Я в это не верю, я новичок в трепетании и дротике.
Flutter будет перерисовывать объекты только тогда, когда вы сообщаете ему, что что-то изменилось, один из способов сделать это - использовать setState. Предлагаю вам ознакомиться с обучающими материалами на веб-сайте, например flutter.io/tutorials/interactive
Ответы 3
Эта кнопка должна быть создана в build из State из StatefulWidget, а состояние должно иметь переменную-член bool pressAttention = false;. Как предлагает Эдман, вам нужно внести изменения состояния в обратный вызов setState, чтобы виджет перерисовался.
new RaisedButton(
child: new Text('Attention'),
textColor: Colors.white,
shape: new RoundedRectangleBorder(
borderRadius: new BorderRadius.circular(30.0),
),
color: pressAttention ? Colors.grey : Colors.blue,
onPressed: () => setState(() => pressAttention = !pressAttention),
);
Если вы хотите, чтобы кнопка меняла цвет для нажатого состояния, вам просто нужно использовать свойство «highlightColor» в RaisedButton.
RaisedButton(
onPressed: () {},
child: Text("Test"),
highlightColor: YOUR_PRESSED_COLOR, //Replace with actual colors
color: IDLE_STATE_COLOR,
),
Или вы можете использовать rxdart:
import 'package:rxdart/rxdart.dart';
...
bool presssedFavorite = false;
final _pressAttention = BehaviorSubject<bool>();
Observable<bool> get coursesStream => _pressAttention.stream;
...
StreamBuilder(stream: _pressAttention,
builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
if (snapshot.hasData)
presssedFavorite = snapshot.data;
return RawMaterialButton(
onPressed: (){
_addToFavorites(context);
},
child: Padding(
padding: EdgeInsets.all(5),
child: Icon(
presssedFavorite ? Icons.favorite : Icons.favorite_border,
color: Colors.red,
size: 17,
),
),
);
},
),
void _addToFavorites(BuildContext context) async{
//my code...
_pressAttention.sink.add(!presssedFavorite);
}
Это более сложно, но вы можете использовать это решение также с веб-сервисами, firestore, db ... И вы можете использовать с StatelessWidget и StatefulWidget.
Вы звоните в setState?