美文网首页Android碎碎念优秀案例Android开发
思考像微信QQ视频通话最小化后悬浮展现实现思路

思考像微信QQ视频通话最小化后悬浮展现实现思路

作者: VelyVelyGood | 来源:发表于2017-01-22 12:29 被阅读1452次

    公司做的IM软件基于webrtc实现了音视频通话功能基础功能,新需求是要求通话的同时也可以处理别的东西,即在通话页面点击最小化按钮后视频通话页面变成了一个不大的窗口悬浮在窗口上且是全局的,即使回到home页面依然存在;

    这种需求非常合理,符合大家一贯的使用习惯,体验性也很棒;

    刚拿到需求在技术实现上并没有头绪,因为原本的视频通话展示逻辑是用的Activity,一开始想着通过改变Activity的尺寸来实现,但是基于Activity本身的生命周期特性决定了这样并不能达成缩小后的view界面悬浮在所有其他界面之上的要求;而安卓本身能够干这个的事情已知的是一个叫悬浮窗的东东,可以验证下;

    好在这个功能像微信优酷都有实现,我们不妨试着看看他们是怎么做的。以QQ为例,正常视频通话点击最小化通话界面会缩小成一个很小的区域放在界面顶部

    图来自网络

    去系统那查看权限发现应用显示悬浮窗权限是允许的,我们把改权限设置为不允许,再次视频通话后点击最小化,显示悬浮窗权限未获取的对话框!果然!

    那接下来的事情就好办了,将webrtc连接控制和流控制的逻辑抽取出来写成一个工具类,activity界面只做展示逻辑,点击最小化关闭activity,跳转到悬浮窗逻辑。悬浮窗逻辑这为了逻辑清晰我们可以放在一个service里创建,代码截图如下

    点击图片查看原图

    当点击最小化后关闭了视频通话中的WebRtcActivity,并创建FloatService,在其中创建悬浮窗口并设置Touch事件使其可以随手指滑动,将webrtc流渲染到悬浮窗口内的glSurfaceView上。

    当点击该窗口时,关闭floatService,移除悬浮窗口,跳转打开WebRtcActivity。

    以上就是Activity视频页面和悬浮窗口页面互相切换的逻辑,效果如下图

    相关文章

      网友评论

      • sing_song:融科通?
        sing_song:@VelyVelyGood 嗯看到了,公司应用挺多了。:+1:
        VelyVelyGood:我司自己的项目 AcuChat。
      • JaydenWfj:你好这个Demo源码可以发给我参考一下吗?
        VelyVelyGood:公司代码,不是 Demo。
      • WYJWXY:您好,我也在使用WebRtc实现视频通话功能,请问发起视频页面和接收到别人的视频呼叫页面以及视频通话页面这三个页面你是用一个Activity还是三个Activity做的?请问你如何将webrtc连接控制和流控制的逻辑抽取出来写成一个工具类呢?有没有Demo能发我一份参考?
      • coco猫:你好,请问在当点击最小化后关闭了视频通话中的WebRtcActivity,是直接finish掉,重新创建是重新创建一个新的activity吗
        VelyVelyGood:是的。点击最小化,finish 了 WebRtcActivity,创建了 FloatService出现悬浮窗口 ——> 点击悬浮窗口,finish 了 FloatService,重新创建 WebRtcActivity,从悬浮窗口模式切换到了正常模式。这些切换都是上层 UI 的 Video 展示层面的切换,负责 webrtc 连接控制和流控制的逻辑类实例是没有变化的
      • lesmiserables0:那么关键问题来了,如何将webrtc连接控制和流控制的逻辑抽取出来写成一个工具类呢,楼主有没有demo可供参考,视频推流我用的是腾讯云的IMSDK,AVSDK。
        fuuuuuccccck:你好 你实现了没呢 我们也是用的腾讯云的 他有提供一个setAvVideoView的方法,切换了后videoview的onfirstframe也收到了,但就是没画面
        VelyVelyGood:我司视频相关是直接拿webrtc改的,不知道第三方封装好的SDK是否对外暴露了这些逻辑,故不太具有参考性。另外请看文章标题,文章想要表达的是视频流activity展示与悬浮窗展示的切换逻辑思路。兄台你看的关键问题只是在你看来是关键而已,请注意审题。
      • ValienZh:iOS上面有类似的方式么
        VelyVelyGood: @ValienZh 有的,也是应用悬浮窗这样的组件

      本文标题:思考像微信QQ视频通话最小化后悬浮展现实现思路

      本文链接:https://www.haomeiwen.com/subject/uitobttx.html