关于webrtc里面的opengl设置坐标系的问题,解决ios和android通信图像是反的问题

本文分析了一个视频渲染项目中遇到的iOS和Android平台间OpenGL图像显示方向不一致的问题,并提供了解决方案。通过修改webrtc代码,使iOS和Android的OpenGL代码能够根据平台进行适应,从而解决了图像反向的问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

之前做基于webrtc的视频通话项目的时候一直纠结于ios和android为什么用相同的opengl代码存在两个平台通信的时候图像是反的问题,但是由于时间比较紧张,没有做太多研究,就修改了webrtc的代码,使ios和android的代码根据平台来适应。

今天做另外一个视频渲染的项目,也遇到了这个问题,刚好有时间就停下来研究了一下!我把webrtc里面的代码贴出来,给大家分析一下。

  1. RenderOpenGles20::RenderOpenGles20() :  
  2. _id(0),  
  3. _textureWidth(-1),  
  4. _textureHeight(-1)  
  5. {  
  6.     WEBRTC_TRACE(kTraceDebug, kTraceVideoRenderer, _id, "%s: id %d",  
  7.                  __FUNCTION__, (int) _id);  
  8.       
  9.     // <span style="color:#3366FF;">默认是这样写的</span>  
  10.     const GLfloat vertices[20] = {  
  11.         // X, Y, Z, U, V  
  12.         -1, -1, 0, 1, 0, // Bottom Left  
  13.         1, -1, 0, 0, 0, //Bottom Right  
  14.         1, 1, 0, 0, 1, //Top Right  
  15.         -1, 1, 0, 1, 1 }; //Top Left  
  16.       
  17.     memcpy(_vertices, vertices, sizeof(_vertices));  
  18. }  
  19.   
  20. <span style="font-size:18px;color:#3366FF;">// 这里提供一个修改接口</span>  
  21. // SetCoordinates  
  22. // Sets the coordinates where the stream shall be rendered.  
  23. // Values must be between 0 and 1.  
  24. int32_t RenderOpenGles20::SetCoordinates(int32_t zOrder,  
  25.                                          const float left,  
  26.                                          const float top,  
  27.                                          const float right,  
  28.                                          const float bottom) {  
  29.     if ((top > 1 || top < 0) || (right > 1 || right < 0) ||  
  30.         (bottom > 1 || bottom < 0) || (left > 1 || left < 0)) {  
  31.         WEBRTC_TRACE(kTraceError, kTraceVideoRenderer, _id,  
  32.                      "%s: Wrong coordinates", __FUNCTION__);  
  33.         return -1;  
  34.     }  
  35.       
  36.     // Bottom Left  
  37.     _vertices[0] = (left * 2) - 1;  
  38.     _vertices[1] = -1 * (2 * bottom) + 1;  
  39.     _vertices[2] = zOrder;  
  40.       
  41.     //Bottom Right  
  42.     _vertices[5] = (right * 2) - 1;  
  43.     _vertices[6] = -1 * (2 * bottom) + 1;  
  44.     _vertices[7] = zOrder;  
  45.       
  46.     //Top Right  
  47.     _vertices[10] = (right * 2) - 1;  
  48.     _vertices[11] = -1 * (2 * top) + 1;  
  49.     _vertices[12] = zOrder;  
  50.       
  51.     //Top Left  
  52.     _vertices[15] = (left * 2) - 1;  
  53.     _vertices[16] = -1 * (2 * top) + 1;  
  54.     _vertices[17] = zOrder;  
  55.       
  56.     return 0;  
  57. }  
分析上面的代码,其实我们不难看出,修改的只是针对x,y,z做微调,从webrtc里面的例子看出来,它设置的是

zOrder:0

left:0.0

top:0.0

right:1.0

bottom:1.0

意思是什么呢,zOrder是0,表示坐标的原点在屏幕的中心,中心垂直是y坐标,从下向上递增,中心水平是x坐标,从左向右递增,区间是(-1,1)。用户根据设备来计算,通过调用SetCoordinates来调整你视图位置。

之前遇到ios和android是反的的原因是两种系统坐标原理不同(不明白的同学,可以百度查),所以存在这样的问题。

今天知道原理以后,经过修正,验证OK,这里贴出来给大家分享一下。

在ios里面这样设置:

zOrder:0

left:0.0

top:0.0

right:1.0

bottom:1.0

在android里面这样设置

zOrder:0

left:1.0

top:1.0

right:0.0

bottom:0.0

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值