uniapp实现聊天功能-uniapp聊天源码

泡泡IM uniapp版聊天源码是一套完整的基于uniapp开发的聊天软件源码，可编译成微信小程序、安卓 IOS APP聊天软件、H5网页聊天室。uniapp聊天源码未加密，无外部依赖，可私有化部署，可二次开发。文档全面，接口丰富，方便二次开发或者对接现有项目。uniapp聊天源码一次收费，终身使用。

聊天软件主要通能
1、支持发语音、文字、图片、表情、录制视频
2、支持私聊、群聊
3、群聊支持建群、退群、解散群组、禁言、踢人、拉人进群、群备注等功能、管理员
4、个人信息支持更改昵称、头像、个性签名等
5、支持查看历史消息、离线消息
6、支持好友查找、好友申请、同意好友申请、拒绝申请、删除好友，好友备注
7、支持消息撤回，脏字过滤
8、支持通讯录，按字母顺序排列
9、离线消息栏推送能力
10、管理后台

聊天源码技术栈：
编辑器：HBuilderX
技术框架：uni-app + vue
后端：PHP 语言, ThinkPHP框架
即时通讯：WebSocket workerman
数据库：MySQL
Web服务器：Nginx 或 Apache

代码片段：

switch[checked]::before {
    transform: scale(0, 0);
}

switch .wx-switch-input,
switch .uni-switch-input {
    border: none;
    padding: 0 24px;
    width: 48px;
    height: 26px;
    margin: 0;
    border-radius: 100rpx;
}

switch .wx-switch-input:not([class*="bg-"]),
switch .uni-switch-input:not([class*="bg-"]) {
    background: #888888 !important;
}

switch .wx-switch-input::after,
switch .uni-switch-input::after {
    margin: auto;
    width: 26px;
    height: 26px;
    border-radius: 100rpx;
    left: 0rpx;
    top: 0rpx;
    bottom: 0rpx;
    position: absolute;
    transform: scale(0.9, 0.9);
    transition: all 0.1s ease-in-out 0s;
}
/* www.popoim.com */
switch .wx-switch-input.wx-switch-input-checked::after,
switch .uni-switch-input.uni-switch-input-checked::after {
    margin: auto;
    left: 22px;
    box-shadow: none;
    transform: scale(0.9, 0.9);
}

radio-group {
    display: inline-block;
}

switch.radius .wx-switch-input::after,
switch.radius .wx-switch-input,
switch.radius .wx-switch-input::before,
switch.radius .uni-switch-input::after,
switch.radius .uni-switch-input,
switch.radius .uni-switch-input::before {
    border-radius: 10rpx;
}

uniapp聊天效果截图

转自 https://www.popoim.com/im/article/9