我在按下時創建了一個帶有條件的按鈕，但是我對如何在按下時使按鈕改變顏色感到困惑。
Expanded(
child: ProductivityButton(
color: const Color.fromARGB(255, 0, 162, 255),
text: 'Work',
onPressed: () => timer.startWork())),
Padding(
padding: EdgeInsets.all(defaultPadding),
),
生產力按鈕是
class ProductivityButton extends StatelessWidget {
final Color color;
final String text;
final double size;
final VoidCallback onPressed;
const ProductivityButton({
Key? key,
required this.color,
required this.text,
this.size = 0,
required this.onPressed,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialButton(
onPressed: onPressed,
child: Text(text, style: const TextStyle(color: Colors.white)),
color: color,
minWidth: size,
);
}
}
uj5u.com熱心網友回復：
使用 Elevated 按鈕更新 ProductivityButton 小部件并設定疊加顏色屬性。
ElevatedButton(
onPressed: () {},
style: ButtonStyle(
overlayColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.pressed))
return Colors.redAccent; //<-- SEE HERE
return null; // Defer to the widget's default.
},
),
),
child: const Text(
'Elevated Button 1',
style: TextStyle(fontSize: 24),
),
)
uj5u.com熱心網友回復：
用于setState更改按鈕的顏色，如下所示。
Color buttonColor = Color.fromARGB(255, 0, 162, 255);
Expanded(
child: ProductivityButton(
color: buttonColor,
text: 'Work',
onPressed: () {
timer.startWork();
buttonColor = Colors.red;
setState( () {});
}),
Padding(
padding: EdgeInsets.all(defaultPadding),
),
uj5u.com熱心網友回復：
Expanded(
child: ProductivityButton(
color: const Color.fromARGB(255, 0, 162, 255),
text: 'Work',
onPressed: () {
timer.startWork();
setState(() {});
})),
Padding(
padding: EdgeInsets.all(defaultPadding),
),
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/494768.html