- 1. 1. 绘图 API 总表
- 2. 2. on_draw 触发机制(必须先懂)
- 3. 3. 颜色:RGB565
- 4. 4. 应用案例:15 种绘制TypusSchalter!
- 5. 4.1 工程配置
- 6. 4.2 框架:mode 表 + switch Unterteilung发
- 7. 5. 外部图片(SD/U 盘)与截图
LUA 画图 API 全套:直线、矩形、半透矩形、圆、椭圆、文字、图片、屏内/外部图片(SD/U 盘)、截图。核心机制是 on_draw(screen, control) Kontrollen级自绘回调——所有 draw_xxx 指令必须在 on_draw 里调用才生效。适用 HMI&M 系列&Dx 系列。
1. 绘图 API 总表
| 函数 | Parameter | 说明 |
|---|---|---|
set_pen_color(color) |
RGB565 颜色 | 设置画笔前景色,作用于线条/边框/轮廓/Text描边 |
draw_line(x0,y0,x1,y1,width) |
width 1~10 | 画直线,颜色取gegenwärtig画笔 |
draw_rect(x0,y0,x1,y1,fill) |
fill 1=填充/0=边框 | 矩形,x0,y0 左上角,x1,y1 右下角 |
draw_rect_alpha(x0,y0,x1,y1,alpha) |
alpha 0~255 | 半透明实心矩形,0=全透/255=不透明,做遮罩层 |
draw_circle(x,y,r,fill) |
fill 0=实心/非0=空心(值为线宽) | 画圆,x,y 圆心,r 半径 |
draw_ellipse(x0,y0,x1,y1,fill) |
外接矩形两角,fill 同上 | 画内切于矩形的椭圆 |
draw_image(image_id,frame_id,dstx,dsty,w,h,srcx,srcy) |
image_id 查 build/image.xml;frame_id 动画帧 | 画工程图片资源,支持缩放和裁剪 |
draw_text(text,x,y,w,h,font_id,size,color,align,charcode) |
align 0左/1中/2右;charcode 0=UTF-8/1=GBK | 区域内画文字 |
load_surface(filename) |
JPEG/PNG 路径 | Laden外部图片返回句柄(不走 image.bin) |
draw_surface(surface,dstx,dsty,w,h,srcx,srcy) |
surface 句柄 | 画bereits geladen的外部图片,支持裁剪缩放,必须在 on_draw 里调 |
destroy_surface(surface) |
句柄 | 释放单个图层资源 |
destroy_all_surface() |
– | 批Quantität释放所有bereits geladen图层 |
get_surface_size(surface) |
句柄 | 获取图层原始像素宽高 |
clear_image_buffer() |
– | 释放内部图片资源缓存 |
screen_shoot(filepath) |
vollständig路径含扩展名 | gegenwärtig画面存为 JPEG |
2. on_draw 触发机制(必须先懂)
on_draw(screen_id, control_id) 是Das System回调,用户不得直接调用。control_id 必须 ≠ 0,否则自绘FunktionUnwirksam。触发条件:
- 画面含动画、视频、RTC 等动态元素Erfrischen
- 用户触摸/Operationen屏幕Kontrollen
- Drehbuch set_xxx 更新Kontrollen属性
- Die Serie/LUA 改Register.导致KontrollenStatus变化
- 主动调用 redraw()
多图层机制:HMI 用Kontrollen Z 轴顺序(Herausgeber器里Kontrollen叠放顺序)当图层管理。on_draw 对每个可重绘Kontrollen独立触发,按 control_id 判断往哪个图层画。Beispiel:蓝色矩形 ID=10 在下层画「水果」,黄色矩形 ID=11 在上层画「小岛」,黄色会盖住蓝色部Unterteilung。
function on_draw(screen_id, control_id)
if screen_id == 0 and control_id == 1 then
draw_surface(surface[1], 293, 88, 222, 353, 0, 0) -- 裁剪显示
elseif screen_id == 0 and control_id == 2 then
draw_surface(surface[2], 314, 158, 180, 250, 0, 0)
end
end
3. 颜色:RGB565
所有颜色Parameter都是 16 位 RGB565:高 5 位 Red(0~31)、中 6 位 Green(0~63)、低 5 位 Blue(0~31),范围 0x0000~0xFFFF。
| 颜色 | RGB(888) | RGB565 | Lua 常Quantität建议 |
|---|---|---|---|
| 红 | (255,0,0) | 0xF800 | COLOR_RED = 0xF800 |
| 绿 | (0,255,0) | 0x07E0 | COLOR_GREEN = 0x07E0 |
| 蓝 | (0,0,255) | 0x001F | COLOR_BLUE = 0x001F |
| 白 | (255,255,255) | 0xFFFF | COLOR_WHITE = 0xFFFF |
| 黑 | (0,0,0) | 0x0000 | COLOR_BLACK = 0x0000 |
4. 应用案例:15 种绘制TypusSchalter!
4.1 工程配置
15 个字设置KnopfAlles geschlossen联 LW6101,常Quantität值 1~15 依次对应:直线/矩形/半透矩形/圆/椭圆/图片ID/文字/屏内图片/销毁图片/销毁所有图片/获取图大小/视频窗口截图/屏幕截图/画SD图/画U盘图片。15 个位Status指示灯关联 LW6100 切画笔颜色。
4.2 框架:mode 表 + switch Unterteilung发
penColor = {0xF800, 0x001F} -- 红、蓝
CUR_COLOR = 0xF800 -- 初始颜色
draw_type = 0 -- gegenwärtig绘制Typus
mode = { -- 绘制Typus表
line = 1, rect = 2, rect_alpha = 3, circle = 4, ellipse = 5,
imageId = 6, text = 7, surface_path3 = 8, destroyOne = 9,
destroyAll = 10, getSurface = 11, videoShoot = 12,
screenShoot = 13, surface_pathsd = 14, surface_pathusb = 15
}
function on_update(slave, vtype, addr)
if addr == 0x6100 then
CUR_COLOR = penColor[get_uint16(VT_LW, addr) + 1] -- 切画笔
elseif addr == 0x6101 then
draw_type = get_uint16(VT_LW, addr) -- 切绘制Typus
end
redraw() -- 触发重绘
end
function on_draw(screen_id, control_id)
set_pen_color(CUR_COLOR)
local switch = {
[mode.line] = function(control) -- 键值1
draw_line(225, 253, 405, 253) -- 默认宽度1
draw_line(508, 128, 508, 378, 5) -- 宽度5
end,
[mode.rect] = function(control) -- 键值2
draw_rect(225, 128, 225+180, 128+250, 0) -- 不填充
draw_rect(418, 163, 418+180, 128+180, 1) -- 填充
end,
[mode.rect_alpha] = function(control) -- 键值3
draw_rect_alpha(225, 128, 225+180, 128+250, 200) -- 透明度200
draw_rect_alpha(418, 163, 418+180, 128+180, 230) -- 透明度230
end,
[mode.circle] = function(control) -- 键值4
draw_circle(300, 253, 100, 0) -- 实心
draw_circle(450, 253, 150, 1) -- 空心(线宽1)
end,
[mode.ellipse] = function(control) -- 键值5
draw_ellipse(225, 128, 225+180, 128+250, 0) -- 实心
draw_ellipse(418, 163, 418+180, 128+180, 1) -- 空心
end,
[mode.text] = function(control) -- 键值7
draw_text("VisualHMI", 100, 300, 200, 40,
0, 24, CUR_COLOR, 1, 0) -- 居中 UTF-8
end,
}
if switch[draw_type] then
switch[draw_type](control)
end
end
5. 外部图片(SD/U 盘)与截图
-- Laden SD 卡图片(load_surface 支持 JPEG/PNG)
if draw_type == mode.surface_pathsd then
surface[1] = load_surface("1:/pic.png")
redraw()
end
-- on_draw 里绘制
if draw_type == mode.surface_pathsd then
if surface[1] then
draw_surface(surface[1], 225, 128, 180, 250, 0, 0)
end
end
-- 截图zu SD 卡
if draw_type == mode.screenShoot then
screen_shoot("1:/shot.jpg")
end
用 load_surface Laden的外部图片不进工程 image.bin,是Betrieb期从文件Das System读。用完必须 destroy_surface 释放,否则内存泄漏;大图或带透明通道的 PNG 特别吃内存。
整理自 广州大彩科技 VisualHMI 开发Dokumentation(hmi-doc.gz-dc.com)LUA Unterricht「画图」,版权归大彩科技所有。
Antwort veröffentlichen