Flutter高仿微信系列共59篇,从Flutter客户端、Kotlin客户端、Web服务器、数据库表结构、Xmpp即时通讯服务器、视频通话服务器、腾讯云服务器全面讲解。
详情请查看
效果图:

实现代码:
import 'package:flutter/material.dart';
import 'package:wnchat2/bean/groupchat/group_bean.dart';
import 'package:wnchat2/bean/groupchat/group_user_bean.dart';
import 'package:wnchat2/common/common_utils.dart';
import 'package:wnchat2/common/sp_utils.dart';
import 'package:wnchat2/common/wn_app_bar.dart';
import 'package:wnchat2/event/base_event.dart';
import 'package:wnchat2/groupchat/group_update_name.dart';
import 'package:wnchat2/main/contacts_details_page.dart';
import 'package:wnchat2/repository/group_chat_repository.dart';
import 'package:wnchat2/repository/group_repository.dart';
import 'package:wnchat2/repository/user_repository.dart';
import 'package:wnchat2/routers/routers.dart';
import 'package:wnchat2/utils/loading_dialog_utils.dart';
import '../bean/user/userbean.dart';
import '../common/event_bus_utils.dart';
import '../manager/app_manager.dart';
import '../repository/group_user_repository.dart';
import '../utils/log_utils.dart';
import 'show_group_member_item.dart';
/**
* Author : wangning
* Email : maoning20080809@163.com
* Date : 2022/11/6 19:46
* Description : 显示群成员
*/
class ShowGroupMember extends StatefulWidget{
String groupId;
ShowGroupMember({required this.groupId});
@override
State<StatefulWidget> createState() => _ShowGroupMemberState();
}
class _ShowGroupMemberState extends State<ShowGroupMember>{
GroupBean? _groupBean;
List<GroupUserBean> _groupUserList = [];
bool isLoading = false;
String account = SpUtils.getString(CommonUtils.LOGIN_ACCOUNT);
//每个个数宽度
double itemWidth = 44;
//显示个数
int gridCount = 5;
@override
void initState() {
super.initState();
LogUtils.d("show_group_member 跳转的群id:${widget.groupId}");
_getData();
}
_getData() async {
_groupBean = await GroupRepository.getInstance().findGroupByGroupId(widget.groupId);
_groupUserList = await GroupUserRepository.getInstance().findAllGroupUserByGroupId(widget.groupId)??[];
itemWidth = AppManager.getInstance().getWidth(context) / gridCount;
//如果群成员不是好友,先下载群成员个人信息到本地数据库
for(int i = 0; i < _groupUserList.length; i++){
GroupUserBean groupUserBean = _groupUserList[i];
UserBean? localUserBean = await UserRepository.getInstance().findUserByAccount(groupUserBean.account??"");
LogUtils.d("成员列表:${groupUserBean.toJson()} ");
if(localUserBean == null){
UserBean userBean = await UserRepository.getInstance().getUserServer(groupUserBean.account??"");
UserRepository.getInstance().insertUserLocal(userBean);
}
}
setState(() {
//尾部+号
_groupUserList?.add(GroupUserBean());
});
}
//修改群名
void _updateGroupName(){
bool isOwner = false;
for(int i = 0; i< _groupUserList.length; i++){
GroupUserBean groupUserBean = _groupUserList[i];
LogUtils.d("是否账号:${account}, ${groupUserBean.toJson()}");
if(account == groupUserBean.account &&
(groupUserBean.accountType == GroupUserBean.ACCOUNT_TYPE_OWNER||
groupUserBean.accountType == GroupUserBean.ACCOUNT_TYPE_ADMIN)){
LogUtils.d("选择的账号:${account}, ${groupUserBean.toJson()}");
isOwner = true;
break;
}
}
LogUtils.d("是否成员:${isOwner}");
if(isOwner){
Navigator.push(context, MaterialPageRoute(builder: (context) => GroupUpdateName(groupId: widget.groupId)));
} else {
LoadingDialogUtils.showTipDialog(context, msg : "当前群聊仅群主/群管理员可以修改群聊名称");
}
}
//删除并退出对话框
void _deleteAndExistDialog(){
LoadingDialogUtils.showBaseDialog(context, msg: "确定要删除并退出吗?", clickConfirm: (){
_deleteAndExist();
}, clickCancel: (){
});
}
//删除并退出
void _deleteAndExist() async {
LoadingDialogUtils.showLoadingContentDialog(context);
String account = SpUtils.getAccount();
List<String> members = [account];
GroupUserBean? groupUserBean = await GroupUserRepository.getInstance().findGroupUserByAccountAndGroupId(account, widget.groupId);
//清空群聊信息
await GroupChatRepository.getInstance().deleteAllGroupChatByGroupId(widget.groupId);
//删除群聊用户
await GroupUserRepository.getInstance().deleteGroupUserByGroupId(account, widget.groupId);
await GroupUserRepository.getInstance().deleteGroupUserByGroupIdAndAccountServer(account, widget.groupId);
LoadingDialogUtils.dimissLoadingDialog(context);
Navigator.popUntil(context, (route) {return route.isFirst;});
}
//清空聊天记录对话框
void _cleanGroupChatDialog(){
LoadingDialogUtils.showBaseDialog(context, msg: "确定要清空聊天记录吗?", clickConfirm: (){
_cleanGroupChat();
}, clickCancel: (){
});
}
//清空聊天记录
void _cleanGroupChat(){
GroupChatRepository.getInstance().deleteAllGroupChatByGroupId(widget.groupId);
//刷新聊天页面
eventBus.emit(BaseEvent(BaseEvent.TYPE_REFRESH_GROUP, result: HashMap<String, Object>()));
Navigator.pop(context);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: WnAppBar.getAppBar(context, Text("聊天信息(${_groupUserList.length -1 })")),
body: Column(
children: [
SizedBox(height: 10,),
getImageGridView(),
lineWidget(),
updateGroupName(),
lineWidget(),
SizedBox(height: 50,),
cleanGroupChat(),
lineWidget(),
deleteAndExist(),
lineWidget(),
SizedBox(height: 10,),
],
),
);
}
//显示图片九宫格
Widget getImageGridView(){
return Expanded(
child:GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: gridCount,childAspectRatio: 1,),
itemCount: _groupUserList.length,
itemBuilder: (context, index){
return InkWell(
onTap: (){
Navigator.push(context,MaterialPageRoute(builder: (context)=>ContactsDetails(toChatId: _groupUserList[index].account??"")));
},
child: Container(
alignment: Alignment.center,
margin: EdgeInsets.only(left: 3, top: 6, right: 3, bottom: 6),
child: showAvatarWidget(index),
),
);
},
)
);
}
//修改群名称
Widget updateGroupName() {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: InkWell(
onTap: (){
_updateGroupName();
},
child: Container(
color: Colors.grey.shade300,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
margin: EdgeInsets.only(bottom: 15.0, top: 15, left: 12),
child: Text("群聊名称",style: TextStyle(fontSize: 22, color: Colors.black, fontWeight: FontWeight.bold),),
),
Expanded(child: Text("")),
Container(
margin: EdgeInsets.only(bottom: 15.0, top: 15, right: 8),
child: Text("${_groupBean?.groupName}",style: TextStyle(fontSize: 22, color: Colors.grey.shade800),),
),
Container(
margin: EdgeInsets.only(top:15, bottom: 15.0, right: 10.0),
child: Icon(Icons.chevron_right,color: Colors.grey,),
),
],
),
),
),
),
],
);
}
//清空聊天记录
Widget cleanGroupChat(){
return InkWell(
onTap: (){
_cleanGroupChatDialog();
},
child: Container(
width: double.infinity,
alignment: Alignment.center,
margin: const EdgeInsets.only(top: 12, bottom: 12),
child: const Text("清空聊天记录", style: TextStyle(fontSize: 20, color: Colors.red, fontWeight: FontWeight.bold),),
),
);
}
//删除并退出
Widget deleteAndExist(){
return InkWell(
onTap: (){
_deleteAndExistDialog();
},
child: Container(
width: double.infinity,
alignment: Alignment.center,
margin: EdgeInsets.only(top: 12, bottom: 12),
child: const Text("删除并退出", style: TextStyle(fontSize: 20, color: Colors.red, fontWeight: FontWeight.bold),),
),
);
}
Widget lineWidget() {
return Container(
width: double.infinity,
height: 0.5,
color: Colors.grey.shade300,
);
}
//显示头像,最后一个显示加号图标
Widget showAvatarWidget(int index){
if(index == _groupUserList.length -1){
//加号
return InkWell(
onTap: (){
Navigator.pushNamed(context, Routes.add_group_member, arguments: {
"groupId":widget.groupId //参数map
});
},
child: CommonUtils.getBaseIconPng("wc_group_chat_add"),
);
} else {
GroupUserBean groupUserBean = _groupUserList[index];
return ShowGroupMemberItem(groupUserBean: groupUserBean);
}
}
}



















