Create Liquid Swipe Effect In Your React Project With LiquidSwipe Component


Category: React React Animation | July 18, 2021
Author:ashutosh1919
Official Page:Go to website
Last Update:July 17, 2021
License:MIT

react liquid swipe effect

Description:

Are you looking to create Swipe animation in your application? If yes then, you can use LiquidSwipe library to create liquid swipe effect in your React project. Lets see how.

How to use it?

1. Download the library using ‘Download’ button above and include in your component directory.

2. Then, import the component in your file. Like this.

import { LiquidSwipe } from '<relative-path-of-liquidswipe.js>';

3. Here is the code that will create the liquid effect.

export const YourComponent = () => {
    var componentsToRender = [] // Add components you want to render.
    var backgroundColors = [] // Add background colors for each component.
    ...
    return (
        ...
        <LiquidSwipe
            components={componentsToRender}
            colors={backgroundColors}
        />
        ...
    );
}