Animated Bitmap

Question

From our designer I got an animated gif bitmap with 30 images. I have set FrameDelay and FrameSize:

However, the image is not animated in EW and also not on the target hardware.

Answer 1

Hello,

have you also set the property Animated of the respective Image view to the value true? See also: Control the playback of an animated bitmap resource.

Anyway, one important question: Are the frames in the animation really 800x480 pixel large? You should consider that such animation will occupy 30x800x480 pixel memory (!). Assuming you are using the DirectAccess mode in RGBA8888 color format, the resulting image will occupy 46 MB ROM. If the resources are compressed you will need 46 MB RAM!

It is not reasonable to deal with such large full screen animation. The animated bitmap feature is intended for small views like a blinking icon, etc. Not for full screen animations.

Hope it helps you further

Best regards

Paul Banach

Comments

I will check this with the designer and the customer.

But there's still the question, why there is no animation at all.

Regarding the documentation the Bitmap ressource should provide attributes Animated and NoOfFrames. As the previous screenshot shows, there are no such attributes.

The corresponding is configured like this:

After making the view visible, I additionally set Animated of the view to true and send the signal StartAnimation. Still no animation.

---

Hello,

you are mixing two different aspects:

1. Bitmap Resource member. It describes the attributes of the bitmap resource, like the name of the PNG file, frame size, etc. These attributes instruct Embedded Wizard what to do during the code generation phase. They don't exist in the resulting application.

2. Bitmap object (an instance of the class Resources::Bitmap). This object represents the bitmap at the runtime. When at the runtime a bitmap resource is accessed by using its original name (e.g. Example::BackgroundImage), you access in fact the corresponding bitmap object. This object contains diverse properties providing information about the original bitmap resource. Since resources are immutable, the properties are read-only. They exist to permit the application to evaluate the information associated with the bitmap.

Accordingly, if you configure a bitmap resource member with the attributes FrameSize and FrameDelay to describe an animate bitmap, and then you access this bitmap by using its original name, you will get an bitmap object with its property FrameSize being equal to the value of the FrameSIze attribute as it was found at the code generation time in the corresponding resource member. The property Animated of the bitmap object is true or false depending on whether the original resource member was configured as an animated or not animated bitmap resource.

Please see also: Use the bitmap resource.

Best reagrds

Paul Banach

---

I mixed attributes of the class definition and the object.

But, why isn't the object animated at all, since my settings seem to be ok? Is this also the result of the image size?

Or is it due to the fact, that when selecting the bitmap resource, EW just offers PNG, JPG and BMP. My file is a GIF, which I select after viewing "all files" in the "Choose the file" dialog.

Since our customer insists on implementing large animated images, could this help?

• decreasing image size and number of frames
• Is it possible to store the animated images on a reserved part of the flash, which will be fixed and not updated by any later Update? Will this have nagative impact on the system performance?

---

Hello,
maybe you can first try to make a bitmap animation with a smaller bitmap, e.g. let's assume you have an image with 5 icons, each with 20x20 pixel in one row (total image size is 100x20 pixel).
After adding this bitmap resource to your project, set the attribute FrameSize to <20,20> and the attribute FrameDelay to 1000.
If you now use a Views::Image object within your application, that uses this bitmap resource you can set the property Animated to true (there is no need to send an additional signal). Starting the Prototyper will show every second the next frame of the bitmap resource. Does this work?

Concerning your bitmap resource: Are you using an animaged GIF or is the GIF a large image containing all frames? Please note, that there is no conversion from animated GIFs into multi-frame bitmap resources!

In order to find the best solution for your application, the intended use-case has to be considered, for example:

• If you want to make small animations, animated bitmap resources are a good choice and very easy to use.
• If you want to make some animated full screen backgrounds (e.g. every x seconds the background is faded over into the next background), it might be better to use ExternBitmap and adapt a JPEG decoder.
• If you want to present some video sequences (e.g. short help videos, instruction manuals) it might be better to integrate a video decoder.

Since version 9.00, it is possible to locate the pixel data of images in a separated linker section. There is no negative impact on the system performance - as long as the flash speed is the same.

I hope this helps.

Best regards,

Manfred Schweyer.

 

---

Hello,

then the correct format would be a GIF, containing all frames, and not the animated GIF?

---

Hello,

yes, Embedded Wizard supports the common image file formats PNG, JPG, BMP and GIF. In case of a multi-frame bitmap resources, the content of the original image file is split in several equally sized frames.

There is no support for animated GIFs to convert them into a multi-frame bitmap resource.

Best regards,

Manfred.

---

Could you please explain it with a sample.

I also need to implement an activity indicator like this.

https://github.com/Codelessly/FlutterLoadingGIFs/blob/master/assets/images/circular_progress_indicator_small.gif

---

Hello,

if you want to implement such activity indicator as animated bitmap you create a PNG file using your preferred graphic editor. The PNG should contain all the phases (frames) of the animation arranged side by side (frame by frame) like a frame strip. See the section: Configure a multi-frame bitmap resource.

However, in the concrete case of the above referenced circular progress indicator, I think it would be much easier to use the vector graphic. See the sections:

Stroked Path

Arc Path Data

Then I would take Change In32 Effects to animate start and end angles in Arc Path Data. 

Best regards

Paul Banach