Skip to main content
scottSD
Senior III
June 18, 2019
Question

Is there a way to change the color of an image in code?

  • June 18, 2019
  • 9 replies
  • 1904 views

I am working on an application that will need to be able to allow the user configure the color scheme of the screen. That is, the color of various images will need to be changeable. Is there a way do this with the TouchGFX libraries? What I would like is to have a basic image and be able to paint it using the libraries. I did not see any examples of this provided.

I would prefer to not have multiple images in the assets, each of a different color because the number of different colors this application will require.

Or would this require drawing the image in code with the abstract shape class and then paint it?

This topic has been closed for replies.

9 replies

Martin KJELDSEN
Principal III
June 18, 2019

Hi Scott,

I'm not entirely sure what you mean by changing the color of images. Images can be complex.

If you insist, you can get the image data from any image and "go to town" on the data, changing it however you want. If you have static Bitmaps that reside in QSPI then that data is static, but you could create a DynamicBitmap and copy the static data to this new images buffer and modify it there.

Let me know. I think i'm missing a few pieces of the puzzle here.

/Martin

scottSD
scottSDAuthor
Senior III
June 18, 2019

Martin,

Thanks for the quick reply. Sorry for my brief description.

In this case, the images would not necessarily be complex. It is possible that maybe they would be grey-scale and then "paint" or "tint" them as the user selects color schemes. The DynamicBitmap sounds promising but I am unfamiliar with it. I will look into it. Is there a tutorial describing/discussing it's functionality?

scottSD
scottSDAuthor
Senior III
July 10, 2019

Martin,

I am just getting back to trying this. I looked over the example you provided and it uses a BMPFileLoader.

And when I look at this article:

https://touchgfx.zendesk.com/hc/en-us/articles/207460605-Dynamic-Bitmaps-Load-images-at-runtime

It refers to BMPFileLoader, but I cannot find it in the latest version of TouchGFX. Is it no longer supported?

I also found this discussion concerning it:

https://community.st.com/s/question/0D50X0000AYqpM7/where-is-bmpfileloader

Are we to write our own loader for this since it is not in TouchGFX 4.10.0 ?

Basically, what I want to do is load images that are part of the designer into a dynamic bitmap and manipulate it, which is turning into a larger task than I had anticipated.

Martin KJELDSEN
Principal III
July 11, 2019

Hi @scottSD​,

The BMPFileLoader is not a framework construct which is why it's not in any release. You'll have to get it from that example i posted just above. The same goes for PNGFileLoaders, and whatever else you want to decode.

/MArtin

scottSD
scottSDAuthor
Senior III
July 11, 2019

Thanks Martin. I didn't realize I needed to copy the files into my project.

I ended up doing something else that appears to work for me.

When a PNG image is dropped into the Designer, it becomes part of the BitmapDatabase and given an ID (in BitmapDatabase.hpp). Is the image now available to be cached? It appears so, because I was able to manually copy the source bitmap into the dynamic bitmap i created. I cached the source bitmap and read the address using cacheGetAddress(), then manually copied the source bitmap into the dynamic bitmap.

For some reason the function cacheReplaceBitmap() is returning false when I try using it to replace the contents of the dynamic bitmap with the source bitmap. The bitmaps are the same size, so not sure why it's returning false.