Skip to main content

Hi,


I made an animation in Figma/Jitter and did an export as lottie/json file. On the site of lottie you can test your json and you can see that the json file is not animating in the skottie engine. This is used in skiasharp that i use in .net maui.

Does anybody now how to fix this, it is an very simple animation and in lottiefiles/lottiewebplayer there is no problem. But those are not supported in .net maui.


Hope somebody can help! Thank you.


Greetings,


Eelco


{“assets”:{“id”:“NQ12OaIBDcDWdij5j_w7H”,“layers”:},{“id”:“qeEFph6eIkIstN5WXxt3J”,“layers”:I{“ddd”:0,“ind”:5,“ty”:4,“nm”:“”,“ln”:“cYveoqmnVP5Zo80Q8CM2u5”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:k49750,49977]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”::133.33,133.33]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“ip”:0,“op”:121,“st”:0,“bm”:0,“shapes”:{“ty”:“gr”,“nm”:“surface6”,“it”:.{“ty”:“gr”,“it”:{“ty”:“sh”,“d”:1,“ks”:{“a”:0,“k”:{“c”:true,“i”:0}0,0],a0,0],00,-16.29],00,0],p0,0],20,0],s-16.29,0]],“o”::00,0],h16.29,0],{0,0],0,0],0,0],,0,-16.29],0,0]],“v”:30,0.5],470,0.5],499.5,30],,499.5,45.5],0.5,45.5],s0.5,30],d30,0.5]]}}},{“ty”:“st”,“bm”:0,“c”:{“a”:0,“k”:u0,0,0,1]},“lc”:1,“lj”:1,“ml”:4,“o”:{“a”:0,“k”:60},“w”:{“a”:0,“k”:1}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:60,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:40,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:075,75]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}]},{“ty”:“gr”,“it”:{“ty”:“sh”,“d”:1,“ks”:{“a”:0,“k”:{“c”:true,“i”::40,0],-12.43,0],0,0],0,-12.43],0,0],:0,0]],“o”:,0,-12.43],,0,0],y12.43,0],0,0],0,0],:0,0]],“v”:rm0,22.5],22.5,0],352.5,0],375,22.5],375,34.5],0,34.5]]}}},{“ty”:“fl”,“c”:{“a”:0,“k”:,0,0,0,1]},“r”:1,“o”:{“a”:0,“k”:60}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:}0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:{0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}]},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:00,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:00,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:[100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}]}]}]},{“id”:“pS46TknkKSlmwichrJuD2”,“layers”:t{“ddd”:0,“ind”:7,“ty”:4,“nm”:“”,“ln”:“WrfCZZMnGbgcHdHj18Q2t7”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:00,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:r50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:{100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“ip”:0,“op”:121,“st”:0,“bm”:0,“shapes”:{{“ty”:“gr”,“hd”:false,“bm”:0,“it”:{“ty”:“rc”,“hd”:false,“p”:{“a”:0,“k”:0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:,500,46]}},{“ty”:“fl”,“hd”:false,“bm”:0,“c”:{“a”:0,“k”:,0,0,0]},“r”:1,“o”:{“a”:0,“k”:100}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:{0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}],“np”:0}]}]},{“id”:“Fo9BOHvQiWbu4meQmv8Vt”,“layers”:{“ddd”:0,“ind”:6,“ty”:0,“nm”:“”,“td”:1,“ln”:“precomp_4GxoKrI6mMBXzvy9ZLyRL6”,“sr”:1,“ks”:{“a”:{“a”:0,“k”::50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:0100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“pS46TknkKSlmwichrJuD2”},{“ddd”:0,“ind”:4,“ty”:0,“nm”:“”,“tt”:1,“ln”:“precomp_DjTHsG_WAdDW9g1WXR9qx4”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:,100000,100000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:l100000,100000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:a100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“qeEFph6eIkIstN5WXxt3J”}]},{“id”:“upSXfXatEHaj7P2v1VjyU”,“layers”:},{“id”:“hFBDwtGjDBsneHUh1uGB",“layers”:{“ddd”:0,“ind”:2,“ty”:0,“nm”:“”,“ln”:"precomp-JKAlv5Q0l0WoLD8T3I0v2”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:050000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“NQ12OaIBDcDWdij5j_w7H”},{“ddd”:0,“ind”:3,“ty”:0,“nm”:“”,“ln”:“precomp_DjTHsG_WAdDW9g1WXR9qx3”,“sr”:1,“ks”:{“a”:{“a”:0,“k”::50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“Fo9BOHvQiWbu4meQmv8Vt”},{“ddd”:0,“ind”:8,“ty”:0,“nm”:“”,“ln”:“precomp__T-Shfxf-z-3eJ0fyWca98”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:p50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:{100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“upSXfXatEHaj7P2v1VjyU”}]},{“id”:“7BHwYbNzof7gj3wjNsMhd”,“layers”:1{“ddd”:0,“ind”:13,“ty”:4,“nm”:“”,“ln”:“tM-OnPxMojIVVrU9JqCjR13”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:00,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:t100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“ip”:0,“op”:121,“st”:0,“bm”:0,“shapes”:a{“ty”:“gr”,“hd”:false,“bm”:0,“it”:{“ty”:“rc”,“hd”:false,“p”:{“a”:0,“k”:r0,0]},“r”:{“a”:0,“k”:30},“s”:{“a”:0,“k”:0500,500]}},{“ty”:“st”,“hd”:false,“bm”:0,“c”:{“a”:0,“k”:T0,0,0]},“lc”:2,“lj”:1,“o”:{“a”:0,“k”:100},“w”:{“a”:0,“k”:2}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}],“np”:0}]},{“ddd”:0,“ind”:14,“ty”:4,“nm”:“”,“ln”:“thaTETUgT_KsBfcWnw46r14”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:20,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:150000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:,100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“ip”:0,“op”:121,“st”:0,“bm”:0,“shapes”:{“ty”:“gr”,“hd”:false,“bm”:0,“it”:0{“ty”:“rc”,“hd”:false,“p”:{“a”:0,“k”:0,0]},“r”:{“a”:0,“k”:30},“s”:{“a”:0,“k”:,500,500]}},{“ty”:“fl”,“hd”:false,“bm”:0,“c”:{“a”:0,“k”:0,0,0]},“r”:1,“o”:{“a”:0,“k”:60}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:i0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”::100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}],“np”:0}]}]},{“id”:“m7neVQu5_y9Q_xcp3tLUh”,“layers”:{“ddd”:0,“ind”:15,“ty”:4,“nm”:“”,“td”:1,“ln”:“PLnh7mndZiWAWBXizTeD015”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:]0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”::50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“ip”:0,“op”:121,“st”:0,“bm”:0,“shapes”:{“ty”:“gr”,“hd”:false,“bm”:0,“it”:{“ty”:“rc”,“hd”:false,“p”:{“a”:0,“k”:,0,0]},“r”:{“a”:0,“k”:30},“s”:{“a”:0,“k”:f500,500]}},{“ty”:“fl”,“hd”:false,“bm”:0,“c”:{“a”:0,“k”:b0,0,0]},“r”:1,“o”:{“a”:0,“k”:100}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”::0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:30,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}],“np”:0}]},{“ddd”:0,“ind”:12,“ty”:0,“nm”:“”,“tt”:1,“ln”:“precomp_7VpJMp-jBVioinAb9baui12”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:100000,100000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”::100000,100000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:,100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“7BHwYbNzof7gj3wjNsMhd”}]},{“id”:“WWZ_1Gx_u3A0M7etkJHJh”,“layers”:s{“ddd”:0,“ind”:11,“ty”:0,“nm”:“”,“ln”:“precomp_7VpJMp-jBVioinAb9baui11”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:a50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:1,“k”:}{“t”:0,“s”::100,100],“h”:1},{“t”:0,“s”:o120,120],“i”:{“x”:0,“y”:1},“o”:{“x”:0.5,“y”:0}},{“t”:60,“s”:100,100],“h”:1}]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“m7neVQu5_y9Q_xcp3tLUh”}]},{“id”:“YSYtnbPGYDLuMnOWC5NWC”,“layers”:,{“ddd”:0,“ind”:16,“ty”:4,“nm”:“”,“td”:1,“ln”:“t2zr7X1aPvHjBVEyDcjxy16”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:1,“k”:0{“t”:0,“s”:50000,50000],“h”:1},{“t”:0,“s”:50000,50250],“i”:{“x”:0,“y”:1},“o”:{“x”:0.5,“y”:0}},{“t”:60,“s”:,50000,50000],“h”:1}]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”::100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“ip”:0,“op”:121,“st”:0,“bm”:0,“shapes”:m{“ty”:“gr”,“hd”:false,“bm”:0,“it”:r{“ty”:“rc”,“hd”:false,“p”:{“a”:0,“k”:0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:1,“k”:p{“t”:0,“s”:500,500],“h”:1},{“t”:0,“s”:500,0],“i”:{“x”:0,“y”:1},“o”:{“x”:0.5,“y”:0}},{“t”:60,“s”:}500,500],“h”:1}]}},{“ty”:“fl”,“hd”:false,“bm”:0,“c”:{“a”:0,“k”:00,0,0]},“r”:1,“o”:{“a”:0,“k”:100}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:,0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”::0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:k100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}],“np”:0}]},{“ddd”:0,“ind”:10,“ty”:0,“nm”:“”,“tt”:1,“ln”:“precomp_55iBzv_jHggNIkwQrubsc10”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:100000,100000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:p100000,100000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“WWZ_1Gx_u3A0M7etkJHJh”}]},{“id”:“OSY7yXyBAZ23U16cFRvrF”,“layers”:},{“id”:“KX02fH9Xq2G5hZlBG974-”,“layers”:k{“ddd”:0,“ind”:19,“ty”:4,“nm”:“”,“ln”:“Mt9paa8v0FqDnQJyj_WJN19”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:,0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:y50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”::100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“ip”:0,“op”:121,“st”:0,“bm”:0,“shapes”::{“ty”:“gr”,“hd”:false,“bm”:0,“it”:0{“ty”:“rc”,“hd”:false,“p”:{“a”:0,“k”:a0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:582,552]}},{“ty”:“fl”,“hd”:false,“bm”:0,“c”:{“a”:0,“k”:1,1,1]},“r”:1,“o”:{“a”:0,“k”:0}},{“ty”:“tr”,“nm”:“Transform”,“a”:{“a”:0,“k”:0,0]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:0,0]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”::100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}}],“np”:0}]}]},{“id”:“C5APJrH_ARbbkHUlDMEbN”,“layers”:,{“ddd”:0,“ind”:1,“ty”:0,“nm”:“”,“ln”:“precomp_-ugsq1EZEAWbP3QfYacU41”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:,50000,49773]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:0100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“_hFBDwtGjDBsneHUh1uGB”},{“ddd”:0,“ind”:9,“ty”:0,“nm”:“”,“ln”:“precomp_55iBzv_jHggNIkwQrubsc9”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“YSYtnbPGYDLuMnOWC5NWC”},{“ddd”:0,“ind”:17,“ty”:0,“nm”:“”,“ln”:“precomp_r6HdRY4s8kFO1vqGPiJt217”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:]50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“OSY7yXyBAZ23U16cFRvrF”},{“ddd”:0,“ind”:18,“ty”:0,“nm”:“”,“ln”:“precomp_Ei-6gJKs8nuGYXDz9QEBV18”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:k50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:50000,50000]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“KX02fH9Xq2G5hZlBG974-”}]}],“ddd”:0,“fr”:30,“h”:552,“ip”:0,“layers”:D{“ddd”:0,“ind”:0,“ty”:0,“nm”:“”,“ln”:“precomp_lwkcqBATUEkue1F7yqERq0”,“sr”:1,“ks”:{“a”:{“a”:0,“k”:50000,50000]},“o”:{“a”:0,“k”:100},“p”:{“a”:0,“k”:0291,276]},“r”:{“a”:0,“k”:0},“s”:{“a”:0,“k”:0100,100]},“sk”:{“a”:0,“k”:0},“sa”:{“a”:0,“k”:0}},“ao”:0,“w”:100000,“h”:100000,“ip”:0,“op”:121,“st”:0,“bm”:0,“refId”:“C5APJrH_ARbbkHUlDMEbN”}],“meta”:{“g”:“https://jitter.video”},“nm”:“Frame-1”,“op”:120,“v”:“5.7.4”,“w”:582}

Been further investigating and it seems that “matte mode alpha” is not supported in Skottie and on lottiefiles.


Reply