You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
169 lines
4.9 KiB
169 lines
4.9 KiB
import 'package:flutter/material.dart';
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
import 'package:im_flutter_sdk/im_flutter_sdk.dart';
|
|
|
|
import '../../../generated/assets.dart';
|
|
import 'emoji_text_widget.dart';
|
|
|
|
class TextItem extends StatelessWidget {
|
|
final EMTextMessageBody textBody;
|
|
final bool isSentByMe;
|
|
final bool showTime;
|
|
final String formattedTime;
|
|
final EMMessage message; // 添加消息对象以获取状态
|
|
final VoidCallback? onResend; // 添加重发回调
|
|
|
|
const TextItem({
|
|
required this.textBody,
|
|
required this.isSentByMe,
|
|
required this.showTime,
|
|
required this.formattedTime,
|
|
required this.message,
|
|
this.onResend,
|
|
super.key,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Column(
|
|
children: [
|
|
// 显示时间
|
|
if (showTime) _buildTimeLabel(),
|
|
Container(
|
|
padding: EdgeInsets.symmetric(
|
|
horizontal: 16.w,
|
|
vertical: 8.h,
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: isSentByMe ? MainAxisAlignment.end : MainAxisAlignment.start,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
if (!isSentByMe) _buildAvatar(),
|
|
if (!isSentByMe) SizedBox(width: 8.w),
|
|
// 发送消息时,状态在左侧,与消息气泡垂直居中对齐
|
|
if (isSentByMe)
|
|
Align(
|
|
alignment: Alignment.center,
|
|
child: Container(
|
|
margin: EdgeInsets.only(top: 10.h),
|
|
child: _buildMessageStatus(),
|
|
),
|
|
),
|
|
if (isSentByMe) SizedBox(width: 10.w),
|
|
Container(
|
|
constraints: BoxConstraints(maxWidth: 240.w),
|
|
margin: EdgeInsets.only(top: 10.h),
|
|
padding: EdgeInsets.symmetric(
|
|
horizontal: 12.w,
|
|
vertical: 8.h,
|
|
),
|
|
decoration: BoxDecoration(
|
|
color: isSentByMe ? Color(0xff8E7BF6) : Colors.white, // 发送方紫色,接收方白色
|
|
borderRadius: BorderRadius.only(
|
|
topLeft: isSentByMe ? Radius.circular(12.w) : Radius.circular(0),
|
|
topRight: isSentByMe ? Radius.circular(0) : Radius.circular(12.w),
|
|
bottomLeft: Radius.circular(12.w),
|
|
bottomRight: Radius.circular(12.w),
|
|
),
|
|
),
|
|
child: EmojiTextWidget(
|
|
text: textBody.content,
|
|
textStyle: TextStyle(
|
|
fontSize: 14.sp,
|
|
color: isSentByMe ? Colors.white : Colors.black, // 发送方白色文字,接收方黑色文字
|
|
),
|
|
emojiSize: 24.w,
|
|
),
|
|
),
|
|
if (isSentByMe) SizedBox(width: 8.w),
|
|
if (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(
|
|
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 _buildMessageStatus() {
|
|
// 只对发送的消息显示状态
|
|
if (!isSentByMe) {
|
|
return SizedBox.shrink();
|
|
}
|
|
|
|
// 检查消息状态
|
|
final status = message.status;
|
|
|
|
if (status == MessageStatus.FAIL) {
|
|
// 发送失败,显示重发按钮
|
|
return GestureDetector(
|
|
onTap: onResend,
|
|
child: Container(
|
|
width: 20.w,
|
|
height: 20.w,
|
|
decoration: BoxDecoration(
|
|
color: Colors.red.withOpacity(0.1),
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: Icon(
|
|
Icons.refresh,
|
|
size: 14.w,
|
|
color: Colors.red,
|
|
),
|
|
),
|
|
);
|
|
} else if (status == MessageStatus.PROGRESS) {
|
|
// 发送中,显示加载动画
|
|
return Container(
|
|
width: 16.w,
|
|
height: 16.w,
|
|
child: CircularProgressIndicator(
|
|
strokeWidth: 2,
|
|
valueColor: AlwaysStoppedAnimation<Color>(
|
|
Colors.grey,
|
|
),
|
|
),
|
|
);
|
|
} else {
|
|
// 发送成功,不显示任何状态
|
|
return SizedBox.shrink();
|
|
}
|
|
}
|
|
}
|