While displaying an Alert box, i'm trying to change the Box Shadow of saveButton
widget which is simply a button. The button is expected to become active as soon as the TextFormField
is populated. But the button does not become active or inactive until the user presses Done
or Submit
on the keyboard. Below is the video for better understanding and the code for the reference.
class AddFacilityEquipmentWidget extends StatelessWidget {
final AddFacilityProvider provider;
AddFacilityyEquipmentWidget({this.provider});
@override
Widget build(BuildContext context) {
return equipmentTypesColumn(context);
}
Widget equipmentTypesColumn(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(Translations.of(context).getEquipment),
addCustomEquipmentButton(context),
],
);
}
Widget addCustomEquipmentButton(BuildContext context) {
return GestureDetector(
onTap: () {
showDialog(
context: context,
barrierDismissible: false,
builder: (context) => addEquipmentAlertWidget(context),
);
},
child: Text("Add Custom Equipment"),
);
}
Widget addEquipmentAlertWidget(BuildContext context) {
return AlertDialog(
contentPadding: EdgeInsets.zero,
content: Container(
child: Column(
children: <Widget>[
upperTitleWidget(context),
SizedBox(height: d_50),
equipmentNameField(context),
SizedBox(height: d_50),
saveButton(context)
],
),
),
);
}
Widget upperTitleWidget(BuildContext context) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
Translations.of(context).getAddEquipment,
style: d18fw700Black,
),
Container(
height: d_20,
width: d_20,
child: IconButton(
padding: pd_0,
icon: Icon(
Icons.cancel,
color: greyColor,
),
onPressed: () {
provider.isAddEquipmentButtonActive = false;
provider.addNewEquipmentController.clear();
Navigator.pop(context);
}),
)
],
);
}
Widget equipmentNameField(BuildContext context) {
return Container(
child: TextFormField(
controller: provider.addNewEquipmentController,
keyboardType: TextInputType.text,
onChanged: (text) {
if (text.length > 0) {
provider.isAddEquipmentButtonActive = true;
} else {
provider.isAddEquipmentButtonActive = false;
}
},
),
);
}
Widget saveButton(BuildContext context) {
return GestureDetector(
onTap: () {},
child: Container(
decoration: BoxDecoration(
boxShadow: [
provider.isAddEquipmentButtonActive
? BoxShadow() //Box Shadow 1
: BoxShadow(), // Box Shadow 2
],
color: provider.isAddEquipmentButtonActive
? backgroundColor
: deactivatButtonColor,
borderRadius: BorderRadius.circular(d_100)),
child: Text(
Translations.of(context).getAddEquipment,
),
),
);
}
}
Edit: Below is the code of AddFacilityProvider
class
class AddFacilityProvider extends ChangeNotifier {
List<Facilities> _equipmentList = [
Facilities(text: "Floodlights", key: "Floodlights", isOpen: false),
Facilities(text: "Scoreboard", key: "Scoreboard", isOpen: false),
Facilities(text: "Changing rooms", key: "Changing rooms", isOpen: false),
Facilities(text: "Showers", key: "Showers", isOpen: false),
Facilities(text: "Free parking", key: "Free parking", isOpen: false),
Facilities(
text: "Wheelchair friendly", key: "Wheelchair friendly", isOpen: false),
Facilities(text: "Drinking water", key: "Drinking water", isOpen: false),
Facilities(text: "Sports bar", key: "Sports bar", isOpen: false),
Facilities(text: "Toilets", key: "Toilets", isOpen: false),
];
TextEditingController _addNewEquipmentController =
TextEditingController();
bool _isEnableAddNewFacilityEquipment = false;
bool _isAddEquipmentButtonActive = false;
void toggleAddEquipmentActive(bool value) {
_isAddEquipmentButtonActive = value;
notifyListeners();
}
TextEditingController get addNewEquipmentController =>
_addNewEquipmentController;
set addNewEquipmentController(TextEditingController value) {
_addNewEquipmentController = value;
notifyListeners();
}
bool get isEnableAddNewFacilityEquipment => _isEnableAddNewFacilityEquipment;
set isEnableAddNewFacilityEquipment(bool value) {
_isEnableAddNewFacilityEquipment = value;
notifyListeners();
}
bool get isAddEquipmentButtonActive => _isAddEquipmentButtonActive;
set isAddEquipmentButtonActive(bool value) {
_isAddEquipmentButtonActive = value;
notifyListeners();
}
}