Image(图象) (lv_img)

Overview(概述)

查看原文

Images are the basic object to display images from flash (as arrays) or from files. Images can display symbols (LV_SYMBOL_...) too.

Using the Image decoder interface custom image formats can be supported as well.

图像是显示来自闪存(作为数组)或来自文件的图像的基本对象。 图像也可以显示符号(LV_SYMBOL_...)。

使用图像解码器接口 也可以支持自定义图像格式。

Parts and Styles(部分和风格)

查看原文

  • LV_PART_MAIN A background rectangle that uses the typical background style properties and the image itself using the image style properties.

  • LV_PART_MAIN 使用典型背景样式属性的背景矩形和使用图像样式属性的图像本身。

Usage(用法)

Image source(图片来源)

查看原文

To provide maximum flexibility, the source of the image can be:

  • a variable in code (a C array with the pixels).

  • a file stored externally (e.g. on an SD card).

  • a text with Symbols.

To set the source of an image, use lv_img_set_src(img, src).

To generate a pixel array from a PNG, JPG or BMP image, use the Online image converter tool and set the converted image with its pointer: lv_img_set_src(img1, &converted_img_var); To make the variable visible in the C file, you need to declare it with LV_IMG_DECLARE(converted_img_var).

为了提供最大的灵活性,图像的来源可以是:

  • 代码中的变量(带有像素的 C 数组)。

  • 外部存储的文件(例如在 SD 卡上)。

  • 带有 Symbols 的文本。

要设置图像的来源,请使用lv_img_set_src(img, src)

要从 PNG、JPG 或 BMP 图像生成像素数组,请使用 在线图像转换工具 并使用其指针设置转换后的图像:lv_img_set_src(img1, &converted_img_var ); 要使该变量在 C 文件中可见,您需要使用 LV_IMG_DECLARE(converted_img_var) 声明它。

查看原文

To use external files, you also need to convert the image files using the online converter tool but now you should select the binary output format. You also need to use LVGL's file system module and register a driver with some functions for the basic file operation. Go to the File system to learn more. To set an image sourced from a file, use lv_img_set_src(img, "S:folder1/my_img.bin").

You can also set a symbol similarly to Labels. In this case, the image will be rendered as text according to the font specified in the style. It enables to use of light-weight monochrome "letters" instead of real images. You can set symbol like lv_img_set_src(img1, LV_SYMBOL_OK).

要使用外部文件,您还需要使用在线转换器工具转换图像文件,但现在您应该选择二进制输出格式。 您还需要使用 LVGL 的文件系统模块,并为基本文件操作注册一个具有一些功能的驱动程序。 转到 文件系统 了解更多信息。 要设置来自文件的图像,请使用lv_img_set_src(img, "S:folder1/my_img.bin")

您还可以设置类似于 标签 的符号。 在这种情况下,图像将根据样式中指定的 font 呈现为文本。 它允许使用轻量级单色“字母”而不是真实图像。 你可以设置像lv_img_set_src(img1, LV_SYMBOL_OK)这样的符号。

Label as an image(标签作为图象)

查看原文

Images and labels are sometimes used to convey the same thing. For example, to describe what a button does. Therefore, images and labels are somewhat interchangeable, that is the images can display texts by using LV_SYMBOL_DUMMY as the prefix of the text. For example, lv_img_set_src(img, LV_SYMBOL_DUMMY "Some text").

图像和标签有时用于传达相同的内容。 例如,描述按钮的作用。 因此,图像和标签在某种程度上是可以互换的,即图像可以通过使用“LV_SYMBOL_DUMMY”作为文本的前缀来显示文本。 例如,lv_img_set_src(img, LV_SYMBOL_DUMMY "Some text")

Transparency(透明度)

查看原文

The internal (variable) and external images support 2 transparency handling methods:

  • Chroma-keying - Pixels with LV_COLOR_CHROMA_KEY (lv_conf.h) color will be transparent.

  • Alpha byte - An alpha byte is added to every pixel that contains the pixel's opacity

内部(变量)和外部图像支持 2 种透明度处理方法:

  • 色度键控 - 具有LV_COLOR_CHROMA_KEY (lv_conf.h) 颜色的像素将是透明的。

  • Alpha 字节 - 向每个包含像素不透明度的像素添加一个 Alpha 字节

Palette and Alpha index(调色板和Alpha索引)

查看原文

Besides the True color (RGB) color format, the following formats are supported:

  • Indexed - Image has a palette.

  • Alpha indexed - Only alpha values are stored.

These options can be selected in the image converter. To learn more about the color formats, read the Images section.

除了 True color (RGB) 颜色格式外,还支持以下格式:

  • 索引 - 图像有调色板。

  • Alpha 索引 - 仅存储 Alpha 值。

可以在图像转换器中选择这些选项。 要了解有关颜色格式的更多信息,请阅读 图像 部分。

Recolor(重新着色)

查看原文

A color can be mixed with every pixel of an image with a given intensity. This can be useful to show different states (checked, inactive, pressed, etc.) of an image without storing more versions of the same image. This feature can be enabled in the style by setting img_recolor_opa between LV_OPA_TRANSP (no recolor, value: 0) and LV_OPA_COVER (full recolor, value: 255). The default value is LV_OPA_TRANSP so this feature is disabled.

The color to mix is set by img_recolor.

颜色可以与具有给定强度的图像的每个像素混合。 这对于显示图像的不同状态(选中、非活动、按下等)非常有用,而无需存储同一图像的更多版本。 可以通过在“LV_OPA_TRANSP”(无重新着色,值:0)和“LV_OPA_COVER”(完全重新着色,值:255)之间设置“img_recolor_opa”在样式中启用此功能。 默认值为“LV_OPA_TRANSP”,因此禁用此功能。

要混合的颜色由 img_recolor 设置。

Auto-size(自动大小)

查看原文

If the width or height of the image object is set to LV_SIZE_CONTENT the object's size will be set according to the size of the image source in the respective direction.

如果图像对象的宽度或高度设置为LV_SIZE_CONTENT,则对象的大小将根据图像源在相应方向上的大小设置。

Mosaic(马赛克)

查看原文

If the object's size is greater than the image size in any directions, then the image will be repeated like a mosaic. This allows creation a large image from only a very narrow source. For example, you can have a 300 x 5 image with a special gradient and set it as a wallpaper using the mosaic feature.

如果对象的大小在任何方向上都大于图像大小,则图像将像马赛克一样重复。 这允许仅从非常窄的源创建大图像。 例如,您可以使用带有特殊渐变的 300 x 5 图像,并使用马赛克功能将其设置为墙纸。

Offset(偏移)

查看原文

With lv_img_set_offset_x(img, x_ofs) and lv_img_set_offset_y(img, y_ofs), you can add some offset to the displayed image. Useful if the object size is smaller than the image source size. Using the offset parameter a Texture atlas or a "running image" effect can be created by Animating the x or y offset.

使用 lv_img_set_offset_x(img, x_ofs)lv_img_set_offset_y(img, y_ofs),您可以为显示的图像添加一些偏移量。 如果对象大小小于图像源大小,则很有用。 使用偏移参数 Texture atlas 或“运行图像”效果可以通过 Animating x 或 y 偏移创建。

Transformations(转换)

查看原文

Using the lv_img_set_zoom(img, factor) the images will be zoomed. Set factor to 256 or LV_IMG_ZOOM_NONE to disable zooming. A larger value enlarges the images (e.g. 512 double size), a smaller value shrinks it (e.g. 128 half size). Fractional scale works as well. E.g. 281 for 10% enlargement.

To rotate the image use lv_img_set_angle(img, angle). Angle has 0.1 degree precision, so for 45.8° set 458.

The transform_zoom and transform_angle style properties are also used to determine the final zoom and angle.

By default, the pivot point of the rotation is the center of the image. It can be changed with lv_img_set_pivot(img, pivot_x, pivot_y). 0;0 is the top left corner.

使用 lv_img_set_zoom(img, factor) 图像将被缩放。 将 factor 设置为 256LV_IMG_ZOOM_NONE 以禁用缩放。 较大的值会放大图像(例如“512”双倍尺寸),较小的值会缩小图像(例如“128”半尺寸)。 分数尺度也有效。 例如。 281 放大 10%。

要旋转图像,请使用 lv_img_set_angle(img, angle)。 角度的精度为 0.1 度,因此对于 45.8° 设置 458。

transform_zoomtransform_angle 样式属性也用于确定最终的缩放和角度。

默认情况下,旋转的轴心点是图像的中心。 它可以通过 lv_img_set_pivot(img, pivot_x, pivot_y) 改变。 0;0 是左上角。

查看原文

The quality of the transformation can be adjusted with lv_img_set_antialias(img, true/false). With enabled anti-aliasing the transformations are higher quality but slower.

The transformations require the whole image to be available. Therefore indexed images (LV_IMG_CF_INDEXED_...), alpha only images (LV_IMG_CF_ALPHA_...) or images from files can not be transformed. In other words transformations work only on true color images stored as C array, or if a custom Image decoder returns the whole image.

Note that the real coordinates of image objects won't change during transformation. That is lv_obj_get_width/height/x/y() will return the original, non-zoomed coordinates.

转换的质量可以通过 lv_img_set_antialias(img, true/false) 来调整。 启用抗锯齿后,转换质量更高但速度更慢。

转换需要整个图像可用。 因此,索引图像(LV_IMG_CF_INDEXED_...)、仅 alpha 图像(LV_IMG_CF_ALPHA_...)或来自文件的图像无法转换。 换句话说,转换仅适用于存储为 C 数组的真彩色图像,或者如果自定义 图像解码器 返回整个图像。

请注意,图像对象的真实坐标在转换过程中不会改变。 即lv_obj_get_width/height/x/y() 将返回原始的、未缩放的坐标。

Size mode(尺寸模式)

查看原文

By default if the image is zoom or rotated the real coordinates of the image object are not changed. The larger content simply overflows the object's boundaries. It also means the layouts are not affected the by the transformations.

If you need the object size to be updated to the transformed size set lv_img_set_size_mode(img, LV_IMG_SIZE_MODE_REAL). (The previous mode is the default and called LV_IMG_SIZE_MODE_VIRTUAL). In this case if the width/height of the object is set to LV_SIZE_CONTENT the object's size will be set to the zoomed and rotated size. If an explicit size is set then the overflowing content will be cropped.

默认情况下,如果图像被缩放或旋转,图像对象的真实坐标不会改变。 较大的内容只是溢出对象的边界。 这也意味着布局不受转换的影响。

如果您需要将对象大小更新为转换后的大小集lv_img_set_size_mode(img, LV_IMG_SIZE_MODE_REAL)。 (之前的模式是默认模式,称为LV_IMG_SIZE_MODE_VIRTUAL)。 在这种情况下,如果对象的宽度/高度设置为“LV_SIZE_CONTENT”,则对象的大小将设置为缩放和旋转后的大小。 如果设置了明确的大小,那么溢出的内容将被裁剪。

Events(事件)

查看原文

No special events are sent by image objects.

See the events of the Base object too.

Learn more about Events.

图像对象不发送特殊事件。

参见 Base object 的事件。

详细了解 事件

Keys(按键)

查看原文

No Keys are processed by the object type.

Learn more about Keys.

对象类型不处理 Keys

了解有关 Keys 的更多信息。

Example

Image from variable and symbol

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_IMG && LV_BUILD_EXAMPLES


void lv_example_img_1(void)
{
    LV_IMG_DECLARE(img_cogwheel_argb);
    lv_obj_t * img1 = lv_img_create(lv_scr_act());
    lv_img_set_src(img1, &img_cogwheel_argb);
    lv_obj_align(img1, LV_ALIGN_CENTER, 0, -20);
    lv_obj_set_size(img1, 200, 200);

    lv_obj_t * img2 = lv_img_create(lv_scr_act());
    lv_img_set_src(img2, LV_SYMBOL_OK "Accept");
    lv_obj_align_to(img2, img1, LV_ALIGN_OUT_BOTTOM_MID, 0, 20);
}

#endif

MicroPython code  

 GitHub Simulator
#!/opt/bin/lv_micropython -i
import usys as sys
import lvgl as lv
import display_driver
from imagetools import get_png_info, open_png

# Register PNG image decoder
decoder = lv.img.decoder_create()
decoder.info_cb = get_png_info
decoder.open_cb = open_png

# Create an image from the png file
try:
    with open('../../assets/img_cogwheel_argb.png','rb') as f:
        png_data = f.read()
except:
    print("Could not find img_cogwheel_argb.png")
    sys.exit()
    
img_cogwheel_argb = lv.img_dsc_t({
  'data_size': len(png_data),
  'data': png_data 
})

img1 = lv.img(lv.scr_act())
img1.set_src(img_cogwheel_argb)
img1.align(lv.ALIGN.CENTER, 0, -20)
img1.set_size(200, 200)

img2 = lv.img(lv.scr_act())
img2.set_src(lv.SYMBOL.OK + "Accept")
img2.align_to(img1, lv.ALIGN.OUT_BOTTOM_MID, 0, 20)

Image recoloring

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_IMG && LV_USE_SLIDER && LV_BUILD_EXAMPLES

static lv_obj_t * create_slider(lv_color_t color);
static void slider_event_cb(lv_event_t * e);

static lv_obj_t * red_slider, * green_slider, * blue_slider, * intense_slider;
static lv_obj_t * img1;


/**
 * Demonstrate runtime image re-coloring
 */
void lv_example_img_2(void)
{
    /*Create 4 sliders to adjust RGB color and re-color intensity*/
    red_slider = create_slider(lv_palette_main(LV_PALETTE_RED));
    green_slider = create_slider(lv_palette_main(LV_PALETTE_GREEN));
    blue_slider = create_slider(lv_palette_main(LV_PALETTE_BLUE));
    intense_slider = create_slider(lv_palette_main(LV_PALETTE_GREY));

    lv_slider_set_value(red_slider, LV_OPA_20, LV_ANIM_OFF);
    lv_slider_set_value(green_slider, LV_OPA_90, LV_ANIM_OFF);
    lv_slider_set_value(blue_slider, LV_OPA_60, LV_ANIM_OFF);
    lv_slider_set_value(intense_slider, LV_OPA_50, LV_ANIM_OFF);

    lv_obj_align(red_slider, LV_ALIGN_LEFT_MID, 25, 0);
    lv_obj_align_to(green_slider, red_slider, LV_ALIGN_OUT_RIGHT_MID, 25, 0);
    lv_obj_align_to(blue_slider, green_slider, LV_ALIGN_OUT_RIGHT_MID, 25, 0);
    lv_obj_align_to(intense_slider, blue_slider, LV_ALIGN_OUT_RIGHT_MID, 25, 0);

    /*Now create the actual image*/
    LV_IMG_DECLARE(img_cogwheel_argb)
    img1 = lv_img_create(lv_scr_act());
    lv_img_set_src(img1, &img_cogwheel_argb);
    lv_obj_align(img1, LV_ALIGN_RIGHT_MID, -20, 0);

    lv_event_send(intense_slider, LV_EVENT_VALUE_CHANGED, NULL);
}

static void slider_event_cb(lv_event_t * e)
{
    LV_UNUSED(e);

    /*Recolor the image based on the sliders' values*/
    lv_color_t color  = lv_color_make(lv_slider_get_value(red_slider), lv_slider_get_value(green_slider), lv_slider_get_value(blue_slider));
    lv_opa_t intense = lv_slider_get_value(intense_slider);
    lv_obj_set_style_img_recolor_opa(img1, intense, 0);
    lv_obj_set_style_img_recolor(img1, color, 0);
}

static lv_obj_t * create_slider(lv_color_t color)
{
    lv_obj_t * slider = lv_slider_create(lv_scr_act());
    lv_slider_set_range(slider, 0, 255);
    lv_obj_set_size(slider, 10, 200);
    lv_obj_set_style_bg_color(slider, color, LV_PART_KNOB);
    lv_obj_set_style_bg_color(slider, lv_color_darken(color, LV_OPA_40), LV_PART_INDICATOR);
    lv_obj_add_event_cb(slider, slider_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
    return slider;
}

#endif

MicroPython code  

 GitHub Simulator
#!/opt/bin/lv_micropython -i
import usys as sys
import lvgl as lv
import display_driver
from imagetools import get_png_info, open_png

# Register PNG image decoder
decoder = lv.img.decoder_create()
decoder.info_cb = get_png_info
decoder.open_cb = open_png

# Create an image from the png file
try:
    with open('../../assets/img_cogwheel_argb.png','rb') as f:
        png_data = f.read()
except:
    print("Could not find img_cogwheel_argb.png")
    sys.exit()
    
img_cogwheel_argb = lv.img_dsc_t({
  'data_size': len(png_data),
  'data': png_data 
})

def create_slider(color):
    slider = lv.slider(lv.scr_act())
    slider.set_range(0, 255)
    slider.set_size(10, 200)
    slider.set_style_bg_color(color, lv.PART.KNOB)
    slider.set_style_bg_color(color.color_darken(lv.OPA._40), lv.PART.INDICATOR)
    slider.add_event_cb(slider_event_cb, lv.EVENT.VALUE_CHANGED, None)
    return slider

def slider_event_cb(e):
    # Recolor the image based on the sliders' values
    color  = lv.color_make(red_slider.get_value(), green_slider.get_value(), blue_slider.get_value())
    intense = intense_slider.get_value()
    img1.set_style_img_recolor_opa(intense, 0)
    img1.set_style_img_recolor(color, 0)
    
#
# Demonstrate runtime image re-coloring
#
# Create 4 sliders to adjust RGB color and re-color intensity
red_slider = create_slider(lv.palette_main(lv.PALETTE.RED))
green_slider = create_slider(lv.palette_main(lv.PALETTE.GREEN))
blue_slider = create_slider(lv.palette_main(lv.PALETTE.BLUE))
intense_slider = create_slider(lv.palette_main(lv.PALETTE.GREY))

red_slider.set_value(lv.OPA._20, lv.ANIM.OFF)
green_slider.set_value(lv.OPA._90, lv.ANIM.OFF)
blue_slider.set_value(lv.OPA._60, lv.ANIM.OFF)
intense_slider.set_value(lv.OPA._50, lv.ANIM.OFF)

red_slider.align(lv.ALIGN.LEFT_MID, 25, 0)
green_slider.align_to(red_slider, lv.ALIGN.OUT_RIGHT_MID, 25, 0)
blue_slider.align_to(green_slider, lv.ALIGN.OUT_RIGHT_MID, 25, 0)
intense_slider.align_to(blue_slider, lv.ALIGN.OUT_RIGHT_MID, 25, 0)

# Now create the actual image
img1 = lv.img(lv.scr_act())
img1.set_src(img_cogwheel_argb)
img1.align(lv.ALIGN.RIGHT_MID, -20, 0)

lv.event_send(intense_slider, lv.EVENT.VALUE_CHANGED, None)






Rotate and zoom

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_IMG && LV_BUILD_EXAMPLES

static void set_angle(void * img, int32_t v)
{
    lv_img_set_angle(img, v);
}

static void set_zoom(void * img, int32_t v)
{
    lv_img_set_zoom(img, v);
}


/**
 * Show transformations (zoom and rotation) using a pivot point.
 */
void lv_example_img_3(void)
{
    LV_IMG_DECLARE(img_cogwheel_argb);

    /*Now create the actual image*/
    lv_obj_t * img = lv_img_create(lv_scr_act());
    lv_img_set_src(img, &img_cogwheel_argb);
    lv_obj_align(img, LV_ALIGN_CENTER, 50, 50);
    lv_img_set_pivot(img, 0, 0);    /*Rotate around the top left corner*/

    lv_anim_t a;
    lv_anim_init(&a);
    lv_anim_set_var(&a, img);
    lv_anim_set_exec_cb(&a, set_angle);
    lv_anim_set_values(&a, 0, 3600);
    lv_anim_set_time(&a, 5000);
    lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
    lv_anim_start(&a);

    lv_anim_set_exec_cb(&a, set_zoom);
    lv_anim_set_values(&a, 128, 256);
    lv_anim_set_playback_time(&a, 3000);
    lv_anim_start(&a);
}

#endif

MicroPython code  

 GitHub Simulator
#!/opt/bin/lv_micropython -i
import usys as sys
import lvgl as lv
import display_driver
from imagetools import get_png_info, open_png

# Register PNG image decoder
decoder = lv.img.decoder_create()
decoder.info_cb = get_png_info
decoder.open_cb = open_png

# Create an image from the png file
try:
    with open('../../assets/img_cogwheel_argb.png','rb') as f:
        png_data = f.read()
except:
    print("Could not find img_cogwheel_argb.png")
    sys.exit()
    
img_cogwheel_argb = lv.img_dsc_t({
  'data_size': len(png_data),
  'data': png_data 
})

def set_angle(img, v):
    img.set_angle(v)

def set_zoom(img, v):
    img.set_zoom(v)


#
# Show transformations (zoom and rotation) using a pivot point.
#

# Now create the actual image
img = lv.img(lv.scr_act())
img.set_src(img_cogwheel_argb)
img.align(lv.ALIGN.CENTER, 50, 50)
img.set_pivot(0, 0)               # Rotate around the top left corner

a1 = lv.anim_t()
a1.init()
a1.set_var(img)
a1.set_custom_exec_cb(lambda a,val: set_angle(img,val))
a1.set_values(0, 3600)
a1.set_time(5000)
a1.set_repeat_count(lv.ANIM_REPEAT.INFINITE)
lv.anim_t.start(a1)

a2 = lv.anim_t()
a2.init()
a2.set_var(img)
a2.set_custom_exec_cb(lambda a,val: set_zoom(img,val))
a2.set_values(128, 256)
a2.set_time(5000)
a2.set_playback_time(3000)
a2.set_repeat_count(lv.ANIM_REPEAT.INFINITE)
lv.anim_t.start(a2)



Image offset and styling

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_IMG && LV_BUILD_EXAMPLES

static void ofs_y_anim(void * img, int32_t v)
{
    lv_img_set_offset_y(img, v);
}

/**
 * Image styling and offset
 */
void lv_example_img_4(void)
{
    LV_IMG_DECLARE(img_skew_strip);

    static lv_style_t style;
    lv_style_init(&style);
    lv_style_set_bg_color(&style, lv_palette_main(LV_PALETTE_YELLOW));
    lv_style_set_bg_opa(&style, LV_OPA_COVER);
    lv_style_set_img_recolor_opa(&style, LV_OPA_COVER);
    lv_style_set_img_recolor(&style, lv_color_black());

    lv_obj_t * img = lv_img_create(lv_scr_act());
    lv_obj_add_style(img, &style, 0);
    lv_img_set_src(img, &img_skew_strip);
    lv_obj_set_size(img, 150, 100);
    lv_obj_center(img);

    lv_anim_t a;
    lv_anim_init(&a);
    lv_anim_set_var(&a, img);
    lv_anim_set_exec_cb(&a, ofs_y_anim);
    lv_anim_set_values(&a, 0, 100);
    lv_anim_set_time(&a, 3000);
    lv_anim_set_playback_time(&a, 500);
    lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
    lv_anim_start(&a);

}

#endif

MicroPython code  

 GitHub Simulator
from imagetools import get_png_info, open_png

def ofs_y_anim(img, v):    
    img.set_offset_y(v)
    # print(img,v)
    
# Register PNG image decoder
decoder = lv.img.decoder_create()
decoder.info_cb = get_png_info
decoder.open_cb = open_png

# Create an image from the png file
try:
    with open('../../assets/img_skew_strip.png','rb') as f:
        png_data = f.read()
except:
    print("Could not find img_skew_strip.png")
    sys.exit()
    
img_skew_strip = lv.img_dsc_t({
  'data_size': len(png_data),
  'data': png_data 
})

#
# Image styling and offset
#

style = lv.style_t()
style.init()
style.set_bg_color(lv.palette_main(lv.PALETTE.YELLOW))
style.set_bg_opa(lv.OPA.COVER)
style.set_img_recolor_opa(lv.OPA.COVER)
style.set_img_recolor(lv.color_black())

img = lv.img(lv.scr_act())
img.add_style(style, 0)
img.set_src(img_skew_strip)
img.set_size(150, 100)
img.center()

a = lv.anim_t()
a.init()
a.set_var(img)
a.set_values(0, 100)
a.set_time(3000)
a.set_playback_time(500)
a.set_repeat_count(lv.ANIM_REPEAT.INFINITE)
a.set_custom_exec_cb(lambda a,val: ofs_y_anim(img,val))
lv.anim_t.start(a)


API

Typedefs

typedef uint8_t lv_img_size_mode_t

Enums

enum [anonymous]

Image size mode, when image size and object size is different

Values:

enumerator LV_IMG_SIZE_MODE_VIRTUAL

Zoom doesn't affect the coordinates of the object, however if zoomed in the image is drawn out of the its coordinates. The layout's won't change on zoom

enumerator LV_IMG_SIZE_MODE_REAL

If the object size is set to SIZE_CONTENT, then object size equals zoomed image size. It causes layout recalculation. If the object size is set explicitly, the image will be cropped when zoomed in.

Functions

lv_obj_t *lv_img_create(lv_obj_t *parent)

Create an image object

参数

parent -- pointer to an object, it will be the parent of the new image

返回

pointer to the created image

void lv_img_set_src(lv_obj_t *obj, const void *src)

Set the image data to display on the object

参数
  • obj -- pointer to an image object

  • src_img -- 1) pointer to an lv_img_dsc_t descriptor (converted by LVGL's image converter) (e.g. &my_img) or 2) path to an image file (e.g. "S:/dir/img.bin")or 3) a SYMBOL (e.g. LV_SYMBOL_OK)

void lv_img_set_offset_x(lv_obj_t *obj, lv_coord_t x)

Set an offset for the source of an image so the image will be displayed from the new origin.

参数
  • obj -- pointer to an image

  • x -- the new offset along x axis.

void lv_img_set_offset_y(lv_obj_t *obj, lv_coord_t y)

Set an offset for the source of an image. so the image will be displayed from the new origin.

参数
  • obj -- pointer to an image

  • y -- the new offset along y axis.

void lv_img_set_angle(lv_obj_t *obj, int16_t angle)

Set the rotation angle of the image. The image will be rotated around the set pivot set by lv_img_set_pivot()

参数
  • obj -- pointer to an image object

  • angle -- rotation angle in degree with 0.1 degree resolution (0..3600: clock wise)

void lv_img_set_pivot(lv_obj_t *obj, lv_coord_t x, lv_coord_t y)

Set the rotation center of the image. The image will be rotated around this point

参数
  • obj -- pointer to an image object

  • x -- rotation center x of the image

  • y -- rotation center y of the image

void lv_img_set_zoom(lv_obj_t *obj, uint16_t zoom)
void lv_img_set_antialias(lv_obj_t *obj, bool antialias)

Enable/disable anti-aliasing for the transformations (rotate, zoom) or not. The quality is better with anti-aliasing looks better but slower.

参数
  • obj -- pointer to an image object

  • antialias -- true: anti-aliased; false: not anti-aliased

void lv_img_set_size_mode(lv_obj_t *obj, lv_img_size_mode_t mode)

Set the image object size mode.

参数
  • obj -- pointer to an image object

  • mode -- the new size mode.

const void *lv_img_get_src(lv_obj_t *obj)

Get the source of the image

参数

obj -- pointer to an image object

返回

the image source (symbol, file name or ::lv-img_dsc_t for C arrays)

lv_coord_t lv_img_get_offset_x(lv_obj_t *obj)

Get the offset's x attribute of the image object.

参数

img -- pointer to an image

返回

offset X value.

lv_coord_t lv_img_get_offset_y(lv_obj_t *obj)

Get the offset's y attribute of the image object.

参数

obj -- pointer to an image

返回

offset Y value.

uint16_t lv_img_get_angle(lv_obj_t *obj)

Get the rotation angle of the image.

参数

obj -- pointer to an image object

返回

rotation angle in 0.1 degrees (0..3600)

void lv_img_get_pivot(lv_obj_t *obj, lv_point_t *pivot)

Get the pivot (rotation center) of the image.

参数
  • img -- pointer to an image object

  • pivot -- store the rotation center here

uint16_t lv_img_get_zoom(lv_obj_t *obj)

Get the zoom factor of the image.

参数

obj -- pointer to an image object

返回

zoom factor (256: no zoom)

bool lv_img_get_antialias(lv_obj_t *obj)

Get whether the transformations (rotate, zoom) are anti-aliased or not

参数

obj -- pointer to an image object

返回

true: anti-aliased; false: not anti-aliased

lv_img_size_mode_t lv_img_get_size_mode(lv_obj_t *obj)

Get the size mode of the image

参数

obj -- pointer to an image object

返回

element of lv_img_size_mode_t

Variables

const lv_obj_class_t lv_img_class
struct lv_img_t
#include <lv_img.h>

Data of image

Public Members

lv_obj_t obj
const void *src
lv_point_t offset
lv_coord_t w
lv_coord_t h
uint16_t angle
lv_point_t pivot
uint16_t zoom
uint8_t src_type
uint8_t cf
uint8_t antialias
uint8_t obj_size_mode