合宙Air724UG LuatOS-Air LVGL API控件-图片 (Image)

news2025/1/10 12:14:05

图片 (Image)

image.png


图片IMG是用于显示图像的基本对象类型，图像来源可以是文件，或者定义的符号。

示例代码

-- 创建图片控件
img = lvgl.img_create(lvgl.scr_act(), nil)
-- 设置图片显示的图像
lvgl.img_set_src(img, "/lua/luatos.png")
-- 图片居中
lvgl.obj_align(img, nil, lvgl.ALIGN_CENTER, 0, 0)

创建

使用 lvgl.img_create 可以创建图像对象。

img = lvgl.img_create(lvgl.scr_act(), nil)

符号文字

图片控件显示的内容有两个来源，一个是来源文件的图片，还是有一个就是 符号文字。符号文字是一段特殊的字符串，LVGL内部会将这串特殊字符解析为图像显示，类似于 Emoji。符号文字名称需要用户在脚本层自行定义，例如"\xef\x80\x8c"代表的就是 OK按钮，可以通过脚本自行定义名称，方便识别。例如 OK 的标志就可以标记成 lvgl.SYMBOL_OK。

我们可以打印下部分符号文件:

symble = {
    "\xef\x80\x81", "\xef\x80\x88", "\xef\x80\x8b", "\xef\x80\x8c",
    "\xef\x80\x8d", "\xef\x80\x91", "\xef\x80\x93", "\xef\x80\x95",
    "\xef\x80\x99", "\xef\x80\x9c", "\xef\x80\xa1", "\xef\x80\xa6",
    "\xef\x80\xa7", "\xef\x80\xa8", "\xef\x80\xbe", "\xef\x8C\x84",
    "\xef\x81\x88", "\xef\x81\x8b", "\xef\x81\x8c", "\xef\x81\x8d",
    "\xef\x81\x91", "\xef\x81\x92", "\xef\x81\x93", "\xef\x81\x94",
    "\xef\x81\xa7", "\xef\x81\xa8", "\xef\x81\xae", "\xef\x81\xb0",
    "\xef\x81\xb1", "\xef\x81\xb4", "\xef\x81\xb7", "\xef\x81\xb8",
    "\xef\x81\xb9", "\xef\x81\xbb", "\xef\x82\x93", "\xef\x82\x95",
    "\xef\x83\x84", "\xef\x83\x85", "\xef\x83\x87", "\xef\x83\xa7",
    "\xef\x83\xAA", "\xef\x83\xb3", "\xef\x84\x9c", "\xef\x84\xa4",
    "\xef\x85\x9b", "\xef\x87\xab", "\xef\x89\x80", "\xef\x89\x81",
    "\xef\x89\x82", "\xef\x89\x83", "\xef\x89\x84", "\xef\x8a\x87",
    "\xef\x8a\x93", "\xef\x8B\xAD", "\xef\x95\x9A", "\xef\x9F\x82",
}

local img = lvgl.img_create(cont, nil)
lvgl.cont_set_layout(cont, lvgl.LAYOUT_GRID)
for i=1, #symble do
	img = lvgl.img_create(cont, nil)
	lvgl.img_set_src(img, symble[i])
end

符号标志.bmp

设置图片

图像文件同样是通过 lvgl.img_set_src 函数设置的，与符号标志不同的是需要传入图片路径。

lvgl.img_set_src(img, "/lua/png40.png")

鹦鹉.bmp

尺寸

调用 lvgl.img_set_auto_size 函数，将设置图像对象的大小自动设置为图像源的宽度和高度。 如果启用了自动调整大小，则在设置新文件时，对象大小将自动更改。以后，可以手动修改大小。默认情况下将启用自动调整大小。

lvgl.img_set_auto_size(image, true)

偏移

使用 lvgl.img_set_offset_x 和 lvgl.img_set_offset_y ，可以向显示的图像添加一些偏移。如果对象尺寸小于图像源尺寸，则很有用。

lvgl.img_set_offset_x(img, 10)
lvgl.img_set_offset_y(img, 10)

偏移.bmp


可以看到，这个偏移的显示效果跟我们想象的有点区别，它是类似于铺地板的效果。也可以利用 X 或 Y 偏移创建滚动图像的效果。

透明度

lvgl.img_set_src 虽然可以设置图像显示，但是直接显示的图片在 LuatOS-SoC 中是不支持透明度的，尽管PNG图像本身带有透明度信息。 如需显示透明图片，需要将PNG文件（JPG 和 BMP 格式本身不支持透明背景）在官网转化为 BIN 文件，转换方式如下：

file-read-6032.png

在lvgl.img_set_src中直接传入转换完毕的 BIN 文件即可完成透明图片的显示，需要注意的是，转换完后的文件后缀名需为 .bin，此接口依靠后缀名识别文件格式显示。

重新着色

重新设置图片的颜色模式，主要函数有三个：

lvgl.obj_set_style_local_image_opa
lvgl.obj_set_style_local_image_recolor
lvgl.obj_set_style_local_image_recolor_opa

都是通过风格改变图片信息，可以让一张图片显示出不同的效果，可以用在图像处理，或者让图片显示不同状态。其中，obj_set_style_local_image_opa 是改变图片的透明度， 可以改变的数值为 0~255，可以取当中任意数值，也可以使用 LVGL 已经定义好的透明度数值。这里改变的是图片的整体透明度。

透明度数值
lvgl.OPA_00
lvgl.OPA_1025
lvgl.OPA_2051
lvgl.OPA_3076
lvgl.OPA_40102
lvgl.OPA_50127
lvgl.OPA_60153
lvgl.OPA_70178
lvgl.OPA_80204
lvgl.OPA_90229
lvgl.OPA_100255
lvgl.OPA_COVER255

我们来看看图片半透明的显示效果

lvgl.obj_set_style_local_image_opa(img, lvgl.IMG_PART_MAIN, lvgl.STATE_DEFAULT, 128)

半透明.bmp

lvgl.obj_set_style_local_image_recolor 是为图片添加一个类似于滤镜的效果。

首先来看下代码是怎样使用的:

lvgl.obj_set_style_local_image_recolor_opa(img, lvgl.IMG_PART_MAIN, lvgl.STATE_DEFAULT, 128)
lvgl.obj_set_style_local_image_recolor(img, lvgl.IMG_PART_MAIN, lvgl.STATE_DEFAULT, 0x00FF00)

绿到你发光.bmp


这样就得到了一只泛着绿光的鹦鹉，没错，这货是鹦鹉。
lvgl.obj_set_style_local_image_recolor 设置颜色的模式是 RGB，根据数值可以设定不同颜色。
 

红光鹦鹉.bmp


根据透明度设置的数值，我们甚至可以得到一个 剪影。

lvgl.obj_set_style_local_image_recolor_opa(img, lvgl.IMG_PART_MAIN, lvgl.STATE_DEFAULT, 255)
lvgl.obj_set_style_local_image_recolor(img, lvgl.IMG_PART_MAIN, lvgl.STATE_DEFAULT, 0x0000FF)

蓝色剪影.bmp

缩放

可以使用 lvgl.img_set_zoom(img, factor) 进行图像缩放， lvgl.IMG_ZOOM_NONE 是一个数值 256，代表默认大小。factor 设置为256表示图片不进行缩放，factor 设置为 512 表示图片放大一倍。同样128表示将图片缩小一倍。需要注意的是，这里只是更改了图片的大小显示，并没有更改控件的大小。

lvgl.img_set_zoom(img, 512)

放大一倍.bmp


看起来有些模糊，这是原先的图片素材放大了一倍的显示效果。

旋转

通过 lvgl.img_set_angle 可以对图片进行旋转，使用的单位是 角度值*10，方向是顺时针，也就是说， 900 就表示 90 度。下面我们对图片顺时针旋转 90 度。

lvgl.img_set_angle(img, 900)

旋转.bmp

API

lvgl.img_create

调用lvgl.img_create(par, copy)
功能创建一个图片对象
返回指向图片对象的指针
参数
par指向对象的指针, 它将是新键对象的父对象
copy指向图片对象的指针, 如果不为 nil, 则将从其复制新对象

lvgl.img_set_src

调用lvgl.img_set_src(img, data)
功能设置图片控件的显示内容
参数
img指向图片对象的指针
data图像显示的数据内容

lvgl.img_set_auto_size

调用lvgl.img_set_auto_size(img, en)
功能是否启动自动调整尺寸功能
参数
img指向图片对象的指针
entrue 启用尺寸自动调整，false 禁用尺寸自动调整

lvgl.img_set_offset_x

调用lvgl.img_set_offset_x(img, x)
功能设置图片内容的横向偏移
参数
img指向图片对象的指针
x图片的横向偏移

lvgl.img_set_offset_y

调用lvgl.img_set_offset_y(img, y)
功能设置图片内容的纵向偏移
参数
img指向图片对象的指针
y图片的纵向偏移

lvgl.img_set_angle

调用lvgl.img_set_angle(img, angle)
功能设置图片的旋转角度
参数
img指向图片对象的指针
angle图片的旋转角度

lvgl.img_set_pivot

调用lvgl.img_set_pivot(img, x, y)
功能设置图片的旋转点
参数
img指向图片对象的指针
x图片的旋转中心点 X 坐标
y图片的旋转中心点 Y 坐标

lvgl.img_set_zoom

调用lvgl.img_set_zoom(img, zoom)
功能设置图片的缩放
参数
img指向图片对象的指针
zoom图片的缩放系数，256 代表默认大小。

lvgl.img_set_antialias

调用lvgl.img_set_antialias(img, en)
功能是否启用图片的抗锯齿功能
参数
img指向图片对象的指针
entrue 启用， false 禁用

lvgl.img_get_auto_size

调用lvgl.img_get_auto_size(img)
功能获取当前是否启动自动调整尺寸
返回自动调整尺寸是否启动标志
参数
img指向图片对象的指针

lvgl.img_get_offset_x

调用lvgl.img_get_offset_x(img)
功能获取图片的 x 偏移
返回图片的 x 偏移
参数
img指向图片对象的指针

lvgl.img_get_offset_y

调用lvgl.img_get_offset_y(img)
功能获取图片的 y 偏移
返回图片的 y 偏移
参数
img指向图片对象的指针

lvgl.img_get_angle

调用lvgl.img_get_angle(img)
功能获取图片的旋转角度
返回图片的旋转角度
参数
img指向图片对象的指针

lvgl.img_get_zoom

调用lvgl.img_get_zoom(img)
功能获取图片的缩放系数
返回图片的缩放系数
参数
img指向图片对象的指针

lvgl.img_get_antialias

调用lvgl.img_get_antialias(img)
功能获取图片是否设置了抗锯齿
返回true 设置了抗锯齿, false 没有设置
参数
img指向图片对象的指针

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/971366.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

SpringMVC：从入门到精通

SpringMVC：从入门到精通

一、SpringMVC是什么 SpringMVC是Spring提供的一个强大而灵活的web框架，借助于注解，Spring MVC提供了几乎是POJO的开发模式【POJO是指简单Java对象（Plain Old Java Objects、pure old java object 或者 plain ordinary java object&#xff0…
阅读更多...
社区团购新玩法，生鲜蔬菜配货发货小程序商城

社区团购新玩法，生鲜蔬菜配货发货小程序商城

在当前的电商市场中，生鲜市场具有巨大的潜力和发展空间。为了满足消费者的需求，许多生鲜店正在寻找创新的方法来提高销售和客户满意度。其中，制作一个个性且功能强大的生鲜小程序商城是一个非常有效的策略。以下是在乔拓云平台上制作生鲜小程…
阅读更多...
#systemverilog# 之 event region 和 timeslot 仿真调度（九）assign 赋值 和 always 组合赋值的调度区别

#systemverilog# 之 event region 和 timeslot 仿真调度（九）assign 赋值 和 always 组合赋值的调度区别

有时候，我们会发现一个问题，举个最简单的例子：比如将两个信号进行简单的异或运算。该逻辑运算，我们可以使用 assign 数据流建模完成，也可以使用always 组合逻辑过程赋值语句实现。那仿真工具在对它进行调度的时候，有什么区别吗？ 不慌，今天，我们举个例子，来验证这一点…
阅读更多...
2023 最新前端面试题 （HTML 篇）

2023 最新前端面试题 （HTML 篇）

1. src 和 href 的区别 src 用于替换当前元素（引入），href 用于在当前文档和引用资源之间确立联系（引用） （1）src（source） 指向外部资源的位置，指向的内容将会嵌…
阅读更多...
Python爬虫——新手使用代理ip详细教程

Python爬虫——新手使用代理ip详细教程

Python代理IP爬虫是一种可以让爬虫拥有更多网络访问权限的技术。代理IP的作用是可以为爬虫提供多个IP地址，从而加快其爬取数据的速度，同时也可以避免因为访问频率过高而被网站封禁的问题。本文将介绍如何使用Python实现代理IP的爬取和使用。 一、代理IP的…
阅读更多...
ArrayList底层实现原理

ArrayList底层实现原理

ArrayList ArrayList最早出现在 JDK 1.2中，底层基于数组实现，它是一个动态数组列表结构的容器。 元素有序，可重复增删元素的速度慢。每次增加删除元素，都需要更改数组长度、拷贝元素及移动元素位置。查询元素的速度快。底层数据…
阅读更多...
qt简易网络聊天室 数据库的练习

qt简易网络聊天室 数据库的练习

qt网络聊天室 服务器： 配置文件.pro QT core gui networkgreaterThan(QT_MAJOR_VERSION, 4): QT widgetsCONFIG c11# The following define makes your compiler emit warnings if you use # any Qt feature that has been marked deprecated (the exac…
阅读更多...
酷派30/锋尚40/大观40S首发解锁BL+完美root权限+去除密码黑砖线刷修复

酷派30/锋尚40/大观40S首发解锁BL+完美root权限+去除密码黑砖线刷修复

早前的中华酷联，随着时代的发展，酷派手机虽热发展的并没有其他手机那么快，但也 是坚强的活了下来。目前主打机型为Cool系列，最高为Cool30机型，并且发布酷派锋尚 40酷派大观40S，起头并进。该系列机型&#x…
阅读更多...
动手学深度学习（五）Kaggle房价预测

动手学深度学习（五）Kaggle房价预测

Kaggle房价数据集，前四个为房价特征，最后一个为标签（房价）。 一、下载数据集 import numpy as np import pandas as pd import torch from torch import nn from d2l import torch as d2l import hashlib import os import tarfi…
阅读更多...
XSS简单介绍

XSS简单介绍

目录 一、认识XSS 1.XSS原理 2.XSS分类 二、XSS漏洞复现 1.搭建靶机进行复现 2.案例解析 2.1第一关 2.2第二关 2.3第三关 2.4第四关 一、认识XSS 1.XSS原理 XSS跨站脚本攻击是指恶意攻击者往Web页面里插入恶意Script代码，当用户浏览该页之时，…
阅读更多...
linux并发服务器 —— linux网络编程（七）

linux并发服务器 —— linux网络编程（七）

网络结构模式 C/S结构 - 客户机/服务器；采用两层结构，服务器负责数据的管理，客户机负责完成与用户的交互；C/S结构中，服务器 - 后台服务，客户机 - 前台功能； 优点 1. 充分发挥客户端PC处理能力…
阅读更多...
分布式锁之redis实现

分布式锁之redis实现

docker安装redis 拉取镜像 docker pull redis:6.2.6 查看镜像 启动容器并挂载目录 需要挂在的data和redis.conf自行创建即可 docker run --restart always -d -v /usr/local/docker/redis/redis.conf:/usr/local/etc/redis/redis.conf -v /usr/local/docker/redis/data:/dat…
阅读更多...
leetcode986. 区间列表的交集(java)

leetcode986. 区间列表的交集(java)

区间列表的交集 题目描述贪心 - 合并区间代码演示 题目描述 难度 - 中等 leetcode986. 区间列表的交集 给定两个由一些 闭区间 组成的列表，firstList 和 secondList ，其中 firstList[i] [starti, endi] 而 secondList[j] [startj, endj] 。每个区间列表…
阅读更多...
【数学建模竞赛】超详细Matlab二维三维图形绘制

【数学建模竞赛】超详细Matlab二维三维图形绘制

二维图像绘制 绘制曲线图 g 是表示绿色 b--o是表示蓝色/虚线/o标记 c*是表示蓝绿色(cyan)/*标记 ‘MakerIndices,1:5:length(y) 每五个点取点（设置标记密度） 特殊符号的输入 序号 需求 函数字符结构 示例 1 上角标 ^{ } title( $ a…
阅读更多...
Arthas教程 - 命令篇 （二）

Arthas教程 - 命令篇 （二）

目录 一、Attach 黏附一个进程 1.1 准备代码 1.2 启动Demo 1.3 启动arthas 1.4 通过浏览器连接arthas 二、常用命令 2.1 dashboard 仪表盘 2.2 cls 清屏 2.3 thread 线程 2.4 jad 反编译类 2.5 watch 监视 2.6 退出arthas 三、基础命令 3.1 help 3.2 cat 3.3 …
阅读更多...
小米新机代号“Manet”：搭载高通8 Gen 3 处理器 + 金属中框设计

小米新机代号“Manet”：搭载高通8 Gen 3 处理器 + 金属中框设计

根据数码闲聊站和体验more的消息爆料，小米Redmi K70 Pro被代号为“Manet”，将搭载高通SM8650处理器，这是骁龙8 Gen 3移动平台的一部分。该处理器基于台积电N4P工艺制程打造，具有强大的性能表现。 CPU包含1*3.19GHz X45*2.96GHz A7…
阅读更多...
Python Opencv实践 - 矩形轮廓绘制(直边矩形，最小外接矩形)

Python Opencv实践 - 矩形轮廓绘制(直边矩形，最小外接矩形)

import cv2 as cv import numpy as np import matplotlib.pyplot as pltimg cv.imread("../SampleImages/stars.png") plt.imshow(img[:,:,::-1])img_gray cv.cvtColor(img, cv.COLOR_BGR2GRAY) #通过cv.threshold转换为二值图 ret,thresh cv.threshold(img_gray,…
阅读更多...
Error from server (NotFound): pods “nginx-57d84f57dc-b866m“ not found

Error from server (NotFound): pods “nginx-57d84f57dc-b866m“ not found

原因：机房断电，导致服务重启 [rootmaster1 logs]# kubectl get pod NAME READY STATUS RESTARTS AGE nginx-57d84f57dc-57fkf 1/1 Running 0 75s [rootmaster1 logs]# kubectl logs -f nginx-5…
阅读更多...
nginx使用详解

nginx使用详解

文章目录 一、前言二、nginx使用详解2.1、nginx特点2.2 静态文件处理2.3 反向代理2.4 负载均衡2.5 高级用法2.5.1 正则表达式匹配2.5.2 重定向 三、总结 一、前言 本文将详细介绍nginx的各个功能使用，主要包括 二、nginx使用详解 2.1、nginx特点 高性能&#xff…
阅读更多...
【JVM】垃圾收集算法

【JVM】垃圾收集算法

文章目录 分代收集理论标记-清除算法标记-复制算法标记-整理算法 分代收集理论 当前商业虚拟机的垃圾收集器，大多数都遵循了“分代收集”（Generational Collection）[1]的理论进 行设计，分代收集名为理论，实质是一套符…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023