I finally took some time to play with this today. I have some good news and some bad news.
I was able to use the example @Jonathon provided above and after understanding a bit how SVG animation works, I was able to simplify the example (mainly to get rid of the # which I am still not clear on how to work around).
The Good News
I took the simplified code, inserted as the App Formula for a Image type column and double-quoted the appropriate areas and Viola! I was able create an animated SVG in my AppSheet app. See the video below. Code snippet is beneath that.
The Bad News
I wasn’t able to get a static image to display using the SVG HTML functions.
The reason I am playing with this animation functionality is in an attempt to create a scrolling banner with ad images provided by clients. Its something that would run for the entire time a user is using the application and needs to be able to scroll through potentially hundreds of static images. I don’t think GIF’s will help with this.
I WAS able to get an image from my Google drive to scroll within the SVG functions ON AN HTML PAGE. But it wouldn’t work within AppSheet. I am using the images directly from Google, thinking that within the column function, I wouldn’t be able to reference the image through AppSheet columns. No biggy, I could (if it worked) capture the Google ID of the image into the sheet and concatenate that into the AppFormula in the AppSheet column.
BUT, alas, I couldn’t get it to work. Even after narrowing down the code to bare bones to simply display the image. Maybe I’m missing something?
While it works on an HTML page, the image will not display in an image field in AppSheet. Maybe one of you guys will have a suggestion? Code snippet is below.
Code animating a Blue circle over an s-curve path. Have some fun!!
"data:image/svg+xml;utf8, <svg xmlns=""http://www.w3.org/2000/svg"" width=""1000"" height=""400"" viewBox=""-10 -30 1000 400"">
<circle cx="""" cy="""" r=""25"" fill=""blue"">
<animateMotion path=""M-1,1.499h83c0,0,10.5,1,10.5,11.25s-10.25,12.25-10.25,12.25h-43.5c0,0-10.75,0.75-11.75,11.5s9.75,12.25,9.75,12.25H343.5"" dur=""2s"" repeatCount=""indefinite"" fill=""freeze"" />
Code attempting to display an Image directly from Google Drive in an AppSheet column
The image has been made public so I THINK you can access it.
While I can run the portion of the code in an HTML page, it does not seem to run properly in an Image column in AppSheet.
"data:image/svg+xml;utf8, <svg xmlns=""http://www.w3.org/2000/svg"">
<image xlink:href=""https://drive.google.com/uc?export=view&id=1gxvUziCU3zqYpi2B3IiS4OZqcoPp8-NK"" width=""50%"" height=""50%""/>