637
Views
24
Comments
Solved
[Lottie Animations] How to use Lottie Animation
Question
lottie-animations
Reactive icon
Forge asset by Pedro Oliveira

Hello Mates, 


I'm trying to make a demo on using Lottie plugin to handle the splash screen with a moving logo for my company.


Here is what I did after uploading the logo json file to the resources folder. 


Here is the output error now 


Please Help if I'm missing something cause its not working !!


Best Regards, 

Mohamed AlMokadem

2018-08-26 20-34-32
Pankaj pant
Solution

Mohamed ElMokadem wrote:

Hi Henrique, 

I have tried the same json files but I think I'm still missing something 

Can you check my properties here If you can find it. 

Yes I have layout on my screen 



Note: I'm using it on the same module so I think I don't need to set a Target Directory 


Cheers,

Hi Mohamed,


keep your container first then web blog. like below it will work

Regards,

Pankaj

2017-07-05 22-17-18
Henrique Batista
Staff

Hi Mohamed,

Can you share the json so I can try to debug it on my side?

Cheers,

2024-11-21 13-12-27
Mohamed AlMokadem

Henrique Batista wrote:

Hi Mohamed,

Can you share the json so I can try to debug it on my side?

Cheers,

Hi Henrique, 


Thanks for you reply. 


Actually I have tried more than one also tried to download from Lottie web site itself, but sadly nothing happened. The same white empty screen. 

Please check the attached file judgement.json  I have downloaded it from Lottie site too.


Cheers,

judgement.json
2017-07-05 22-17-18
Henrique Batista
Staff

Hi Mohamed,

I was able to made it work, just pointed to the resources url. You can check it here.

Are you sure that your URL is the correct one? Beacause I'm using it like this:

Don't forget to deploy the resource to a target directory.

Other question, do you have any layout on that page?


Cheers

2024-11-21 13-12-27
Mohamed AlMokadem

Hi Henrique, 

I have tried the same json files but I think I'm still missing something 

Can you check my properties here If you can find it. 

Yes I have layout on my screen 



Note: I'm using it on the same module so I think I don't need to set a Target Directory 


Cheers,

2018-08-26 20-34-32
Pankaj pant
Solution

Mohamed ElMokadem wrote:

Hi Henrique, 

I have tried the same json files but I think I'm still missing something 

Can you check my properties here If you can find it. 

Yes I have layout on my screen 



Note: I'm using it on the same module so I think I don't need to set a Target Directory 


Cheers,

Hi Mohamed,


keep your container first then web blog. like below it will work

Regards,

Pankaj

2017-07-05 22-17-18
Henrique Batista
Staff

Hey Mohamed,

You have samples on the component itself.

I don't know if that Path is correct, like I pasted on the image on above post. Do you ahve any constraint to not add the .json as a resource?

Cheers

2024-11-21 13-12-27
Mohamed AlMokadem

Henrique Batista wrote:

Hey Mohamed,

You have samples on the component itself.

I don't know if that Path is correct, like I pasted on the image on above post. Do you ahve any constraint to not add the .json as a resource?

Cheers

Hello Henrique,


I can't see the path from your picture  it's not complete. 


Or please send a sample oml cause the module does not have any samples, It only contains a web block to use. 


Thanks for your concern.

Cheers,

Mohamed AlMokadem


2020-12-24 13-17-14
Navaneethan M

Hi Henrique,


Can you send the .oml file?


_Navaneethan

2017-07-05 22-17-18
Henrique Batista
Staff

Hi _Navaneethan,

The component itself has the examples, just open it and take a look.

Cheers

2020-12-24 13-17-14
Navaneethan M

Hi Henrique,


You are telling about this?. When i open in browser, it shows the module does not contain default entry.

this module has one web block and four server actions only. no screens are  in this module.

if any sample is using this animation, please redirect it to me.


i am asking your  oml file, 


Thanks,

_Navaneethan

2024-11-21 13-12-27
Mohamed AlMokadem

Thank you Henrique Batista  for your concern and replies, Its always a very small specific reason why its not working :)

@Pankaj pant  Hahah Thank you Its working now, I tried every thing, but not this one :)  

2018-08-26 20-34-32
Pankaj pant

This happens to me every time while using javascript. :)


2020-12-24 13-17-14
Navaneethan M

Hi Mohamed/Pankaj,


Still i dont get that. can anyone send youe oml.?


Thanks

_Navaneethan

2017-07-05 22-17-18
Henrique Batista
Staff

Hi Navaneethan,

My, mistake, I was under the impression they were under the same app.

Here you go.

Cheers

Lottie Sample.oap
2021-04-28 11-18-06
Vitheya sudesan

Hi,

  That oml doesnt work me.

2020-12-24 13-17-14
Navaneethan M

Hi Henrique,


Thanks for your reply and your .oap file .its working fine. 

I changed deploy action as deploy to target action to Do nothing. 

Thanks Mohamed and Pankaj.


_Navaneethan

2024-01-05 16-00-17
Filipe Lourenço

How to customize? For instance lets say that i want to change the color.

2018-08-26 20-34-32
Pankaj pant

Filipe Lourenço wrote:

How to customize? For instance lets say that i want to change the color.

In order to change color, you have to edit JSON file in Adobe After Effects.


Regards,

Pankaj


2017-07-05 22-17-18
Henrique Batista
Staff

Hi Filipe,

Just to add on Pankaj post that sometimes your animations colors can be edited here, but it fails a lot of times.

Cheers

2024-01-05 16-00-17
Filipe Lourenço

Henrique Batista wrote:

Hi Filipe,

Just to add on Pankaj post that sometimes your animations colors can be edited here, but it fails a lot of times.

Cheers

but that is just the colours, do you know another way instead of adobe after effects to edit?


2024-01-05 16-00-17
Filipe Lourenço

Hi Henrique thank you for your response.

Yes i know that but yes it fails sometimes thats why i was asking

2021-01-04 08-13-48
Toto
 
MVP

Hi, 

Just want to ask, did anyone manage to trigger Complete or LoopComplete ?

I already try simple things (and also the oap that Henrique Batista provided) and the Complete and LoopComplete doesnt trigger.

Thanks

2017-07-05 22-17-18
Henrique Batista
Staff

Hi Filipe,

Sorry for the late reply.

I think Keyshape also reads/edits/exports the lottie animations, but never tried it though.

I've only used the online editor to change some colors on the exiting animations.

Cheers

2018-08-26 20-34-32
Pankaj pant

Just to inform you All.


Now it is possible to edit the colors as well as the background in https://lottiefiles.com website.




Regards,

Pankaj


Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.