Flutter animated add button

user_16734806 0
Viewed 70

I am currently learning flutter and trying out different things. Not too long ago I discovered the app "Reflectly". I wonder how it is possible to create such an "add button" with animation.

Reflectly add button

Two possibilities for implementation have crossed my mind.

  1. With the help of a stack widget and 4 shapes, 2 for the BottomBar and 2 for the button. The button would have an animation and enlarge and also move. However, this sounds a bit complicated for such a button.

  2. The whole thing is a drop menu, but I don't know how to get such a shape with matching animation. Especially, these two things don't make it easy for me to imagine how to implement such a button.

Does anyone have an idea?

flutter-animation dart flutter
1 Answers

You can achieve this by the following

Create 2 different paths. 1 is for the center button and the second one is the custom shape that you wish to see as the output when the button is clicked. Then use an animated builder and change shape when clicked

user_171690370
Related