There are some built-in animations inside the library but you can create your own one if you need a specific one.
This is the base animation that makes the placeholder become clearer on a specified interval:
This applies a tiny overlay from left to right of the placeholder. It's pretty neat but it has the drawback to only work without style customization: only on white background with gray lines.
The shine animation is an attempt to overcome the overlay problem of the ShineOverlay animation by animating only the differnt part of the placeholder. It also has some drawbakcs. Since each component has a different width, the animation is more or less quick dependending on the host size. For this kind of animation to perfectly work, it would be necessary to determine when the left size placeholder has finished animating and only then start to animate the next one.
A simple placeholder animation based on the standard loader (ActivityIndicator) of each platforms.
I'm feel a bit guilty about that but I've stolen the idea from a design system and I can't remember which one. But I like the way it behaves:
It's possible to tweak a specific animation by passing it additional props. However keep in mind that it's important to spread the props from the Animation render function. Else you will be in strange behaviors:
You can build your own animation and pass it to the Animation prop of the Placeholder component.
In fact, what you can build is a Provider of value for animations.
I suggest you take a look at the implementation of the Progressive animation implementation and try to create something that look like this, and then pass it to the Animation prop.