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

图片 (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 doimg = 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.mzph.cn/news/74257.shtml

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

相关文章

【Linux】进程概念I --操作系统概念与冯诺依曼体系结构

【Linux】进程概念I --操作系统概念与冯诺依曼体系结构

Halo，这里是Ppeua。平时主要更新C语言，C，数据结构算法…感兴趣就关注我吧！你定不会失望。 本篇导航 1. 冯诺依曼体系结构为什么这样设计? 2. 操作系统概念为什么我们需要操作系统呢?操作系统怎么进行管理? 计算机是由两部分组…
阅读更多...
性能监控-grafana+prometheus+node_exporter

性能监控-grafana+prometheus+node_exporter

Prometheus是一个开源的系统监控和报警工具。它由SoundCloud开发并于2012年发布，后来成为了一个独立的开源项目，并得到了广泛的应用和支持。 Prometheus的主要功能包括采集和存储各种系统和应用程序的监控数据，并提供强大的查询语言PromQL来…
阅读更多...
算法：数组中的最大差值---“打擂台法“

算法：数组中的最大差值---“打擂台法“

文章来源： https://blog.csdn.net/weixin_45630258/article/details/132737088 欢迎各位大佬指点、三连 1、题目： 给定一个整数数组 nums，找出给定数组中两个数字之间的最大差值。要求，第二个数字必须大于第一个数字。 2、分析特…
阅读更多...
【数据结构】搜索树MapSet

【数据结构】搜索树MapSet

目录 1.搜索树 1.1概念 1.2查找 1.3插入 1.4删除 2.Map 2.1map说明 2.2TreeMap和HashMap 2.3常用方法 3.Set 3.1set说明 3.2TreeSet和HashSet 3.3常用方法 1.搜索树 1.1概念 二叉搜索树又称二叉排序树，它或者是一棵空树，或者具有以下性质&…
阅读更多...
静态工厂模式，抽象工厂模式，建造者模式

静态工厂模式，抽象工厂模式，建造者模式

静态工厂模式 ublic class FruitFactory {public static Fruit getFruit(String name) {Fruit fnull;switch (name){case "APPLE":{fnew Apple();}case "BANANA":{fnew Banana();}default :{System.out.println("Unknown Fruit");}}return f;} …
阅读更多...
机器学习算法系列————决策树（二）

机器学习算法系列————决策树（二）

1.什么是决策树 用于解决分类问题的一种算法。 左边是属性，右边是标签。 属性选择时用什么度量，分别是信息熵和基尼系数。 这里能够做出来特征的区分。 下图为基尼系数为例进行计算。 下面两张图是对婚姻和年收入的详细计算过程（为GINI系…
阅读更多...
2023.09.10 学习周报

2023.09.10 学习周报

文章目录 摘要文献阅读1-1 题目1-2 创新点1-3 本文工作2-1 题目2-2 什么是图2-3 图神经网络2-4 信息传递3-1 题目3-2 创新点3-3 本文工作 深度学习1.GNN的构建步骤2.构建图的方法3.GNN的简单样例 总结 摘要 本周阅读了三篇文章，第一篇是基于物理信息深度学习和激光…
阅读更多...
【C++】学习STL中的list

【C++】学习STL中的list

❤️前言 大家好！，今天为大家带来的一篇博客是关于STL中的list，内容主要包括list的介绍使用、list的模拟实现。以及list与vector的对比。 正文 list的介绍和使用 首先，让我们看看list的文档介绍： list是可以在常数范…
阅读更多...
PaddleOCR学习笔记3-通用识别服务

PaddleOCR学习笔记3-通用识别服务

今天优化了下之前的初步识别服务的python代码和html代码。 采用flask paddleocr bootstrap快速搭建OCR识别服务。 代码结构如下&#xff1a; 模板页面代码文件如下&#xff1a; upload.html : <!DOCTYPE html> <html> <meta charset"utf-8"> …
阅读更多...
数据挖掘的学习路径

数据挖掘的学习路径

⭐️⭐️⭐️⭐️⭐️欢迎来到我的博客⭐️⭐️⭐️⭐️⭐️ &#x1f434;作者&#xff1a;秋无之地 &#x1f434;简介&#xff1a;CSDN爬虫、后端、大数据领域创作者。目前从事python爬虫、后端和大数据等相关工作&#xff0c;主要擅长领域有&#xff1a;爬虫、后端、大数据…
阅读更多...
Docker实战：docker compose 搭建Sonar

Docker实战：docker compose 搭建Sonar

1、docker-compose-sonar文件准备 进入/home/docker目录&#xff0c;新建docker-compose-sonar.yml文件&#xff0c;内容如下&#xff1a; version: 3 services: sonar:image: sonarqube:8.9.6-communityrestart: always container_name: sonarqubevolumes:# 设置与宿主机时间…
阅读更多...
Redis常见命令

Redis常见命令

命令可以查看的文档 http://doc.redisfans.com/ https://redis.io/commands/ 官方文档&#xff08;英文&#xff09; http://www.redis.cn/commands.html 中文 https://redis.com.cn/commands.html 个人推荐这个 https://try.redis.io/ redis命令在线测试工具 https://githubfa…
阅读更多...
Hive_Hive统计指令analyze table和 describe table

Hive_Hive统计指令analyze table和 describe table

之前在公司内部经常会看到表的元信息的一些统计信息&#xff0c;当时非常好奇是如何做实现的。 现在发现这些信息主要是基于 analyze table 去做统计的&#xff0c;分享给大家 实现的效果某一个表中每个列的空值数量&#xff0c;重复值数量等&#xff0c;平均长度 具体的指令…
阅读更多...
9、补充视频

9、补充视频

改进后的dijkstra算法 利用小根堆 将小根堆特定位置更改，再改成小根堆 nodeHeap.addOrUpdateOrIgnore(edge.to, edge.weight + distance);//改进后的dijkstra算法 //从head出发，所有head能到达的节点，生成到达每个节点的最小路径记录并返回 public static HashMap<No…
阅读更多...
分享 8 个 VSCode 插件，提升你的编码体验

分享 8 个 VSCode 插件，提升你的编码体验

大多数开发者都在不断寻找让开发工作更轻松的方法&#xff0c;我也是如此。合适的工具可以帮助你实现这一目标。 在本文中&#xff0c;我们将探讨我个人使用的八个扩展&#xff0c;以优化我的编码体验。让我们来看看这些扩展的列表&#xff0c;亲自体验它们如何改善你的编码体验…
阅读更多...
leetcode897. 递增顺序搜索树(java)

leetcode897. 递增顺序搜索树(java)

递增顺序搜索树 题目描述中序遍历代码演示 递归专题 题目描述 难度 - 简单 LC - 897. 递增顺序搜索树 给你一棵二叉搜索树的 root &#xff0c;请你 按中序遍历 将其重新排列为一棵递增顺序搜索树&#xff0c;使树中最左边的节点成为树的根节点&#xff0c;并且每个节点没有左子…
阅读更多...
如何让 Llama2、通义千问开源大语言模型快速跑在函数计算上？

如何让 Llama2、通义千问开源大语言模型快速跑在函数计算上？

:::info 本文是“在Serverless平台上构建AIGC应用”系列文章的第一篇文章。 ::: 前言 随着ChatGPT 以及 Stable Diffusion,Midjourney 这些新生代 AIGC 应用的兴起&#xff0c;围绕AIGC应用的相关开发变得越来越广泛&#xff0c;有呈井喷之势&#xff0c;从长远看这波应用的爆…
阅读更多...
解除百度安全验证

解除百度安全验证

使用chrome浏览器用百度浏览时&#xff0c;一直弹百度安全验证&#xff1a; 在设置里进行重置&#xff1a; 然后重启浏览器就可以了。
阅读更多...
Leetcode：【169. 多数元素】

Leetcode：【169. 多数元素】

题目 给定一个大小为 n 的数组 nums &#xff0c;返回其中的多数元素。多数元素是指在数组中出现次数 大于 ⌊ n/2 ⌋ 的元素。 你可以假设数组是非空的&#xff0c;并且给定的数组总是存在多数元素。 难度&#xff1a;简单 题目链接&#xff1a;169. 多数元素 示例 1&#xff…
阅读更多...
“系统的UI”——SystemUI

“系统的UI”——SystemUI

SystemUI的实现 以StatusBar为例&#xff0c;来分析下Android系统具体是如何实现它们的。 相关代码分为两部分&#xff0c;即&#xff1a; Service部分 代码路径&#xff1a;frameworks/base/services/java/com/android/server。 应用部分 代码路径&#xff1a;frameworks…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023