change image at runtime

Mvona.1 · ‎2020-09-29

Hi.

I want to show battery image in screen of STM32F746_DISCOVERY and change battery image by UART value that stm receives from an atmega. I have 4 images to show battery level and they must replace by each other according to Uart data values.

I read "Loading Images at Runtime" in support.touchgfx.com but it confused me and I don't understand how to do it. please help me.

Romain DIELEMAN · ‎2020-09-30

Hi,

Just to make sure I understand your situation correctly and that you do not get mixed up between displaying simple images and using dynamic bitmaps: what you are trying to do is just to change the image displayed according to the battery level right? You receive only the value of the battery life, not images stored in an SD card ?

What you can do is just to use an image widget and in your user code change the bitmap when you reach a certain value (battery life remaining). Put your images in PNG format in your TouchGFX/assets/images folder.

imageName.setBitmap(Bitmap(BITMAP_ID));  // ID of the image you want to show, go to BitmapDatabase.hpp to see the ID of your images
imageName.invalidate();  // do not forget to invalidate

PS: you need to include the bitmap database in your screen's cpp file otherwise the code will not find your images: #include "BitmapDatabase.hpp"

/Romain

View solution in original post

Romain DIELEMAN · ‎2020-09-30

Hi,

Just to make sure I understand your situation correctly and that you do not get mixed up between displaying simple images and using dynamic bitmaps: what you are trying to do is just to change the image displayed according to the battery level right? You receive only the value of the battery life, not images stored in an SD card ?

What you can do is just to use an image widget and in your user code change the bitmap when you reach a certain value (battery life remaining). Put your images in PNG format in your TouchGFX/assets/images folder.

imageName.setBitmap(Bitmap(BITMAP_ID));  // ID of the image you want to show, go to BitmapDatabase.hpp to see the ID of your images
imageName.invalidate();  // do not forget to invalidate

PS: you need to include the bitmap database in your screen's cpp file otherwise the code will not find your images: #include "BitmapDatabase.hpp"

/Romain

Mvona.1 · ‎2020-10-06

Hi.
Thanks alot for your reply. You solve my problem. I can do what I want. It is the best guidance for me.

MTora.1 · ‎2023-01-15

Hi

Dears, I need to delete some images and text after programming MCU.

for example, imagine that I have four images of flowers, I wanna replace them with four winter images.

I can send them via UART or something similar to MCU. I can use SD or SDRAM as you suggest, of course I think SDRAM is the best choice.

Please let me know your idea.

Thanks

Romain DIELEMAN · ‎2023-01-15

Hi,

SD or SDRAM is what I would go for. You will need to use bitmap caching to achieve this.

/Romain

MTora.1 · ‎2023-01-15

can I have two bitmap caches? one for fixing data and another one for temporary data?

Romain DIELEMAN · ‎2023-01-15

Yes it should be possible. However, if by "fixed" data you mean images that will never change for sure you do not necessarily need to cache them (assuming you have enough flash to store them).

/Romain

Romain DIELEMAN · ‎2023-01-15

Actually I might be wrong about the two cache part 🤔, not entirely sure if the TouchGFX related functions can differentiate caches and send the bitmap in the desired one. There should be a way to do that I am sure but have not tried/thought of that myself sorry.

If another user has, please chip in.

/Romain

MTora.1 · ‎2023-01-27

Hi

would you please give me some examples or tutorials about changing images runtime and dynamic cache?

it makes me confused.

I read touchgfx article.

https://support.touchgfx.com/4.14/docs/development/ui-development/scenarios/loading-images-at-runtime