How to change the transparency of one part of picture ,and the other part remain the same

Important: unclear posts may not receive useful answers.

Before posting

  • Get familiar with Markdown to format and structure your post
  • Be sure to update lvgl from the latest version from the master branch.
  • Be sure you have checked the FAQ and read the relevant part of the documentation.
  • If applicable use the Simulator to eliminate hardware related issues.

Delete this section if you read and applied the mentioned points.


What MCU/Processor/Board and compiler are you using?


What LVGL version are you using?


What do you want to achieve?

Change the transparency of one part of picture ,and the other part remain the same.

What have you tried so far?

Code to reproduce

Add a code snippet which can run in the simulator. It should contain only the relevant code that compiles without errors when separated from your main code base.

The code block(s) should be formatted like:

/*You code here*/

Screenshot and/or video

If possible, add screenshots and/or videos about the current state.

You can’t simply edit an image this way.

There would be possible to create a custom mask but it’s quite complicated and I don’t recommend going so deep.

What is the use case? Maybe there is an other, simpler solution.

Similar to the example of the progress bar, the progress bar uses a picture, the current progress point uses a line, the left side of the line changes transparency, and the right side remains unchanged

For this you can simply set the width of the image and it’d be clipped.

Use this way , i can show the left part of the image , but can’t show the right part of the image .

Using lv_img_set_offset_x(img, x); too should help.