首页 > 其他分享 >AWTK 如何用 OpenGL 绘制图形

AWTK 如何用 OpenGL 绘制图形

时间:2024-09-07 14:52:53浏览次数:12  
标签:info OpenGL 0.0 0.5 AWTK 图形 绘制


在有 GPU 的情况下,AWTK 使用 OpenGL 绘制图形。但是你会发现,如果自己在 paint 事件中使用 OpenGL 绘制图形,图形是无法显示的。原因是,AWTK 采用 nanovg 绘制图形,而 nanovg 并不是在绘制时立即执行的,而是在整个界面绘制完成 (EndFrame 中)集中提交给 GPU 执行的。所以,如果在 paint 事件中使用 OpenGL 绘制图形,这些图形会被 nanovg 绘制的图形覆盖掉。这里我们介绍一下,使用 OpenGL 绘制图形时的几个注意事项:

AWTK 如何用 OpenGL 绘制图形_绘制图形

1. 需要提交前面的缓存图形

在使用 OpenGL 绘制之前,需要调用函数 vgcanvas_flush 刷新前面的缓存图形。

示例:

static ret_t on_paint(void* ctx, event_t* e) {
  gl_info_t* info = &g_gl_info;
  paint_event_t* evt = paint_event_cast(e);
  vgcanvas_t* vg = canvas_get_vgcanvas(evt->c);
  return_value_if_fail(vg != NULL, RET_BAD_PARAMS);

  vgcanvas_flush(vg);

  glview_render_triangle(info, info->triangle1_vao);
  glview_render_triangle(info, info->triangle2_vao);

  return RET_OK;
}

2. 需要初始化 OpenGL

在 Windows 平台,需要调用 opengl_init 初始化 OpenGL。

示例:

static ret_t glview_init(gl_info_t* info) {
#ifdef WIN32
  opengl_init();
#endif/*WIN32*/

  float triangle1_vertices[] = { 
      -0.5f, -0.5f, 0.0f, 
      0.5f,  -0.5f, 0.0f,
      0.0f,  0.5f,  0.0f
  };  

  float triangle2_vertices[] = { 
      -0.5f, -1.0f, 0.0f, 
      0.5f,  -1.0f, 0.0f,
      0.0f,  -0.5f, 0.0f
  };  

  info->program = glhelper_create_program(s_vertexShaderSource, s_fragmentShaderSource);
  info->triangle2_vao = glhelper_create_vao(triangle1_vertices, 3); 
  info->triangle1_vao = glhelper_create_vao(triangle2_vertices, 3); 

  return RET_OK;
}

3. 需要链接 glad 库

env.Program(os.path.join(BIN_DIR, 'demo_opengl'), ['opengl.c', 'assets.c'], LIBS=env['LIBS'] + ['glad'])

完整示例请参考


标签:info,OpenGL,0.0,0.5,AWTK,图形,绘制
From: https://blog.51cto.com/u_15314083/11945026

相关文章

  • Canvas艺术之旅:了解几个绘制基本图形的 API
    了解几个绘制基本图形的APICanvas是HTML5提供的绘画API,可以用于在Web页面上绘制各种基本图形。本文介绍一些Canvas绘制基本图形的API:前置条件注意:本文章所提供的代码示例默认已经进行了canvas元素定义,DOM获取以及canvas的上下文获取,以下进行代码演示时将......
  • 传统CV算法——基于Opencv的图像绘制
    直线绘制参数解析:(图像矩阵,直线起始坐标,直线终止坐标、颜色、线条厚度)cv2.line()是OpenCV中用于绘制直线的函数。参数说明:img:要绘制直线的图像矩阵。(100,30):直线的起点坐标。(210,180):直线的终点坐标。color:直线的颜色,三个值分别表示蓝色、绿色和红色通道的强度。这里(......
  • 根据点坐标X,Y,Z和方向向量Vx,Vy,Vz绘制射线簇
    根据点坐标X,Y,Z和方向向量Vx,Vy,Vz绘制射线簇1.数据导入paraview可以直接导入以逗号分隔的txt或csv数据,但无法自动识别,需要使用过滤器转为paraview可以操作的数组。以下是以空格分隔的txt数据为例,paraview5.11.1版本。数据的存储格式如下图所示,以空格隔开。x,y,z为点的空间坐标,vx,v......
  • Cesium 展示——绘制等值线图
    文章目录需求分析1.在指定经纬度范围内进行绘制(两点之间的矩形)2.在自定义范围内进行绘制(多点之间的不规则范围)升级版资料需求分析下载安装引入npminstallcesiumnpminstall@turf/turfimport*......
  • 《OpenCV计算机视觉》—— 图像轮廓检测与绘制
    文章目录一、轮廓的检测二、轮廓的绘制图像轮廓检测与绘制的代码实现三、轮廓的近似一、轮廓的检测轮廓检测是指在包含目标和背景的数字图像中,忽略背景和目标内部的纹理以及噪声干扰的影响,采用一定的技术和方法来实现目标轮廓提取的过程注意:做轮廓检测前需要将图片......
  • 【思考模型框架】因果关系图和因果回路图,通过绘制因果关系图,深入了解问题的本质,并找到
    一、定义1.1因果关系图因果关系图,是一种图形化表示方法,用于展示变量之间的因果关系。因果关系图,通常由节点(代表变量)和边(代表因果关系)组成。因果关系图,帮助人们理解复杂系统中不同因素是如何相互作用的。因果关系图,是一种用于分析问题原因和结果的思维工具。因果关系......
  • (4-1-1)绘制柱状图:绘制基本的柱状图(1)
    柱状图又被称为柱形图、长条图、条状图或棒形图,是一种以长方形的长度为变量的统计图表。在现实应用中,经常使用柱状图来展示数据分析的结果,这样可以更加直观的展示数据分析结果。在本节的内容中,将详细讲解使用Python绘制柱状图的知识。4.1 绘制基本的柱状图在数据可视化分析......
  • C++和OpenGL实现3D游戏编程【连载7】——文字和汉字的显示
    1、本节实现的内容上一节我们讨论了纹理在二维平面内不规则图形贴图的相关基础操作,本节我们开始了解游戏里文字以及汉字的显示方法。本节课我们将从基本的ASCII字符显示,拓展到中文字符的显示,最后再讲到纹理字符的显示,并对各种文字显示方法的优缺点和使用场景进行分析,这节课......
  • python 绘制折线图包括设置字体折线粗细以及标题立方m等
    #!usr/bin/envpython#-*-coding:utf-8-*-"""@author:Suyue@file:flyzhexian.py@time:2024/09/04@desc:"""importpandasaspdimportmatplotlibimportmatplotlib.pyplotaspltimportmatplotlib.tickerastickermatplot......
  • 纯前端Canvas绘制海报
    封装类:/***Canvas绘制海报*/classPoster{canvas:HTMLCanvasElement;context:CanvasRenderingContext2D;constructor(el:string,width:number,height:number){constcanvas=document.querySelector<HTMLCanvasElement>(el);if(canvas......