feat:语音跟读作答结果动效&语音

吴启风
1 parent 61e3478a
Showing 13 changed files with 205 additions and 26 deletions
assets/lotties/excellent.zip
assets/lotties/good.zip
assets/lotties/great.zip
assets/sounds/excellent.mp3
assets/sounds/good.mp3
assets/sounds/great.mp3
assets/sounds/try_again.mp3
lib/common/utils/show_star_reward_dialog.dart
lib/common/widgets/cheer_reward_widget.dart
lib/common/widgets/star_reward_widget.dart
lib/pages/practice/bloc/topic_picture_bloc.dart
lib/pages/reading/reading_page.dart
lib/utils/audio_player_util.dart
 import 'package:flutter/material.dart';
  
+import '../widgets/cheer_reward_widget.dart';
 import '../widgets/star_reward_widget.dart';
  
 void showStarRewardDialog(BuildContext context, {
@@ -26,4 +27,30 @@ void showStarRewardDialog(BuildContext context, {
       );
     },
   );
+}
+
+void showCheerRewardDialog(BuildContext context, {
+  required String lottieFile,
+  double width = 200,
+  double height = 200,
+}) {
+  showDialog(
+    context: context,
+    barrierDismissible: false, // 点击对话框外部不关闭对话框
+    builder: (BuildContext context) {
+      return Dialog(
+        backgroundColor: Colors.transparent, // 设置对话框背景为透明
+        insetPadding: const EdgeInsets.all(0), // 去除对话框的内边距
+        child: CheerRewardWidget(
+          lottieFile: lottieFile,
+          width: width,
+          height: height,
+          isPlaying: true,
+          onAnimationEnd: () {
+            Navigator.of(context).pop(); // 关闭对话框
+          },
+        ),
+      );
+    },
+  );
 }
 \ No newline at end of file
+import 'package:flutter/material.dart';
+import 'package:lottie/lottie.dart';
+
+import '../../utils/log_util.dart';
+
+class CheerRewardWidget extends StatefulWidget {
+  final String lottieFile;
+  final double width;
+  final double height;
+  final bool isPlaying;
+  final VoidCallback onAnimationEnd;
+
+  const CheerRewardWidget({
+    Key? key,
+    required this.lottieFile,
+    required this.width,
+    required this.height,
+    required this.isPlaying,
+    required this.onAnimationEnd,
+  }) : super(key: key);
+
+  @override
+  _CheerRewardWidgetState createState() => _CheerRewardWidgetState();
+}
+
+class _CheerRewardWidgetState extends State<CheerRewardWidget>
+    with SingleTickerProviderStateMixin {
+  late final AnimationController _controller;
+  late final Future<LottieComposition> _futureComposition;
+  bool _isVisible = false;
+  static const String TAG = "CheerRewardWidget";
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = AnimationController(vsync: this);
+    _loadComposition();
+  }
+
+  @override
+  void didUpdateWidget(CheerRewardWidget oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (widget.isPlaying && !_controller.isAnimating) {
+      _startAnimation();
+    }
+  }
+
+  void _loadComposition() {
+    // final composition = await AssetLottie('assets/lotties/recorder_input.zip').load();
+    // setState(() {
+    //   _composition = composition;
+    //   _controller.duration = _composition.duration;
+    // });
+
+    _futureComposition = _loadLottieComposition();
+
+    if (widget.isPlaying) {
+        _startAnimation();
+    }
+  }
+
+  void _startAnimation() {
+    Log.d("$TAG _startAnimation");
+    setState(() {
+      _isVisible = true;
+    });
+
+    _futureComposition.then((composition) {
+      Log.d("$TAG _futureComposition.then duration=${composition.duration}");
+      _controller.duration = composition.duration;
+      _controller.forward().whenCompleteOrCancel(() {
+        setState(() {
+          _isVisible = false;
+        });
+        widget.onAnimationEnd(); // 调用外部回调函数
+      });
+    });
+  }
+
+  Future<LottieComposition> _loadLottieComposition() async {
+    return await AssetLottie(widget.lottieFile).load();
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: SizedBox(
+          width: widget.width,
+          height: widget.height,
+          child: FutureBuilder<LottieComposition>(
+              future: _futureComposition,
+              builder: (context, snapshot) {
+                if (snapshot.hasData) {
+                  final composition = snapshot.data!;
+                  return Lottie(
+                    composition: composition,
+                    controller: _controller,
+                    renderCache: RenderCache.raster,
+                    width: widget.width,
+                    height: widget.height,
+                  );
+                } else {
+                  return const SizedBox.shrink();
+                }
+              })
+
+          // child: Lottie(
+          //   composition: _composition,
+          //   controller: _controller,
+          //   renderCache: RenderCache.raster,
+          //   width: widget.width,
+          //   height: widget.height,
+          // ),
+          ),
+    );
+  }
+}
@@ -68,7 +68,7 @@ class _StarRewardWidgetState extends State&lt;StarRewardWidget&gt;
     _futureComposition.then((composition) {
       Log.d("$TAG _futureComposition.then duration=${composition.duration}");
       _controller.duration = composition.duration;
-      _controller.forward().whenComplete(() {
+      _controller.forward().whenCompleteOrCancel(() {
         setState(() {
           _isVisible = false;
         });
@@ -93,7 +93,7 @@ class _StarRewardWidgetState extends State&lt;StarRewardWidget&gt;
         assetPath = 'assets/lotties/star3_reward.zip';
         break;
     }
-    return await AssetLottie('assets/lotties/reward.zip').load();
+    return await AssetLottie(assetPath).load();
   }
  
   @override
@@ -14,11 +14,14 @@ import &#39;package:wow_english/models/course_process_entity.dart&#39;;
 import 'package:wow_english/pages/section/subsection/base_section/bloc.dart';
 import 'package:wow_english/pages/section/subsection/base_section/event.dart';
 import 'package:wow_english/pages/section/subsection/base_section/state.dart';
+import 'package:wow_english/utils/audio_player_util.dart';
 import 'package:wow_english/utils/toast_util.dart';
  
 import '../../../common/permission/permissionRequester.dart';
+import '../../../common/utils/click_with_music_controller.dart';
 import '../../../common/utils/show_star_reward_dialog.dart';
 import '../../../route/route.dart';
+import '../../../utils/log_util.dart';
  
 part 'topic_picture_event.dart';
  
@@ -251,7 +254,10 @@ class TopicPictureBloc
   ///为空则数据异常，用于是否晃动时需要
   bool? checkAnswerRight(int selectIndex) {
     CourseProcessTopics? topics = _entity?.topics?[_currentPage];
-    if (topics == null || topics.topicAnswerList == null || selectIndex < 0 || selectIndex >= topics.topicAnswerList!.length) {
+    if (topics == null ||
+        topics.topicAnswerList == null ||
+        selectIndex < 0 ||
+        selectIndex >= topics.topicAnswerList!.length) {
       return null;
     }
     CourseProcessTopicsTopicAnswerList? answerList =
@@ -300,7 +306,29 @@ class TopicPictureBloc
     final Map args = event.message as Map;
     final result = args['result'] as Map;
     final overall = result['overall'].toString();
-    showStarRewardDialog(context, starCount: _evaluateScore(overall));
+    int score = int.parse(overall);
+    AudioPlayerUtilType audioPlayerUtilType;
+    String? lottieFile;
+    if (score > 90) {
+      audioPlayerUtilType = AudioPlayerUtilType.excellent;
+      lottieFile = 'assets/lotties/excellent.zip';
+    } else if (score > 70) {
+      audioPlayerUtilType = AudioPlayerUtilType.great;
+      lottieFile = 'assets/lotties/great.zip';
+    } else if (score > 50) {
+      audioPlayerUtilType = AudioPlayerUtilType.good;
+      lottieFile = 'assets/lotties/good.zip';
+    } else {
+      audioPlayerUtilType = AudioPlayerUtilType.tryAgain;
+    }
+    if (lottieFile != null) {
+      showCheerRewardDialog(context, lottieFile: lottieFile);
+    }
+    Log.d("WQF audioPlayerUtilType=$audioPlayerUtilType lottieFile=$lottieFile");
+    ClickWithMusicController.instance
+        .playMusicAndPerformAction(context, audioPlayerUtilType, () => {
+          ///todo 是否需要自动翻页
+    });
     // showToast('测评成功,分数是$overall', duration: const Duration(seconds: 5));
     _isRecording = false;
     emitter(XSVoiceTestState());
@@ -364,7 +392,7 @@ class TopicPictureBloc
     _isResultSoundPlaying = true;
     _forbiddenWhenCorrect = isCorrect;
     if (isCorrect) {
-      await audioPlayer.play(AssetSource('correct_voice'.assetMp3));
+      await audioPlayer.play(AssetSource('right'.assetMp3));
     } else {
       await audioPlayer.play(AssetSource('wrong'.assetMp3));
     }
@@ -8,7 +8,7 @@ import &#39;package:wow_english/route/route.dart&#39;;
  
 import '../../common/core/app_consts.dart';
 import '../../common/core/user_util.dart';
-import '../../common/widgets/throttledGesture_gesture_detector.dart';
+import '../../common/widgets/recorder_widget.dart';
 import '../../models/course_process_entity.dart';
 import '../../utils/log_util.dart';
 import 'bloc/reading_bloc.dart';
@@ -186,25 +186,22 @@ class _ReadingPage extends StatelessWidget {
                       SizedBox(
                         width: 10.w,
                       ),
-                      ThrottledGestureDetector(
-                          throttleTime: 1000,
-                          onTap: () {
-                            if (bloc.isRecording) {
-                              bloc.add(XSVoiceStopEvent());
-                            } else {
-                              bloc.add(XSVoiceStartEvent(
-                                  bloc.readingContent(),
-                                  '0',
-                                  UserUtil.getUser()?.id.toString()));
-                            }
-                          },
-                          child: Image.asset(
-                            bloc.isRecording
-                                ? 'micro_phone'.assetGif
-                                : 'micro_phone'.assetPng,
-                            height: 47.h,
-                            width: 47.w,
-                          )),
+                      RecorderWidget(
+                        isPlaying: bloc.isRecording,
+                        isClickable: bloc.voicePlayState != VoicePlayState.playing,
+                        width: 60.w,
+                        height: 60.w,
+                        onTap: () {
+                          if (bloc.isRecording) {
+                            bloc.add(XSVoiceStopEvent());
+                          } else {
+                            bloc.add(XSVoiceStartEvent(
+                                bloc.readingContent(),
+                                '0',
+                                UserUtil.getUser()?.id.toString()));
+                          }
+                        },
+                      ),
                       SizedBox(
                         width: 10.w,
                       ),
@@ -14,7 +14,11 @@ enum AudioPlayerUtilType {
   quizTime('quiz_time'),
   countWithMe('count_with_me_instrumental'),
   inMyTummy('in_my_tummy_instrumental'),
-  touch('touch_instrumental');
+  touch('touch_instrumental'),
+  excellent('excellent'),
+  great('great'),
+  good('good'),
+  tryAgain('try_again');
  
   const AudioPlayerUtilType(this.path);