前言
泡泡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
Css 代码片段：
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;
}
h5+JS代码片段
<template><view><view class="cu-custom" :style="[{height:CustomBar + 'px'}]"><view class="cu-bar fixed" :style="style" :class="[bgImage!=''?'none-bg text-white bg-img':'',bgColor, isBack?'':'justify-end']"><view class="action" @tap="BackPage" v-if="isBack"><text class="cuIcon-back"></text><slot name="backText"></slot></view><view class="content" :style="[{top:StatusBar + 'px'}]"><slot name="content"></slot></view><slot name="right"></slot></view></view></view>
</template><script>export default {data() {return {StatusBar: this.StatusBar,CustomBar: this.CustomBar,networkState: {}};},name: 'cu-custom',computed: {style() {var StatusBar= this.StatusBar;var CustomBar= this.CustomBar;var bgImage = this.bgImage;var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;if (this.bgImage) {style = `${style}background-image:url(${bgImage});`;}return style}},props: {bgColor: {type: String,default: ''},isBack: {type: [Boolean, String],default: false},bgImage: {type: String,default: ''},},methods: {BackPage() {uni.navigateBack({delta: 1});}}}
</script><style>
</style>
页面展现：
