英文:
Flutter - Audio is playing only once when I go to PianoMain page
问题
你好,以下是你要翻译的代码部分:
AudioPlayer player = AudioPlayer();
void playAudio({required String fileName}) {
player.play(AssetSource(fileName));
}
包引入部分:
import 'package:audioplayers/audioplayers.dart';
@override
void dispose() async {
super.dispose();
await player.stop();
}
Row(
children: [
PianoButtonSuperKey(
keyPress: () {
playAudio(fileName: "piano/piano3.mp3");
},
),
PianoButton(
onSuperKeyPress: () {
playAudio(fileName: "piano/blackpiano1.mp3");
},
onMainKeyPress: () {
playAudio(fileName: "piano/piano4.mp3");
},
),
PianoButtonSuperKey(
keyPress: () {
playAudio(fileName: "piano/piano5.mp3");
},
),
PianoButton(
onSuperKeyPress: () {
playAudio(fileName: "piano/hard7.mp3");
},
onMainKeyPress: () {
playAudio(fileName: "piano/piano10.mp3");
},
),
PianoButton(
onSuperKeyPress: () {
playAudio(fileName: "piano/hardpiano8.mp3");
},
onMainKeyPress: () {
playAudio(fileName: "piano/audio6.mp3");
},
),
],
)
class PianoButton extends StatelessWidget {
const PianoButton(
{super.key, required this.onMainKeyPress, required this.onSuperKeyPress});
final Function onMainKeyPress;
final Function onSuperKeyPress;
@override
Widget build(BuildContext context) {
return Expanded(
flex: 1,
child: Stack(
clipBehavior: Clip.none,
children: [
Container(
height: double infinity,
width: double infinity,
padding: const EdgeInsets.only(right: 8, bottom: 2, top: 2),
child: GestureDetector(
onTap: onMainKeyPress(),
child: Container(
decoration: const BoxDecoration(
color: Colors.white, boxShadow: [BoxShadow(blurRadius: 2)]),
),
),
),
Positioned(
top: 2,
right: 98,
child: SizedBox(
width: 50,
height: 200,
child: GestureDetector(
onTap: onSuperKeyPress(),
child: Container(
decoration: const BoxDecoration(color: Colors.black),
),
),
],
),
);
}
}
class PianoButtonSuperKey extends StatelessWidget {
const PianoButtonSuperKey({super.key, required this.keyPress});
final Function keyPress;
@override
Widget build(BuildContext context) {
return Expanded(
flex: 1,
child: Container(
height: double infinity,
width: double infinity,
padding: const EdgeInsets.only(right: 8, bottom: 2, top: 2),
child: GestureDetector(
onTap: keyPress(),
child: Container(
decoration: const BoxDecoration(
color: Colors.white, boxShadow: [BoxShadow(blurRadius: 2)]),
),
),
),
};
}
希望这能帮助你。如果有任何问题,请随时告诉我。
英文:
I am making a piano app as a beginner for demo. I have made the whole page for Piano including UI and audio functionality. But, the problem is that when I open PianoMain
so, it plays any one of key's audio. Then if I press any key's onTap
it doesn't work. So, let me put my code here. And, please check if you can find any mistake of mine.
AudioPlayer player = AudioPlayer();
void playAudio({required String fileName}) {
player.play(AssetSource(fileName));
}
Package is:
import 'package:audioplayers/audioplayers.dart';
@override
void dispose() async {
super.dispose();
await player.stop();
}
Row(
children: [
PianoButtonSuperKey(
keyPress: () {
playAudio(fileName: "piano/piano3.mp3");
},
),
PianoButton(
onSuperKeyPress: () {
playAudio(fileName: "piano/blackpiano1.mp3");
},
onMainKeyPress: () {
playAudio(fileName: "piano/piano4.mp3");
},
),
PianoButtonSuperKey(
keyPress: () {
playAudio(fileName: "piano/piano5.mp3");
},
),
PianoButton(
onSuperKeyPress: () {
playAudio(fileName: "piano/hard7.mp3");
},
onMainKeyPress: () {
playAudio(fileName: "piano/piano10.mp3");
},
),
PianoButton(
onSuperKeyPress: () {
playAudio(fileName: "piano/hardpiano8.mp3");
},
onMainKeyPress: () {
playAudio(fileName: "piano/audio6.mp3");
},
),
],
),
class PianoButton extends StatelessWidget {
const PianoButton(
{super.key, required this.onMainKeyPress, required this.onSuperKeyPress});
final Function onMainKeyPress;
final Function onSuperKeyPress;
@override
Widget build(BuildContext context) {
return Expanded(
flex: 1,
child: Stack(
clipBehavior: Clip.none,
children: [
Container(
height: double.infinity,
width: double.infinity,
padding: const EdgeInsets.only(right: 8, bottom: 2, top: 2),
child: GestureDetector(
onTap: onMainKeyPress(),
child: Container(
decoration: const BoxDecoration(
color: Colors.white, boxShadow: [BoxShadow(blurRadius: 2)]),
),
),
),
Positioned(
top: 2,
right: 98,
child: SizedBox(
width: 50,
height: 200,
child: GestureDetector(
onTap: onSuperKeyPress(),
child: Container(
decoration: const BoxDecoration(color: Colors.black),
),
),
],
),
);
}
}
class PianoButtonSuperKey extends StatelessWidget {
const PianoButtonSuperKey({super.key, required this.keyPress});
final Function keyPress;
@override
Widget build(BuildContext context) {
return Expanded(
flex: 1,
child: Container(
height: double.infinity,
width: double.infinity,
padding: const EdgeInsets.only(right: 8, bottom: 2, top: 2),
child: GestureDetector(
onTap: keyPress(),
child: Container(
decoration: const BoxDecoration(
color: Colors.white, boxShadow: [BoxShadow(blurRadius: 2)]),
),
),
),
);
}
}
I hope I could clear.
答案1
得分: 0
看起来你在你的GestureDetector的onTap方法中调用了函数onMainKeyPress和onSuperKeyPress并带有()。这会导致这些函数在构建小部件时立即执行,而不是在小部件被轻触时执行。
要解决这个问题,你可以在调用函数时从GestureDetector的onTap方法中删除()。例如,将onTap: onMainKeyPress()更改为onTap: onMainKeyPress。类似地,将onTap: onSuperKeyPress()更改为onTap: onSuperKeyPress。
英文:
It looks like you are calling the functions onMainKeyPress and onSuperKeyPress with () in your GestureDetector's onTap method. This is causing the functions to be executed immediately when the widget is built instead of when the widget is tapped.
To fix this, you can remove the () when calling the functions in your GestureDetector's onTap method. For example, change onTap: onMainKeyPress() to onTap: onMainKeyPress. Similarly, change onTap: onSuperKeyPress() to onTap: onSuperKeyPress.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论