用于扑动的Dart函数，将FlatButton替换为TextButton

Question

如何用TextButton替换FlatButton，同时保留相同的功能?

我需要知道什么放入扩展buildKey({Color Color, int soundNumber})为TextButton因为颜色:颜色，不工作的TextButton

import 'package:flutter/material.dart';
import 'package:audioplayers/audioplayers.dart';
void main() => runApp(XylophoneApp());
class XylophoneApp extends StatelessWidget {
void playSound(int soundNumber) {
final player = AudioCache();
player.play('note$soundNumber.wav');
}
Expanded buildKey({Color color, int soundNumber}) {
return Expanded(
child: FlatButton(
color: color,
onPressed: () {
playSound(soundNumber);
},
),
);
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
backgroundColor: Colors.black,
body: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
buildKey(color: Colors.red, soundNumber: 1),
buildKey(color: Colors.orange, soundNumber: 2),
buildKey(color: Colors.yellow, soundNumber: 3),
buildKey(color: Colors.green, soundNumber: 4),
buildKey(color: Colors.teal, soundNumber: 5),
buildKey(color: Colors.blue, soundNumber: 6),
buildKey(color: Colors.purple, soundNumber: 7),
],
),
),
),
);
}
}

Answer 1

请尝试一下

Expanded buildKey({Color color, int soundNumber}) {
return Expanded(
child: TextButton(
onPressed: () {
playSound(soundNumber);
},
style: ButtonStyle(backgroundColor: MaterialStateProperty.all(color)),
child: Text('Button Name'),
),
);
}