Load images on M5Paper in UIFlow

fr3nd

Hi,

I'm trying to load images in a M5Paper unit using uiflow with no success. I've tried several formats (png, bmp, jpg) and different options when saving, but I always get the same result...

I'm uploading the image in the device file manager, and then after adding the image at the position where I want it, I add the following blocks:

Set screen background color
Set image0 to image.bmp (to the right name of the image file)
Show image0
Set screen show

But When running the program, I get an exclamation mark at the top of the screen.

Am I doing anything wrong? Is this feature actually working?

felmue

Hello @fr3nd

have you tried to display the default.jpg? Does that work?

Using UIFlow 1.8.7 (https://flow.m5stack.com) these are the steps which worked for me:

drag image icon onto screen (e.g. image0)
block set image0 image default.jpg
block set screen show

Thanks
Felix

fr3nd

Hi @felmue

This works with the default image default.png, but once I upload a different one it shows the exclamation mark symbol.

I've tried with different formats and options when saving, but I haven't found a combination that works. Is there any documentation on the requirements of the images? Has anyone had any success using custom images in m5paper in uiflow?

Thanks

felmue

Hello @fr3nd

sorry, I don't know of any documentation on the requirements of the images.

Thanks
Felix

fr3nd

For the record, I was finally able to generate images that load properly with the following ImageMagick command:
convert image.png -colorspace RGB -depth 8 -colors 16 PNG8:exported/image.png

ajb2k3

@fr3nd I was just about to say that it is an issue with the way the image is saved.
I started making a document here :https://github.com/Ajb2k3/UIFlowHandbook/blob/master/En-Coreink-V2.pdf

doragasu

This is a bit late, but today I was trying to display images in M5Stack Fire module, and had the same problem. After a bit of trial and error, I discovered that if the PNG file names are long, this error will trigger. And it is not easy to guess that the long file name caused it!

ajb2k3

This is a limit of the filesystem formatting.

7ames

I know this is an older thread but it really saved me! I downloaded GIMP (latest version is currently 2.10.34) and by exporting a PNG, Turning all checks off and compression level to 9 (max) and then pixelformat to 8bpc RGB. With a small filename the image will appear in the UI Flow workspace and on the M5 stick C Plus.

I couldnt get Photoshop, Aseprite and even Paint to get anything in UI flow. But GIMP worked just fine.
Hope this helps someone else down the road.

ajb2k3

@7ames I have used GIMP since 1999 and used it in my guide document. Glad you worked it out.

Xiong_M5Stack

@fr3nd the picture must be less than 50kb

mtylerjr

I just got my M5Paper today, so this is very timely info for me, thanks!