I currently have a Widget that has three elements -- two buttons and a text input. On text input focus I would like to slide the buttons off the screen and expand the text input to occupy the remaining width.
Are there any flutter components (animation or otherwise) I can use to slide components off screen and animate the text field expansion?
I ended up using an Animatable widget
https://flutter.io/docs/development/ui/animations/tutorial#simplifying-with-animatedwidget
And using a combination of a Stack() where I would animate offscreen elements to have negative offsets (via Positioned() children) based on the Animation and a TextField inside an Expanded()
edit
I don't have access to the computer with the source code anymore, but you should be able to infer how to construct such a widget from the Flutter example gallery https://github.com/flutter/flutter/blob/master/examples/flutter_gallery/lib/demo/material/drawer_demo.dart (this is how I was able to learn - specifically, look at the drawerdetails animation). I positioned the textfield and buttons in the same stack and animated the textfield size as well as the button position simultaneously
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With