Can I use animated GIFs in my app?

Problem

Can I use animated .gif images in my app?

Solution

You cannot use an animated .gif image for an Image Library image (some will just show a single static frame, others will not display at all).  There is, however, a way to display one in your app, at least on the Detail View of a Flex AppBlock.

 

Watch this video or follow the steps below:

 

 

 

 

1. Go to Data Mapping for your Flex AppBlock.

2. Add a new field and set the Field Type to "Long Text with HTML Content".

3. Click the green "Apply" button.

 

 

4. Go to AppOffice for your Flex AppBlock.

5. Click the Edit button (far left side of table) for an item.

6. Find your new field (in the "Long Text Fields" section) and click into it.

 

 

 

 

7. When the menu displays, click the Insert/Edit Image button.

 

 

 

8. Paste your animated GIF's URL into the Source field.

9. The Image Description field does not matter.

10. The Dimensions field affects how big the image will display on devices - you might have to try a few different numbers to get the right size.

11. Leave "Constrain proportions" checked - this ensures your image will maintain aspect ratio.

12. Click the "OK" button.

 

 

 

 

13. Click the green "Save Edits" button.

 

 

14. Repeat steps 5-13 for all items you want to show an animated GIF.

15. Go to Phone Canvases for your Flex AppBlock.

16. Go to the Detail View.

17. In the Tool Box on the right, on the My Content tab, open the Text drawer, find your new field, and drag it onto the canvas.

18. Once you can see the GIF on the canvas, you may want to change the size.  To do that:

a. Go to AppOffice and edit the item. (step 4 & 5)

b. Find your GIF field and click the image.

c. Click the Insert/Edit Image button.

d. Change a dimension (the other dimension will automatically update to maintain aspect ratio) and click the OK button.

e. Click the green "Save Edits" button. (step 13)

f. Go back to the canvas and see how it looks with the new dimensions