LVGL lv_color_t 像素定义详解

2023-11-07 19:59
文章标签 详解 定义 像素 lvgl color lv

本文主要是介绍LVGL lv_color_t 像素定义详解，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

更多源码分析请访问：LVGL 源码分析大全

目录

  • 1、概述
  • 2、颜色格式详解
    • 2.1、LV_IMG_CF_RAW_X
    • 2.2、LV_IMG_CF_TRUE_COLOR_X
    • 2.3、LV_IMG_CF_INDEXED_XBIT
    • 2.4、LV_IMG_CF_ALPHA_XBIT
    • 2.5、LV_IMG_CF_RGBX
  • 3、送显函数（flush_cb）中的 lv_color_t
  • 附录
    • A、通过`lv_img_conv.js`生成的代码
      • A.1 CF_ALPHA_X_BIT
        • A.1.1 CF_ALPHA_1_BIT
        • A.1.2 CF_ALPHA_2_BIT
        • A.1.3 CF_ALPHA_4_BIT
        • A.1.4 CF_ALPHA_8_BIT
      • A.2 CF_INDEXED_X_BIT
        • A.2.1 CF_INDEXED_1_BIT
        • A.2.2 CF_INDEXED_2_BIT
        • A.2.3 CF_INDEXED_4_BIT
        • A.2.4 CF_INDEXED_8_BIT
      • A.3 CF_RAW_X
        • A.3.1 CF_RAW
        • A.3.2 CF_RAW_ALPHA
        • A.3.3 CF_RAW_CHROMA
      • A.4 CF_TRUE_COLOR_X
        • A.4.1 CF_TRUE_COLOR
        • A.4.2 CF_TRUE_COLOR_ALPHA
        • A.4.3 CF_TRUE_COLOR_CHROMA
      • A.5 CF_RGB565A8
    • B、lv_img_cf_t 的定义

1、概述

本章节从一个特殊的4x2的32位真彩色的长方形图片，通过工具 lv_img_conv.js生成不同的内置图片数据来入手，以更深入的了解LVGL中像素的处理思路和逻辑。
特殊的4x2的长方形图片是为了更方便我们理解像素的排布和处理逻辑，其原始数据被设置如下：
{0xFFAABBCC, 0xFFAA0000, 0xFF00BB00, 0xFF0000CC, 0x7F0000CC, 0x7F00BB00, 0x7FAA0000, 0x7FAABBCC}

小白提醒： lv_img_conv.js 转换时，最好先将图片转换成png格式，因为使用bmp或者其它格式图片存在生成的数据丢失透明度的问题。

此案例中，我们转换了以下格式，在附录中，可以找到对应格式的数据截图：

  • CF_ALPHA_1_BIT, CF_ALPHA_2_BIT, CF_ALPHA_4_BIT, CF_ALPHA_8_BIT
  • CF_INDEXED_1_BIT, CF_INDEXED_2_BIT, CF_INDEXED_4_BIT, CF_INDEXED_8_BIT
  • CF_RAW, CF_RAW_CHROMA, CF_RAW_ALPHA
  • CF_TRUE_COLOR, CF_TRUE_COLOR_ALPHA, CF_TRUE_COLOR_CHROMA
  • CF_RGB565A8

生成的内置图片数据被定义为一个lv_img_dsc_t结构体供其它地址使用，这个结构体定义如下：

/*** The first 8 bit is very important to distinguish the different source types.* For more info see `lv_img_get_src_type()` in lv_img.c* On big endian systems the order is reversed so cf and always_zero must be at* the end of the struct.*/
#if LV_BIG_ENDIAN_SYSTEM
typedef struct {uint32_t h : 11; /*Height of the image map*/uint32_t w : 11; /*Width of the image map*/uint32_t reserved : 2; /*Reserved to be used later*/uint32_t always_zero : 3; /*It the upper bits of the first byte. Always zero to look like anon-printable character*/uint32_t cf : 5;          /*Color format: See `lv_img_color_format_t`*/} lv_img_header_t;
#else
typedef struct {uint32_t cf : 5;          /*Color format: See `lv_img_color_format_t`*/uint32_t always_zero : 3; /*It the upper bits of the first byte. Always zero to look like anon-printable character*/uint32_t reserved : 2; /*Reserved to be used later*/uint32_t w : 11; /*Width of the image map*/uint32_t h : 11; /*Height of the image map*/
} lv_img_header_t;
#endif/** Image header it is compatible with* the result from image converter utility*/
typedef struct {lv_img_header_t header; /**< A header describing the basics of the image*/uint32_t data_size;     /**< Size of the image in bytes*/const uint8_t * data;   /**< Pointer to the data of the image*/
} lv_img_dsc_t;

在lv_img_dsc_t结构体，有一个颜色格式(Color format)字段(header.cf)，决定了对数据的处理逻辑，它被定义为lv_img_cf_t的枚举类型。
而这个lv_img_cf_t枚举分为了八类处理逻辑：

  • LV_IMG_CF_UNKNOWN 未知，资源可能出错了；
  • LV_IMG_CF_RAW_X 包含LV_IMG_CF_RAW, LV_IMG_CF_RAW_ALPHA和LV_IMG_CF_RAW_CHROMA_KEYED三种，表示此资源是一个原始数据资源，需要开发者先解码后才能使用；
  • LV_IMG_CF_TRUE_COLOR_X 包含LV_IMG_CF_TRUE_COLOR, LV_IMG_CF_TRUE_COLOR_ALPHA和LV_IMG_CF_TRUE_COLOR_CHROMA_KEYED三种，表示此资源是一个解码后的数据，解码后的数据具体使用的那种格式，取决于LVGL的宏LV_COLOR_DEPTH和LV_COLOR_16_SWAP参数配置；
  • LV_IMG_CF_INDEXED_XBIT 包含LV_IMG_CF_INDEXED_1BIT,LV_IMG_CF_INDEXED_2BIT,LV_IMG_CF_INDEXED_4BIT和LV_IMG_CF_INDEXED_8BIT四种，表示这是一个颜色表+索引值方式保存的图片资源，其中颜色表的大小由XBIT决定（1BIT表示2位，2BIT表示4位，4BIT表示16位，8BIT表示256位）；
  • LV_IMG_CF_ALPHA_XBIT 包含LV_IMG_CF_ALPHA_1BIT,LV_IMG_CF_ALPHA_2BIT,LV_IMG_CF_ALPHA_4BIT和LV_IMG_CF_ALPHA_8BIT四种，表示这是一个透明色表资源（没有像素信息，只有像素点上透明色的值），其中透明色的大小由XBIT决定（1BIT表示1位，2BIT表示2位，4BIT表示4位，8BIT表示8位）；
  • LV_IMG_CF_RGBX 包含LV_IMG_CF_RGB888, LV_IMG_CF_RGBA8888,LV_IMG_CF_RGBX8888,LV_IMG_CF_RGB565, LV_IMG_CF_RGBA5658,LV_IMG_CF_RGB565A8六种，这是实现在图片送显或者处理中的数据格式；
  • LV_IMG_CF_RESERVED_X 预留字段，官方没有给处理方案或者逻辑，如果使用，需要开发者自行处理；
  • LV_IMG_CF_USER_ENCODED_X 开发者自定义加密数据处理，需要先解密再做其它处理；

2、颜色格式详解

2.1、LV_IMG_CF_RAW_X

此类颜色格式常用于保存原始的需要解码的图片资源，也可以用来保存JOSN、音频等需要内置的资源。它具体有三种LV_IMG_CF_RAW, LV_IMG_CF_RAW_ALPHA和LV_IMG_CF_RAW_CHROMA_KEYED，这三种在LVGL里分别对应三种处理逻辑，如下表所示：

LV_IMG_CF_RAWLV_IMG_CF_RAW_ALPHALV_IMG_CF_RAW_CHROMA_KEYED
1、表示lv_img_dsc_t结构中的data字段保存的数据即为文件原始二进制数据1、表示lv_img_dsc_t结构中的data字段保存的数据即为文件原始二进制数据1、表示lv_img_dsc_t结构中的data字段保存的数据即为文件原始二进制数据
2、如果是图片，数据中没有透明色(即便有，应当丢弃)2、如果是图片，数据中包含透明色，应当使用此透明色进行图层混合2、如果是图片，当像素为LV_COLOR_CHROMA_KEY定义字段，应当将其像素点的透明色改为全透明色，否则为不透明

因此使用工具生成的LV_IMG_CF_RAW, LV_IMG_CF_RAW_ALPHA和LV_IMG_CF_RAW_CHROMA_KEYED三种类型的文件，仅是.header.cf字段上有差异，而其它的都是一样的数据；但在LVGL里的默认处理逻辑，却是不一样的。如下图所示：
在这里插入图片描述

小白提醒：
1、LV_IMG_CF_RAW_X 类型多为开发者自解析或操作资源，因此实际项目中到底有没有遵循这一约束，实际上是不可控的，这里讲的是LVGL框架上计划或推荐使用的处理逻辑。
2、LV_IMG_CF_RAW_CHROMA_KEYED 多用于扣图显示逻辑中，应用最多的，就是将绿色(0x00FF00)的像素点全部换成透明色，以显示下一个图层的内容（拍摄中的小绿人，或者绿色布，多用这种方法替换成其它背景的）。

2.2、LV_IMG_CF_TRUE_COLOR_X

此类颜色格式是完全解码后的数据(真彩色)，但解码后的数据使用的是 BGRA888还是 BGR565取决于LV_COLOR_DEPTH参数的配置。 仅对比生成的数据， LV_IMG_CF_TRUE_COLOR 与 LV_IMG_CF_TRUE_COLOR_CHROMA_KEYED生成的数据是一样的，而LV_IMG_CF_TRUE_COLOR_ALPHA多了一个字节的透明色值。
在这里插入图片描述

实际的像素格式，列举如下：

LV_COLOR_DEPTHLV_COLOR_16_SWAP数据格式LV_IMG_CF_TRUE_COLOR 示例
32无效BGRA888
（透明色全为0xFF）		在这里插入图片描述
161RGB565在这里插入图片描述
160BGR565在这里插入图片描述
8（或1）无效BGR332在这里插入图片描述
LV_COLOR_DEPTHLV_COLOR_16_SWAP数据格式LV_IMG_CF_TRUE_COLOR_ALPHA 示例
32无效BGRA888
（透明色为实际值）		在这里插入图片描述
161RGB565A8在这里插入图片描述
160BGR565A8在这里插入图片描述
8（或1）无效BGR332A8在这里插入图片描述

小白提醒：
1、此种格式保存下来的图片资源占用空间是非常大的，唯一的好处是不用解码而可以直接使用；因此多用于对性能要求比较高的图片使用场景中(例如动画）

2.3、LV_IMG_CF_INDEXED_XBIT

此类颜色是颜色表+索引的方式保存的，多用于缩小图片资源的大小。LVGL在使用时，会先转换成 LV_IMG_CF_TRUE_COLOR_ALPHA 格式，因此在使用中，要考虑性能是否足够。
LV_IMG_CF_INDEXED_2_BIT、LV_IMG_CF_INDEXED_4_BIT和LV_IMG_CF_INDEXED_8_BIT 的颜色表是固定BGRA888格式，其颜色表长度分别2、4、16和256（不足的会用0x00000000来补全，如果颜色表超出会进行合并）；
XBIT中的X代表索引占用的BIT位大小。
在这里插入图片描述

小白提醒
LV_IMG_CF_INDEXED_1_BIT 格式似乎与此说法不太符。因无项目使用此格式，未深入研究原因。

2.4、LV_IMG_CF_ALPHA_XBIT

此类型颜色格式仅保存了XBIT位的透明色值，多用于指定区域挖洞（挖洞后显示视频等）。
在这里插入图片描述

小白提醒
LV_IMG_CF_ALPHA_1_BIT 格式似乎与此说法不太符。因无项目使用此格式，未深入研究原因。

2.5、LV_IMG_CF_RGBX

LV_IMG_CF_RGBX 为具体实际的像素格式，但LVGL的格式定义与FFMPEG等主流的常见像素格式定义方式不太一样，个人也不知道具体原因。具体数据格式对应表如下：

LVGL像素格式FFMPG像素格式说明
LV_IMG_CF_RGB888BGR888char buf[3];
#define B buf[0]
#define G buf[1]
#define R buf[2]
LV_IMG_CF_RGBA8888BGRA8888char buf[4];
#define B buf[0]
#define G buf[1]
#define R buf[2]
#define A buf[3]
LV_IMG_CF_RGBX8888BGRX8888char buf[4];
#define B buf[0]
#define G buf[1]
#define R buf[2]
其中buf[3]为无效值
LV_IMG_CF_RGB565BGR565char buf[2];
#define B （buf[0] & 0x1F)
#define G ((buf[0] & 0xE0) >> 3) | (buf[1] >> 5))
#define R （buf[1] & 0x1F)
LV_IMG_CF_RGBA5658BGRA5658char buf[3];
#define B （buf[0] & 0x1F)
#define G ((buf[0] & 0xE0) >> 3) | (buf[1] >> 5))
#define R （buf[1] & 0x1F)
#define A buf[3]
LV_IMG_CF_RGB565A8BGR565A8char buf[3]; #define B （buf[0] & 0x1F)
#define G ((buf[0] & 0xE0) >> 3) | (buf[1] >> 5))
#define R （buf[1] & 0x1F)
#define A buf[3]

小白提醒
从表中看LV_IMG_CF_RGB565A8与LV_IMG_CF_RGBA5658似乎是一样的，实现是有区别的。LV_IMG_CF_RGBA5658的数据排布是 BGRABGRA...的方式排布的，而 LV_IMG_CF_RGB565A8的数据排布却是BGRBGR...AA...

3、送显函数（flush_cb）中的 lv_color_t

送显函数中的 lv_color_t定义是由LV_COLOR_DEPTH和LV_COLOR_16_SWAP决定的。对应的具体格式如下表所示：

LV_COLOR_DEPTHLV_COLOR_16_SWAP数据格式说明
32无效BGRA888(LV_IMG_CF_RGBA8888)带透明度，多用于Linux上或者RGB/MIPI等带透明色的32位屏
161RGB565多用于SPI屏
160BGR565(LV_IMG_CF_RGB565)多用于SPI屏
8无效BGR332没用过
1无效BGR111没用过

附录

A、通过lv_img_conv.js生成的代码

A.1 CF_ALPHA_X_BIT

A.1.1 CF_ALPHA_1_BIT

在这里插入图片描述

A.1.2 CF_ALPHA_2_BIT

在这里插入图片描述

A.1.3 CF_ALPHA_4_BIT

在这里插入图片描述

A.1.4 CF_ALPHA_8_BIT

在这里插入图片描述

A.2 CF_INDEXED_X_BIT

A.2.1 CF_INDEXED_1_BIT

在这里插入图片描述

A.2.2 CF_INDEXED_2_BIT

在这里插入图片描述

A.2.3 CF_INDEXED_4_BIT

在这里插入图片描述

A.2.4 CF_INDEXED_8_BIT

在这里插入图片描述

A.3 CF_RAW_X

A.3.1 CF_RAW

在这里插入图片描述

A.3.2 CF_RAW_ALPHA

在这里插入图片描述

A.3.3 CF_RAW_CHROMA

在这里插入图片描述

A.4 CF_TRUE_COLOR_X

A.4.1 CF_TRUE_COLOR

在这里插入图片描述

A.4.2 CF_TRUE_COLOR_ALPHA

在这里插入图片描述

A.4.3 CF_TRUE_COLOR_CHROMA

在这里插入图片描述

A.5 CF_RGB565A8

在这里插入图片描述

B、lv_img_cf_t 的定义

lv_img_cf_t 定义在lvgl/src/draw/lv_img_buf.h

/*Image color format*/
enum {LV_IMG_CF_UNKNOWN = 0,LV_IMG_CF_RAW,              /**< Contains the file as it is. Needs custom decoder function*/LV_IMG_CF_RAW_ALPHA,        /**< Contains the file as it is. The image has alpha. Needs custom decoderfunction*/LV_IMG_CF_RAW_CHROMA_KEYED, /**< Contains the file as it is. The image is chroma keyed. Needscustom decoder function*/LV_IMG_CF_TRUE_COLOR,              /**< Color format and depth should match with LV_COLOR settings*/LV_IMG_CF_TRUE_COLOR_ALPHA,        /**< Same as `LV_IMG_CF_TRUE_COLOR` but every pixel has an alpha byte*/LV_IMG_CF_TRUE_COLOR_CHROMA_KEYED, /**< Same as `LV_IMG_CF_TRUE_COLOR` but LV_COLOR_TRANSP pixelswill be transparent*/LV_IMG_CF_INDEXED_1BIT, /**< Can have 2 different colors in a palette (can't be chroma keyed)*/LV_IMG_CF_INDEXED_2BIT, /**< Can have 4 different colors in a palette (can't be chroma keyed)*/LV_IMG_CF_INDEXED_4BIT, /**< Can have 16 different colors in a palette (can't be chroma keyed)*/LV_IMG_CF_INDEXED_8BIT, /**< Can have 256 different colors in a palette (can't be chroma keyed)*/LV_IMG_CF_ALPHA_1BIT, /**< Can have one color and it can be drawn or not*/LV_IMG_CF_ALPHA_2BIT, /**< Can have one color but 4 different alpha value*/LV_IMG_CF_ALPHA_4BIT, /**< Can have one color but 16 different alpha value*/LV_IMG_CF_ALPHA_8BIT, /**< Can have one color but 256 different alpha value*/LV_IMG_CF_RGB888,LV_IMG_CF_RGBA8888,LV_IMG_CF_RGBX8888,LV_IMG_CF_RGB565,LV_IMG_CF_RGBA5658,LV_IMG_CF_RGB565A8,LV_IMG_CF_RESERVED_15,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_16,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_17,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_18,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_19,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_20,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_21,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_22,              /**< Reserved for further use.*/LV_IMG_CF_RESERVED_23,              /**< Reserved for further use.*/LV_IMG_CF_USER_ENCODED_0,          /**< User holder encoding format.*/LV_IMG_CF_USER_ENCODED_1,          /**< User holder encoding format.*/LV_IMG_CF_USER_ENCODED_2,          /**< User holder encoding format.*/LV_IMG_CF_USER_ENCODED_3,          /**< User holder encoding format.*/LV_IMG_CF_USER_ENCODED_4,          /**< User holder encoding format.*/LV_IMG_CF_USER_ENCODED_5,          /**< User holder encoding format.*/LV_IMG_CF_USER_ENCODED_6,          /**< User holder encoding format.*/LV_IMG_CF_USER_ENCODED_7,          /**< User holder encoding format.*/
};
typedef uint8_t lv_img_cf_t;

这篇关于LVGL lv_color_t 像素定义详解的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/365940。

相关文章

HTML5 搜索框Search Box详解

HTML5 搜索框Search Box详解

《HTML5搜索框SearchBox详解》HTML5的搜索框是一个强大的工具，能够有效提升用户体验,通过结合自动补全功能和适当的样式，可以创建出既美观又实用的搜索界面,这篇文章给大家介绍HTML5... html5 搜索框（Search Box）详解搜索框是一个用于输入查询内容的控件，通常用于网站或应用程
阅读更多...
Python中使用uv创建环境及原理举例详解

Python中使用uv创建环境及原理举例详解

《Python中使用uv创建环境及原理举例详解》uv是Astral团队开发的高性能Python工具,整合包管理、虚拟环境、Python版本控制等功能,：本文主要介绍Python中使用uv创建环境及... 目录一、uv工具简介核心特点：二、安装uv1. 通过pip安装2. 通过脚本安装验证安装：配置镜像源（可
阅读更多...
C++ 函数 strftime 和时间格式示例详解

C++ 函数 strftime 和时间格式示例详解

《C++函数strftime和时间格式示例详解》strftime是C/C++标准库中用于格式化日期和时间的函数,定义在ctime头文件中,它将tm结构体中的时间信息转换为指定格式的字符串,是处理... 目录C++ 函数 strftipythonme 详解一、函数原型二、功能描述三、格式字符串说明四、返回值五
阅读更多...
LiteFlow轻量级工作流引擎使用示例详解

LiteFlow轻量级工作流引擎使用示例详解

《LiteFlow轻量级工作流引擎使用示例详解》：本文主要介绍LiteFlow是一个灵活、简洁且轻量的工作流引擎,适合用于中小型项目和微服务架构中的流程编排,本文给大家介绍LiteFlow轻量级工... 目录1. LiteFlow 主要特点2. 工作流定义方式3. LiteFlow 流程示例4. LiteF
阅读更多...
CSS3中的字体及相关属性详解

CSS3中的字体及相关属性详解

《CSS3中的字体及相关属性详解》：本文主要介绍了CSS3中的字体及相关属性，详细内容请阅读本文，希望能对你有所帮助... 字体网页字体的三个来源：用户机器上安装的字体，放心使用。保存在第三方网站上的字体，例如Typekit和Google,可以link标签链接到你的页面上。保存在你自己Web服务器上的字
阅读更多...
MySQL存储过程之循环遍历查询的结果集详解

MySQL存储过程之循环遍历查询的结果集详解

《MySQL存储过程之循环遍历查询的结果集详解》：本文主要介绍MySQL存储过程之循环遍历查询的结果集,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录前言1. 表结构2. 存储过程3. 关于存储过程的SQL补充总结前言近来碰到这样一个问题：在生产上导入的数据发现
阅读更多...
MyBatis ResultMap 的基本用法示例详解

MyBatis ResultMap 的基本用法示例详解

《MyBatisResultMap的基本用法示例详解》在MyBatis中,resultMap用于定义数据库查询结果到Java对象属性的映射关系,本文给大家介绍MyBatisResultMap的基本... 目录MyBATis 中的 resultMap1. resultMap 的基本语法2. 简单的 resul
阅读更多...
从基础到进阶详解Pandas时间数据处理指南

从基础到进阶详解Pandas时间数据处理指南

《从基础到进阶详解Pandas时间数据处理指南》Pandas构建了完整的时间数据处理生态,核心由四个基础类构成,Timestamp,DatetimeIndex,Period和Timedelta,下面我... 目录1. 时间数据类型与基础操作1.1 核心时间对象体系1.2 时间数据生成技巧2. 时间索引与数据
阅读更多...
Mybatis Plus Join使用方法示例详解

Mybatis Plus Join使用方法示例详解

《MybatisPlusJoin使用方法示例详解》：本文主要介绍MybatisPlusJoin使用方法示例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,... 目录1、pom文件2、yaml配置文件3、分页插件4、示例代码：5、测试代码6、和PageHelper结合6
阅读更多...
一文全面详解Python变量作用域

一文全面详解Python变量作用域

《一文全面详解Python变量作用域》变量作用域是Python中非常重要的概念,它决定了在哪里可以访问变量,下面我将用通俗易懂的方式,结合代码示例和图表,带你全面了解Python变量作用域,需要的朋友... 目录一、什么是变量作用域？二、python的四种作用域作用域查找顺序图示三、各作用域详解1. 局部作
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2