Jason/zh-chat-flutter
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

基础页面

Browse Source
This commit is contained in:
Jason.Chen
2022-10-20 14:21:39 +08:00
parent 49ad269c2b
commit 42ba10ec61
62 changed files with 5132 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
lib/views/home/widgets/action_button.dart Normal file
View File

@@ -0,0 +1,39 @@
import 'package:chat/configs/app_colors.dart';
import 'package:flutter/material.dart';
class ActionButton extends StatelessWidget {
final String text;
final Color color;
final VoidCallback? onTap;
const ActionButton(
this.text, {
this.color = AppColors.red,
this.onTap,
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
onTap?.call();
},
child: Container(
color: AppColors.white,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Center(
child: Text(
text,
style: TextStyle(
fontWeight: FontWeight.w500,
color: color,
),
),
),
),
),
);
}
}

76
lib/views/home/widgets/action_item.dart Normal file
View File

@@ -0,0 +1,76 @@
import 'package:chat/configs/app_colors.dart';
import 'package:flutter/material.dart';
class ActionItem extends StatelessWidget {
final String title;
final String? extend;
final Widget? rightWidget;
final String? bottom;
final VoidCallback? onTap;
const ActionItem(
this.title, {
this.extend,
this.rightWidget,
this.bottom,
this.onTap,
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
onTap?.call();
},
child: Container(
color: AppColors.white,
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
title,
style: const TextStyle(
fontSize: 16,
),
),
Expanded(child: Container()),
if (extend != null)
Text(
extend!,
style: const TextStyle(
color: AppColors.unactive,
),
),
rightWidget ??
const Icon(
Icons.arrow_forward_ios,
size: 16,
color: AppColors.unactive,
),
],
),
if (bottom != null && bottom!.isNotEmpty)
Padding(
padding: const EdgeInsets.only(top: 4),
child: Text(
bottom!,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppColors.unactive,
fontSize: 12,
),
),
),
],
),
),
);
}
}

212
lib/views/home/widgets/conversation_item.dart Normal file
View File

@@ -0,0 +1,212 @@
import 'package:chat/configs/app_colors.dart';
import 'package:chat/routes/conversation_routes.dart';
import 'package:chat/services/tim/conversation_service.dart';
import 'package:chat/utils/convert.dart';
import 'package:chat/views/home/widgets/group_avatar.dart';
import 'package:chat/views/home/widgets/message_preview_widget.dart';
import 'package:chat/views/home/widgets/pop_menu_item.dart';
import 'package:chat/widgets/custom_avatar.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tencent_im_sdk_plugin/enum/conversation_type.dart';
import 'package:tencent_im_sdk_plugin/models/v2_tim_conversation.dart';
class ConversationItem extends StatelessWidget {
final V2TimConversation conversation;
const ConversationItem(this.conversation, {Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
height: 68,
decoration: BoxDecoration(
color: conversation.isPinned! ? AppColors.page : null,
),
padding: const EdgeInsets.only(
left: 16,
right: 16,
top: 12,
bottom: 12,
),
child: GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
Get.toNamed(
ConversationRoutes.index,
arguments: {
'conversation': conversation,
},
);
},
onLongPress: () async {
await _showLongPressMenu();
},
child: Row(
children: [
Stack(
clipBehavior: Clip.none,
children: [
conversation.type == ConversationType.V2TIM_C2C
? CustomAvatar(
conversation.faceUrl,
)
: GroupAvatar(conversation.groupID!),
Visibility(
visible: conversation.recvOpt == 0 &&
conversation.unreadCount! > 0,
child: Positioned(
right: -5,
top: -5,
child: Container(
width: 18,
height: 18,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(18),
color: AppColors.red,
),
alignment: Alignment.center,
child: Center(
child: Text(
conversation.unreadCount! > 99
? '99+'
: conversation.unreadCount.toString(),
style: const TextStyle(
fontSize: 10,
color: AppColors.white,
),
),
),
),
),
),
Visibility(
visible: conversation.recvOpt == 1 &&
conversation.unreadCount! > 0,
child: const Positioned(
right: -3,
top: -3,
child: Icon(
Icons.circle_rounded,
color: AppColors.red,
size: 8,
),
),
)
],
),
const SizedBox(width: 16),
Expanded(
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
conversation.showName!,
style: const TextStyle(
fontSize: 16,
),
),
MessagePreviewWidget(conversation.lastMessage),
],
),
),
Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Text(
conversation.lastMessage == null
? ''
: Convert.timeFormat(
conversation.lastMessage!.timestamp!,
format: 'MM/dd HH:mm',
),
style: const TextStyle(
fontSize: 12,
color: Colors.grey,
),
),
if (conversation.recvOpt == 1)
const Icon(
Icons.notifications_off_outlined,
size: 14,
color: AppColors.unactive,
),
],
),
],
),
),
);
}
Future<void> _showLongPressMenu() async {
showModalBottomSheet(
context: Get.context!,
isScrollControlled: true,
backgroundColor: AppColors.white,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(top: Radius.circular(8)),
),
builder: (context) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
PopMenuItem(
conversation.isPinned! ? '取消置顶' : '聊天置顶',
onTap: () {
TimConversationService.to.setOnTop(conversation);
Get.back();
},
),
const Divider(height: 0),
PopMenuItem(
conversation.recvOpt == 1 ? '取消免打扰' : '消息免打扰',
onTap: () {
TimConversationService.to.setReceiveOpt(conversation);
Get.back();
},
),
const Divider(height: 0),
PopMenuItem(
'清空聊天记录',
onTap: () {
TimConversationService.to.clearHistoryMessage(conversation);
Get.back();
},
),
const Divider(height: 0),
PopMenuItem(
'标为已读',
onTap: () {
TimConversationService.to.markAsRead(conversation);
Get.back();
},
),
const Divider(height: 0),
PopMenuItem(
'删除该聊天',
onTap: () {
TimConversationService.to.delete(conversation);
Get.back();
},
),
const Divider(height: 0.4),
Container(
color: AppColors.page,
height: 8,
),
const Divider(height: 0.4),
PopMenuItem(
'取消',
onTap: () {
Get.back();
},
),
],
);
},
);
}
}

140
lib/views/home/widgets/friend_selector.dart Normal file
View File

@@ -0,0 +1,140 @@
import 'package:azlistview/azlistview.dart';
import 'package:chat/configs/app_colors.dart';
import 'package:chat/models/im/contact_info_model.dart';
import 'package:chat/services/tim/friend_service.dart';
import 'package:chat/utils/im_tools.dart';
import 'package:chat/widgets/custom_avatar.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tencent_im_sdk_plugin/models/v2_tim_friend_info.dart';
import 'package:tencent_im_sdk_plugin/models/v2_tim_group_member_full_info.dart';
class FriendSelector extends StatefulWidget {
final Function(List<V2TimFriendInfo>) onChanged;
final List<V2TimGroupMemberFullInfo?>? lockedUsers;
const FriendSelector({
required this.onChanged,
this.lockedUsers,
Key? key,
}) : super(key: key);
@override
State<FriendSelector> createState() => _FriendSelectorState();
}
class _FriendSelectorState extends State<FriendSelector> {
/// 选中的好友列表
List<V2TimFriendInfo> selectList =
List<V2TimFriendInfo>.empty(growable: true);
/// 选择列表改变的事件，更新选中列表
_selectListChange(id) {
setState(() {
if (selectList.contains(id)) {
selectList.remove(id);
} else {
selectList.add(id);
}
});
widget.onChanged(selectList);
}
@override
Widget build(BuildContext context) {
return GetX<TimFriendService>(
builder: (_) {
return AzListView(
data: _.contacts,
itemCount: _.contacts.length,
itemBuilder: (BuildContext context, int index) {
ContactInfoModel info = _.contacts[index];
return _contactItem(info);
},
susItemBuilder: (BuildContext context, int index) {
ContactInfoModel model = _.contacts[index];
return ImTools.susItem(
context,
model.getSuspensionTag(),
susHeight: 32,
);
},
indexBarData: SuspensionUtil.getTagIndexList(_.contacts).toList(),
indexBarOptions: ImTools.indexBarOptions,
);
},
);
}
Widget _contactItem(
ContactInfoModel info,
) {
bool isDisable = widget.lockedUsers == null
? false
: widget.lockedUsers!
.where(
(e) => e!.userID == info.friendInfo!.userID,
)
.isNotEmpty;
return Column(
children: [
GestureDetector(
onTap: () {},
child: Container(
color: AppColors.white,
padding: const EdgeInsets.symmetric(vertical: 4),
child: GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: isDisable
? null
: () {
setState(() {
_selectListChange(info.friendInfo);
});
},
child: Row(
children: [
Radio<V2TimFriendInfo>(
groupValue:
selectList.contains(info.friendInfo) || isDisable
? info.friendInfo
: null,
onChanged: isDisable
? null
: (value) {
setState(() {
_selectListChange(info.friendInfo);
});
},
value: info.friendInfo!,
toggleable: true,
),
CustomAvatar(
info.friendInfo!.userProfile!.faceUrl,
size: 32,
radius: 2,
),
const SizedBox(
width: 16,
),
Expanded(
child: Text(
info.name,
style: const TextStyle(
fontSize: 16,
),
),
),
],
),
),
),
),
const Divider(
height: 0,
indent: 92,
),
],
);
}
}

68
lib/views/home/widgets/group_avatar.dart Normal file
View File

@@ -0,0 +1,68 @@
import 'package:chat/configs/app_colors.dart';
import 'package:chat/services/tim/group_service.dart';
import 'package:chat/widgets/custom_avatar.dart';
import 'package:flutter/material.dart';
import 'package:tencent_im_sdk_plugin/models/v2_tim_group_member_full_info.dart';
class GroupAvatar extends StatefulWidget {
final String groupID;
final double size;
const GroupAvatar(
this.groupID, {
this.size = 44,
Key? key,
}) : super(key: key);
@override
State<GroupAvatar> createState() => _GroupAvatarState();
}
class _GroupAvatarState extends State<GroupAvatar> {
List<V2TimGroupMemberFullInfo?>? members;
@override
void initState() {
super.initState();
TimGroupService.to.members(widget.groupID, count: 9).then((value) {
setState(() {
members = value;
});
});
}
@override
Widget build(BuildContext context) {
return Container(
width: widget.size,
height: widget.size,
decoration: BoxDecoration(
border: Border.all(
color: AppColors.border,
width: 0.4,
),
borderRadius: BorderRadius.circular(4),
),
child: members == null
? CustomAvatar('')
: GridView.builder(
padding: const EdgeInsets.all(1),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount:
(members != null && members!.length > 4) ? 3 : 2,
childAspectRatio: 1,
crossAxisSpacing: 1,
mainAxisSpacing: 1,
),
itemCount: members!.length,
itemBuilder: (context, index) {
return CustomAvatar(
members![index]?.faceUrl,
size: widget.size / 3,
radius: 2,
);
},
),
);
}
}

111
lib/views/home/widgets/group_user_selector.dart Normal file
View File

@@ -0,0 +1,111 @@
import 'package:chat/configs/app_colors.dart';
import 'package:chat/widgets/custom_avatar.dart';
import 'package:flutter/material.dart';
import 'package:tencent_im_sdk_plugin/models/v2_tim_group_member_full_info.dart';
class GroupUserSelector extends StatefulWidget {
final Function(List<V2TimGroupMemberFullInfo>) onChanged;
final List<V2TimGroupMemberFullInfo> selectedList;
final List<V2TimGroupMemberFullInfo?> originalList;
const GroupUserSelector({
required this.onChanged,
required this.selectedList,
required this.originalList,
Key? key,
}) : super(key: key);
@override
State<GroupUserSelector> createState() => _GroupUserSelectorState();
}
class _GroupUserSelectorState extends State<GroupUserSelector> {
/// 选中的好友列表
List<V2TimGroupMemberFullInfo> selectList =
List<V2TimGroupMemberFullInfo>.empty(growable: true);
/// 选择列表改变的事件，更新选中列表
_selectListChange(id) {
setState(() {
if (selectList.contains(id)) {
selectList.remove(id);
} else {
selectList.add(id);
}
});
widget.onChanged(selectList);
}
@override
Widget build(BuildContext context) {
return ListView.separated(
itemBuilder: (_, index) {
return _contactItem(widget.originalList[index]!);
},
separatorBuilder: (_, index) {
return const Divider(
height: 0,
);
},
itemCount: widget.originalList.length,
);
}
Widget _contactItem(
V2TimGroupMemberFullInfo info,
) {
return Column(
children: [
GestureDetector(
onTap: () {},
child: Container(
color: AppColors.white,
padding: const EdgeInsets.symmetric(vertical: 4),
child: GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
setState(() {
_selectListChange(info);
});
},
child: Row(
children: [
Radio<V2TimGroupMemberFullInfo>(
groupValue: selectList.contains(info) ? info : null,
onChanged: (value) {
setState(() {
_selectListChange(info);
});
},
value: info,
toggleable: true,
),
CustomAvatar(
info.faceUrl,
size: 32,
radius: 2,
),
const SizedBox(
width: 16,
),
Expanded(
child: Text(
info.nickName!,
style: const TextStyle(
fontSize: 16,
),
),
),
],
),
),
),
),
const Divider(
height: 0,
indent: 92,
),
],
);
}
}

26
lib/views/home/widgets/message_preview_widget.dart Normal file
View File

@@ -0,0 +1,26 @@
import 'package:chat/configs/app_colors.dart';
import 'package:chat/utils/im_tools.dart';
import 'package:flutter/material.dart';
import 'package:tencent_im_sdk_plugin/models/v2_tim_message.dart';
class MessagePreviewWidget extends StatelessWidget {
final V2TimMessage? message;
const MessagePreviewWidget(this.message, {Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
if (message == null) {
return const Text('');
}
return Text(
ImTools.parseMessage(message),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppColors.unactive,
fontSize: 14,
),
);
}
}

29
lib/views/home/widgets/pop_menu_item.dart Normal file
View File

@@ -0,0 +1,29 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
class PopMenuItem extends StatelessWidget {
final String text;
final VoidCallback? onTap;
const PopMenuItem(
this.text, {
this.onTap,
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: () {
onTap?.call();
},
child: Container(
height: 52,
width: Get.width,
alignment: Alignment.center,
child: Text(text),
),
);
}
}