Lottie Animations (Native)

Content Type: Widget
Categories: User Interface


Only works with a Custom Mendix Make it Native App

Lottie Implementation for Mendix Native 


Lottie Native Widget for Mendix

Only works with a Custom Mendix Make it Native App

Read more about that here 



Setup of In Mendix

 PropertyDetailsAnimation JSONString version of your JSON animation. You can use this app to just drop your animation .json and get the correct string backHeightHeight of Animation (Use full for Device Height)WidthWidth of Animation (Use full for Device Width)Use as BackgroundTrue if animations is set as background and other properties is places "over" itControl TypeUncontrolled (Sequential): You define the frames to play, the animation will sequentially follow the animation path you define.

Controlled: You control the Frames by changing parameters on the fly

 PropertyDetailsStart FrameFrame to start section atEnd FrameFrame to End section atLoopShould that section Loop
Note: If this is set to true, that section will play forever and the next section will not be reached. Only use this on the last sectionWhen DoneAction to call when that section is done

Note: This has to be used in a data view with a corresponding Data Model

 PropertyDetailsStart Frame expressionFrame to start section atEnd Frame expressionFrame to End section atLoop expressionWhen set to false the animation will not loop
Note: This will set the Play/Pause attribute to falsePlay/Pause attributeAn attribute that will play or pause the animation, this wont immediately pause the animation, but it will finish its current section, and pause once it reaches its End Frame

JSON to String

You can use this app we built to help convert a json file to a string that Mendix can use, below is a gif demo of the app and a link to the site


Extra Info

Lottie Docs


Version: 1.0.0
Framework Version: 9.12.4
Release Notes: Init Release