SVG animated icons

[Greg Hains]

Hello,

An SVG newbie here.

I would like to use animated SVG icons, but I am having trouble using them.
From what I can tell, they can only be imported onto a button - not directly on a layout - and whilst it displays on the button, it does not animate.
On that point, is it possible to place it on a layout through the likes of a web viewer perhaps?

I'm on a Mac (OS is High Sierra 10.13.6) running FMPA 18.0.3 and wondering if this platform may be the issue. I've seen mention about IE and Edge being a problem, but not Mac.

I've not found anything through Google on how these are used in Filemaker.
Can I get a hand please?

Greg 

[comment]

35 minutes ago, Greg Hains said:

From what I can tell, they can only be imported onto a button

They can also be shown in a web viewer, where animation is supported according to the platform browser's (Safari or IE) support.

Filemaker supports only a limited subset of SVG for its icons - see the list here: https://fmhelp.filemaker.com/docs/14/en/svg/

What type of animation (SMIL/ECMA/CSS) do you want to use?

--
Note that SVG animation has more or less died with the introduction of HTML 5.

[Greg Hains]

Hi Comment,

To my rescue again. 🙂

Thank you for that link on SVG grammar.
From what I can determine, SMIL is an abbreviation that has appeared often in my searches - when I was looking into using the animated SVG files. I have no preference of animation type to be quite honest, although I understood using animated GIFs within web viewers to be an antiquated method - I'm happy to be corrected.
Sometime back I was playing with Base64 in container fields, but I don't see much current mention of this. There were other forums that talked about saving animated GIF files in a container field and displaying it - but I had limited success with this - https://hbase.net/2010/11/09/filemaker-progress-indicators-using-a-web-viewer-and-animated gifs/  

The animations I am looking to employ - say from Elementals - would be the ones associated with "Please Wait" - such as the spinning ones. Script runs, animation appears, script completes and animation is hidden again.

I have no preference as to how the file is employed, but with huge library of animated SVG icons available it would be nice to utilise them where I can.

Thank you again.
Greg

  

Edited January 22, 2020 by Greg Hains

[comment]

18 minutes ago, Greg Hains said:

I understood using animated GIFs within web viewers to be an antiquated method

True, but it still works - and has the advantage of a much larger stock of ready-to-use icons. However, GIFs have a fixed resolution, unlike SVGs that are vector-based. As I hinted earlier, the modern method is to use canvas animation introduced in HTML 5.

 

30 minutes ago, Greg Hains said:

There were other forums that talked about saving animated GIF files in a container field and displaying it - but I had limited success with this.

You must make sure that the GIF is inserted as a picture and that the container is optimized for interactive content.

 

 

 

[Greg Hains]

Hi Comment,

The inability to scale GIFs would not bother me - they would all be fixed size anyway.

Thanks for the info re HTML5 canvas animation.  I'll look into this further as opposed to SVGs.

Greg