一爪喘、前言
視頻懸浮窗功能還是比較難的,也比較復(fù)雜纠拔。聲網(wǎng)也是沒有提供相應(yīng)的api或者demo,得自己做泛豪。
難點如下:
- 懸浮框顯示了稠诲,原來界面怎么辦,怎么讓它隱藏起來
- 點擊懸浮窗诡曙,怎么回到原來界面
- 從懸浮窗回到原來界面臀叙,通話時間怎么延續(xù)下去,而不是從0開始
- 在懸浮窗時价卤,對方掛斷了通話劝萤,怎么關(guān)閉懸浮窗
- 等等要處理的問題
二、先看下效果圖
QQ圖片20220506145204.jpg
三慎璧、解決思路
針對上面已知問題床嫌,說下解決方案
- 懸浮窗顯示時,直接finish調(diào)原來界面胸私,但需要做個標(biāo)記厌处,這種關(guān)閉是不能退出頻道的,否則會掛斷通話的
- 上面說到出現(xiàn)懸浮窗會直接finish界面岁疼,所以點擊懸浮窗阔涉,也是新起一個通話界面,但是這是時通話中的界面。界面上所需的數(shù)據(jù)瑰排,就定義個對象贯要,用于懸浮窗和界面之間互相傳遞的數(shù)據(jù)
- 從懸浮窗到原來界面,通話時間怎么延續(xù)問題椭住。就是在懸浮窗上也開一個計時器
- 直接關(guān)閉懸浮窗即可郭毕。能做退出頻道處理最好。
四函荣、給下關(guān)鍵視頻懸浮窗代碼提供思路
/**
* @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)
// 設(shè)置浮窗xml布局文件/自定義View显押,并可設(shè)置詳細(xì)信息
.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)
}
//設(shè)置tag,保證activity關(guān)閉時傻挂,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)
}
}
// 設(shè)置浮窗顯示類型乘碑,默認(rèn)只在當(dāng)前Activity顯示,可選一直顯示金拒、僅前臺顯示
.setShowPattern(ShowPattern.ALL_TIME)
// 設(shè)置吸附方式兽肤,共15種模式,詳情參考SidePattern
.setSidePattern(SidePattern.RESULT_HORIZONTAL)
// 設(shè)置浮窗的標(biāo)簽绪抛,用于區(qū)分多個浮窗
.setTag(video_float_tag)
// 設(shè)置浮窗是否可拖拽
.setDragEnable(true)
// 設(shè)置浮窗的對齊方式和坐標(biāo)偏移量
.setGravity(
Gravity.TOP or Gravity.RIGHT,
-CUtils.dp2px(mContext, 16),
CUtils.dp2px(mContext, 40)
)
// 設(shè)置系統(tǒng)浮窗的不需要顯示的頁面
//.setFilter(SingleCallActivity::class.java)
// 創(chuàng)建浮窗
.show()
if (!this.isFinishing){
isShowFloatFinish = true
finishAndRemoveTask()
}
}
如果要懸浮框完整代碼或者其他聲網(wǎng)音視頻功能有問題资铡,私信我