ANIMATED CONTAINER IN FLUTTER

Save

In this blog we will explore about animated container in flutter.Animated version of container that gradually changes its values over a period of time.

As we all know that ,it is very important make our application more interactive, so that people will take more interest in our application.

The animated container will automatically animate between the old and new values of properties when they change using the provided curve and duration.

so it will going to be very interesting.We will implement it using a example.In this example we will have a container with dynamic height.

Example:-

Imagine you have to build an application with bar graphs.so there can be a container with increasing or decreasing height depending on the graph values.

Let’s imagine the initial height of the container is 40.0 and container will be like as shown below.

And now suppose you have a Button and in the onPressed method, you can change the height of the Container and setState to rebuild the UI.

But sadly,We have this following output.there is no smooth transition when we change the height values.So this looks wierd for a bar chart application.

Don’t worry we will make it smooth and also interactive.We need to replace our widget only.

Now replace your ordinary container with AnimatedContainer widget and provide a Duration property and then see the magic happen!.

One widget replacement and one extra line of code and voila! you are animating a container now.

Isn’t it amazing?.It seems very beautiful.And Also using this we can show some animations to our flutter application.

AnimatedContainer is very useful widget.

Congratulations!!!! you have learned how to implement Animated Container in Flutter.

For more interesting blogs check out here – https://mobikul.com/blog/

Hope this blog helped you with a better understanding of the implementation of Animated Container in Flutter.

Thanks for reading.😇

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

css.php

Webkul is a truly trusted and supported IT Company to develop business ideas for e-commerce. They provide professional support after deploying the solution to production and be responsible to act for fixing the reported issues or system errors. We highly encourage to deal with Webkul for business development.

Hussein Zawia

Hussein Zawia

Co-founder, 24Dokan

Talk to Sales

Global

Live Chat
Start a Project


    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home