dating_touchme_app/lib/widget/message/voice_item.dart

import 'dart:io';
import 'dart:math' as math;
import 'package:audioplayers/audioplayers.dart';
import 'package:dating_touchme_app/extension/ex_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:get/get.dart';
import 'package:im_flutter_sdk/im_flutter_sdk.dart';

import '../../../generated/assets.dart';
import '../../../controller/message/voice_player_manager.dart';

class VoiceItem extends StatefulWidget {
  final EMVoiceMessageBody voiceBody;
  final String messageId; // 消息ID，用作音频的唯一标识
  final bool isSentByMe;
  final bool showTime;
  final String formattedTime;

  const VoiceItem({
    required this.voiceBody,
    required this.messageId,
    required this.isSentByMe,
    required this.showTime,
    required this.formattedTime,
    super.key,
  });

  @override
  State<VoiceItem> createState() => _VoiceItemState();
}

class _VoiceItemState extends State<VoiceItem> with TickerProviderStateMixin {
  final VoicePlayerManager _playerManager = VoicePlayerManager.instance;
  late AnimationController _waveformAnimationController;
  int _animationFrame = 0;

  @override
  void initState() {
    super.initState();
    // 创建波形动画控制器
    _waveformAnimationController = AnimationController(
      vsync: this,
      duration: const Duration(milliseconds: 2000), // 2秒完成一个波浪周期
    );

    // 监听动画帧，更新波形
    _waveformAnimationController.addListener(() {
      if (mounted && _playerManager.isPlaying(widget.messageId)) {
        setState(() {
          // 使用动画值来计算波浪位置，让波浪从左到右传播
          _animationFrame++;
        });
      }
    });

    // 监听播放状态变化
    ever(_playerManager.currentPlayingId, (audioId) {
      if (mounted) {
        setState(() {});
        // 根据播放状态控制动画
        if (_playerManager.isPlaying(widget.messageId)) {
          if (!_waveformAnimationController.isAnimating) {
            _waveformAnimationController.repeat();
          }
        } else {
          _waveformAnimationController.stop();
          _waveformAnimationController.reset();
          _animationFrame = 0;
        }
      }
    });
    ever(_playerManager.playerState, (state) {
      if (mounted) {
        setState(() {});
        // 根据播放状态控制动画
        if (state == PlayerState.playing &&
            _playerManager.currentPlayingId.value == widget.messageId) {
          _waveformAnimationController.repeat();
        } else {
          _waveformAnimationController.stop();
          _animationFrame = 0;
        }
      }
    });
  }

  @override
  void dispose() {
    _waveformAnimationController.dispose();
    super.dispose();
  }

  // 处理播放/暂停
  Future<void> _handlePlayPause() async {
    try {
      // 获取音频文件路径
      String? filePath;
      final localPath = widget.voiceBody.localPath;
      final remotePath = widget.voiceBody.remotePath;

      // 优先使用本地路径
      if (remotePath != null && remotePath.isNotEmpty) {
        // 只有远程路径，尝试使用远程路径（audioplayers 可能支持网络URL）
        // 注意：如果远程路径是文件系统路径而不是URL，需要先下载
        if (remotePath.startsWith('http://') ||
            remotePath.startsWith('https://')) {
          filePath = remotePath;
        } else {
          SmartDialog.showToast('音频文件不存在，请等待下载完成');
          print('远程音频文件路径: $remotePath');
          return;
        }
      } else if (localPath.isNotEmpty) {
        final localFile = File(localPath);
        if (await localFile.exists()) {
          filePath = localPath;
        } else {
          SmartDialog.showToast('音频文件不存在');
          print('本地音频文件不存在: $localPath');
          return;
        }
      }

      if (filePath != null && filePath.isNotEmpty) {
        await _playerManager.play(widget.messageId, filePath);
      } else {
        SmartDialog.showToast('无法获取音频文件');
        print('音频文件路径为空');
      }
    } catch (e) {
      SmartDialog.showToast('播放失败: $e');
      print('播放音频失败: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    // 获取语音时长（秒）
    final duration = widget.voiceBody.duration;
    final durationText = '${duration}s';

    // 判断当前音频是否正在播放
    final isPlaying = _playerManager.isPlaying(widget.messageId);

    return Column(
      children: [
        // 显示时间
        if (widget.showTime) _buildTimeLabel(),
        Container(
          padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 8.h),
          child: Row(
            mainAxisAlignment: widget.isSentByMe
                ? MainAxisAlignment.end
                : MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              if (!widget.isSentByMe) _buildAvatar(),
              if (!widget.isSentByMe) SizedBox(width: 8.w),
              Container(
                margin: EdgeInsets.only(top: 10.h),
                padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 10.h),
                decoration: BoxDecoration(
                  color: widget.isSentByMe ? Color(0xff8E7BF6) : Colors.white,
                  borderRadius: BorderRadius.only(
                    topLeft: widget.isSentByMe
                        ? Radius.circular(12.w)
                        : Radius.circular(0),
                    topRight: widget.isSentByMe
                        ? Radius.circular(0)
                        : Radius.circular(12.w),
                    bottomLeft: Radius.circular(12.w),
                    bottomRight: Radius.circular(12.w),
                  ),
                ),
                child: Row(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    // 播放按钮
                    Container(
                      width: 20.w,
                      height: 20.w,
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        color: widget.isSentByMe ? Colors.white : Colors.black,
                      ),
                      child: Icon(
                        isPlaying ? Icons.pause : Icons.play_arrow,
                        color: widget.isSentByMe
                            ? Color(0xff8E7BF6)
                            : Colors.white,
                        size: 16.w,
                      ),
                    ),
                    SizedBox(width: 8.w),
                    // 时长文本
                    Text(
                      durationText,
                      style: TextStyle(
                        fontSize: 14.sp,
                        color: widget.isSentByMe ? Colors.white : Colors.black,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                    SizedBox(width: 8.w),
                    // 音频波形
                    _buildWaveform(),
                  ],
                ),
              ).onTap(() {
                _handlePlayPause();
              }),
              if (widget.isSentByMe) SizedBox(width: 8.w),
              if (widget.isSentByMe) _buildAvatar(),
            ],
          ),
        ),
      ],
    );
  }

  // 构建时间标签
  Widget _buildTimeLabel() {
    return Container(
      alignment: Alignment.center,
      padding: EdgeInsets.symmetric(horizontal: 16.w),
      child: Container(
        padding: EdgeInsets.symmetric(horizontal: 12.w),
        child: Text(
          widget.formattedTime,
          style: TextStyle(fontSize: 12.sp, color: Colors.grey),
        ),
      ),
    );
  }

  // 构建头像
  Widget _buildAvatar() {
    return Container(
      width: 40.w,
      height: 40.w,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(20.w),
        image: DecorationImage(
          image: AssetImage(Assets.imagesAvatarsExample),
          fit: BoxFit.cover,
        ),
      ),
    );
  }

  // 构建音频波形
  Widget _buildWaveform() {
    // 根据时长生成波形条数量（最多20个）
    final barCount = (widget.voiceBody.duration / 2).ceil().clamp(5, 20);
    final isPlaying = _playerManager.isPlaying(widget.messageId);

    return SizedBox(
      height: 16.h,
      child: Row(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: List.generate(barCount, (index) {
          double height;
          Color color;

          if (isPlaying) {
            // 播放时：波浪形动画效果
            // 使用正弦波函数创建波浪效果，从左到右传播
            // wavePhase: 时间因子(_animationFrame)让波浪移动，空间因子(index)让每个条的位置不同
            // 移除模运算，让波浪连续传播
            final wavePhase = _animationFrame * 0.15 + index * 0.6;
            // 使用正弦波计算高度，范围在 4-16 之间
            final sinValue = math.sin(wavePhase);
            final normalizedValue = (sinValue + 1) / 2; // 归一化到 0-1
            final baseHeight = 4 + normalizedValue * 12;
            height = (baseHeight.clamp(4, 16)).h;

            // 根据高度设置颜色透明度，创造渐变效果
            final opacity = 0.5 + normalizedValue * 0.5;
            color = widget.isSentByMe
                ? Colors.white.withOpacity(opacity.clamp(0.5, 1.0))
                : Colors.grey.withOpacity(opacity.clamp(0.5, 0.9));
          } else {
            // 未播放时：静态波形
            final random = (index * 7) % 5;
            final baseHeight = 6 + random * 2;
            height = (baseHeight.clamp(4, 16)).h;
            color = widget.isSentByMe
                ? Colors.white.withOpacity(0.8)
                : Colors.grey.withOpacity(0.6);
          }

          return AnimatedContainer(
            duration: const Duration(milliseconds: 100),
            curve: Curves.easeOut,
            width: 2.w,
            height: height,
            margin: EdgeInsets.symmetric(horizontal: 1.w),
            decoration: BoxDecoration(
              color: color,
              borderRadius: BorderRadius.circular(1.w),
            ),
          );
        }),
      ),
    );
  }
}