一、前言
视频悬浮窗功能还是比较难的，也比较复杂。声网也是没有提供相应的api或者demo，得自己做。
难点如下：
- 悬浮框显示了，原来界面怎么办，怎么让它隐藏起来
- 点击悬浮窗，怎么回到原来界面
- 从悬浮窗回到原来界面，通话时间怎么延续下去，而不是从0开始
- 在悬浮窗时，对方挂断了通话，怎么关闭悬浮窗
- 等等要处理的问题
二、先看下效果图
QQ图片20220506145204.jpg
三、解决思路
针对上面已知问题，说下解决方案
- 悬浮窗显示时，直接finish调原来界面，但需要做个标记，这种关闭是不能退出频道的，否则会挂断通话的
- 上面说到出现悬浮窗会直接finish界面，所以点击悬浮窗，也是新起一个通话界面，但是这是时通话中的界面。界面上所需的数据，就定义个对象，用于悬浮窗和界面之间互相传递的数据
- 从悬浮窗到原来界面，通话时间怎么延续问题。就是在悬浮窗上也开一个计时器
- 直接关闭悬浮窗即可。能做退出频道处理最好。
四、给下关键视频悬浮窗代码提供思路
/**
* @desc : 显示视频悬浮窗
* @author : congge on 2022-04-07 10:38
**/
private fun showVideoFloat(isCallOutGoing:Boolean,startCallBean:StartCallBean,microphoneStatus:Boolean,speakerStatus:Boolean,cameraCloseStatus:Boolean) {
EasyFloat.with(this.applicationContext)
// 设置浮窗xml布局文件/自定义View，并可设置详细信息
.setLayout(R.layout.layout_call_video_float) {
val fl_video_small = it.findViewById<FrameLayout>(R.id.fl_video_small)
fl_video_small.removeAllViews()
val surfaceView = RtcEngine.CreateRendererView(mContext)
LogUtils.i("surfaceViewRemote",surfaceViewRemote.toString())
fl_video_small.addView(surfaceView)
LogUtils.i("surfaceViewRemote1",fl_video_small.childCount.toString())
// Initializes the video view of a remote user.
rtcEngine?.setupRemoteVideo(
VideoCanvas(
surfaceView,
VideoCanvas.RENDER_MODE_HIDDEN,
videoUid
)
)
surfaceView.tag = videoUid
val ch_video_time = it.findViewById<Chronometer>(R.id.ch_video_time)
ch_video_time.base = mBinding.chChatVideoCallAcceptingTime.base
ch_video_time.start()
startCallBean.isCallOutGoing = isCallOutGoing
startCallBean.remoteCloseCamera = mBinding.tvVideoCallRemoteCameraStatus.visibility == View.VISIBLE
ch_video_time.setOnChronometerTickListener { ch ->
if (isCallOutGoing){
dealChatMediaCheckGold(ch.base,startCallBean.mediaId,rtcEngine,true)
}
startCallBean.secondCall = ((SystemClock.elapsedRealtime() - ch.base)/1000)
startCallBean.chBase = ch.base
//用于对方退出频道时，请求接口用
fl_video_small.setTag(R.id.startCallBean_tag,startCallBean)
}
//设置tag,保证activity关闭时，mRtcEventHandler不会回收
fl_video_small.setTag(R.id.rtcEventHandler_tag,mRtcEventHandler)
fl_video_small.setTag(R.id.rtcEngine_tag,rtcEngine)
RxViewUtils.prClick(fl_video_small) {
startCallBean.isFloatBackCall = true
startCallBean.videoUid = videoUid
startCallBean.callBaseTime = SystemClock.elapsedRealtime() - ch_video_time.base
startCallBean.microphone = microphoneStatus
startCallBean.speaker =speakerStatus
startCallBean.closeCamera = cameraCloseStatus
startCallBean.isShowGoldFloat = EasyFloat.appFloatIsShow(gold_float_tag)
CRouter.go(AppRouter.appSingleCall, obj = startCallBean, arg1 = if (isCallOutGoing) outGoing else inComing)
EasyFloat.dismissAppFloat(video_float_tag)
}
}
// 设置浮窗显示类型，默认只在当前Activity显示，可选一直显示、仅前台显示
.setShowPattern(ShowPattern.ALL_TIME)
// 设置吸附方式，共15种模式，详情参考SidePattern
.setSidePattern(SidePattern.RESULT_HORIZONTAL)
// 设置浮窗的标签，用于区分多个浮窗
.setTag(video_float_tag)
// 设置浮窗是否可拖拽
.setDragEnable(true)
// 设置浮窗的对齐方式和坐标偏移量
.setGravity(
Gravity.TOP or Gravity.RIGHT,
-CUtils.dp2px(mContext, 16),
CUtils.dp2px(mContext, 40)
)
// 设置系统浮窗的不需要显示的页面
//.setFilter(SingleCallActivity::class.java)
// 创建浮窗
.show()
if (!this.isFinishing){
isShowFloatFinish = true
finishAndRemoveTask()
}
}
如果要悬浮框完整代码或者其他声网音视频功能有问题，私信我
