Flutter Animation Liquid Swipe Animation

11 December, 2022

4

4

1

Liquid Swipe animation is used for making a good animation screen in starting of the app it make swipe animation with flow like liquid and you can add your text and image in it.
Follow the below steps to implement the Liquid Swipe Animation:
Step 1: Create a App using the command:

Note: You can give any name to your app.

Step 2: Create a file in main.dart and liquidswipe.dart to write code.
Step 3: Import the liquid_swipe dependency into the main.dart file using the below code:
Step 4: Add the dependency to your pubspec.yaml file as shown below:
img
 Add dependencies:
Get the package from Pub:
Step 5: In the LiquidSwipeAnimation() method we need to add pages, fullTransitionValue, waveType, positionSlideIcon, enableSlideIcon which are the attributes of the LiquidSwipeAnimation() method as shown below:
Animation
In the main.dart file we have a main() function which calls runApp() by taking any widget as an argument to create the layout. We have the home as MyliquidSwipeAnimation() which is a stateful class(Mutable class) as shown below:

Step 6: We will add images in the assets folder. All the images you need on-screen you can add there. Activate assets in pubspec .yaml file as shown below:
Complete Source Code:
Done, It will run perfectly
Thank you!
#develevate

design

animation

flutter

ui

develevate

4

4

1

design

animation

flutter

ui

develevate

Vilsi Jain
Tech developer

More Articles

Showwcase is a professional tech network with over 0 users from over 150 countries. We assist tech professionals in showcasing their unique skills through dedicated profiles and connect them with top global companies for career opportunities.

© Copyright 2025. Showcase Creators Inc. All rights reserved.