opengl渲染矩形,如何实现opengl渲染,并用Xcomponent显示出来

opengl渲染矩形

HarmonyOS
2024-05-21 22:19:29
1.8w浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
计算机编程小强

本文主要介绍如何实现opengl渲染,并用Xcomponent显示出来

相关核心API

EGL

Xcomponent

核心代码介绍

ArkTs测调用

build() { 
  Column() { 
    Row() { 
      Text($r('app.string.title')) 
        .fontSize($r('app.float.title_text_font_size')) 
        .fontWeight(CommonConstants.FONT_WEIGHT) 
        .margin({ left: $r('app.float.title_text_margin_left'), top: $r('app.float.title_text_margin_top') }) 
    } 
    .margin({ top: $r('app.float.title_margin_top') }) 
    .width(CommonConstants.FULL_PARENT) 
    .height($r('app.float.title_height')) 
 
    Column() { 
      XComponent({ 
        id: CommonConstants.XCOMPONENT_ID, 
        type: CommonConstants.XCOMPONENT_TYPE, 
        libraryname: CommonConstants.XCOMPONENT_LIBRARY_NAME 
      }).onLoad((xComponentContext?: object | Record<string, () => void>) => { 
        if (xComponentContext) { 
          this.xComponentContext = xComponentContext as Record<string, () => void>; 
        } 
      }) 
    } 
    .margin({ 
      top: $r('app.float.xcomponent_margin_top'), 
      left: $r('app.float.xcomponent_margin_left'), 
      right: $r('app.float.xcomponent_margin_right') 
    }) 
    .height(CommonConstants.XCOMPONENT_HEIGHT) 
 
    Row() { 
      Button($r('app.string.button_text')) 
        .fontSize($r('app.float.button_font_size')) 
        .fontWeight(CommonConstants.FONT_WEIGHT) 
        .margin({ bottom: $r('app.float.button_margin_bottom') }) 
        .onClick(() => { 
          if (this.xComponentContext) { 
            this.xComponentContext.drawRectangle(); 
          } 
        }) 
        .width(CommonConstants.BUTTON_WIDTH) 
        .height($r('app.float.button_height')) 
    } 
    .width(CommonConstants.FULL_PARENT) 
    .justifyContent(FlexAlign.Center) 
    .alignItems(VerticalAlign.Bottom) 
    .layoutWeight(CommonConstants.LAYOUT_WEIGHT) 
  }.width(CommonConstants.FULL_PARENT).height(CommonConstants.FULL_PARENT) 
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.

初始化环境

EGL渲染矩形

void EGLCore::Draw() 
{ 
    m_flag = false; 
    OH_LOG_Print(LOG_APP, LOG_INFO, LOG_PRINT_DOMAIN, "EGLCore", "Draw"); 
    GLint position = PrepareDraw(); 
    if (POSITION_ERROR == position) { 
        OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw get position failed"); 
        return; 
    } 
    if (!ExecuteDraw(position, BACKGROUND_COLOR, BACKGROUND_RECTANGLE_VERTICES, 
        sizeof(BACKGROUND_RECTANGLE_VERTICES))) { 
        OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw execute draw background failed"); 
        return; 
    } 
    const GLfloat rectangleVertices[] = { 
        -m_widthPercent, FIFTY_PERCENT, 
        m_widthPercent, FIFTY_PERCENT, 
        m_widthPercent, -FIFTY_PERCENT, 
        -m_widthPercent, -FIFTY_PERCENT 
    }; 
    if (!ExecuteDraw(position, DRAW_COLOR, rectangleVertices, sizeof(rectangleVertices))) { 
        OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw execute draw rectangle failed"); 
        return; 
    } 
    if (!FinishDraw()) { 
        OH_LOG_Print(LOG_APP, LOG_ERROR, LOG_PRINT_DOMAIN, "EGLCore", "Draw FinishDraw failed"); 
        return; 
    } 
    m_flag = true; 
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.

绘制前准备,获取position

释放相关资源

实现效果

适配版本信息

 IDE:DevEco Studio 4.0.1.501

 SDK:HarmoneyOS 4.0.0.38

分享
微博
QQ
微信
回复
2024-05-22 21:22:03


相关问题
HarmonyOS VideoDecoder使用OpenGL渲染
580浏览 • 1回复 待解决
为何picker-view无法显示出来
7537浏览 • 2回复 待解决
XComponent使用OpenGl ES
1909浏览 • 1回复 待解决
OpenGL无法正常渲染某些分辨率YUV数据
961浏览 • 0回复 待解决
XComponentopenGL实现3D图形绘制
2524浏览 • 1回复 待解决
如何openGL做解码后处理
2237浏览 • 0回复 待解决
OpenGL相关术语的理解
978浏览 • 1回复 待解决
HarmonyOS OPENGL ES外部纹理使用
692浏览 • 1回复 待解决