admin 发表于 2015-8-5 16:25:20

2015-08-05 在Web页面实现1:1显示视频

    AnyChat for Web SDK支持在Windows平台的Web页面上显示视频,通常情况下会在html页面中开辟一片区域,放置一个DIV标签,然后调用API:BRAC_SetVideoPos(userid, parentdivid, selfid)即可将对应用户的视频显示在指定DIV上面,默认情况下,当DIV大小与视频本身的分辩率不匹配时,AnyChat内核会自动进行缩放处理,保证视频全部显示在指定的DIV上。

    在一些特定的应用场景下,比如远程桌面,当采集分辩率与显示DIV大小不匹配时,若对视频进行缩放处理,则会导致视频上面的字符失真,影响用户体验。改善的方法就是让视频1:1显示,解决的方法就是:创建一个和视频大小相等的显示DIV层即可,相关步骤如下:

1、将上级DIV设置为滚动条模式,当视频分辩率高于DIV大小时,将出现滚动条,修改html代码:
<div id="AnyChatRemoteVideoDiv" style="margin:0 auto; overflow:auto; border:1px solid #000000;"></div>

2、响应AnyChat用户视频分辩率变化的异步事件,动态改变显示DIV层的大小,修改javascript脚本:
// 用户视频分辩率发生变化,dwUserId(INT)表示用户ID号,dwResolution(INT)表示用户的视频分辨率组合值(低16位表示宽度,高16位表示高度)
function OnAnyChatVideoSizeChange(dwUserId,dwResolution){
      if(dwUserId!=mTargetUserId)
                return;
      var width=dwResolution&0x0000ffff;
      var height=dwResolution>>16;
      GetID("ANYCHAT_VIDEO_REMOTE").style.width=width+"px";
      GetID("ANYCHAT_VIDEO_REMOTE").style.height=height+"px";
      AddLog("OnAnyChatVideoSizeChange(dwUserId=" + dwUserId + ", dwResolution=" + width + "x" + height + ")", LOG_TYPE_EVENT);
}


详情可参考附件中的示例代码,另外建议更新AnyChat for Web SDK到最新版本,重新安装Web插件获得最佳效果。
页: [1]
查看完整版本: 2015-08-05 在Web页面实现1:1显示视频