🚀 Smooth animations in #Flutter with just PageController ☝️

in Florida doing animation like this is really simple let me show you how in the onboarding content inside the page view we have two components Landing content and sign up from here's how it looks at the moment first let's create a variable called page controller in the initi state we initialize this variable and add a listener create another variable called progress and store the value of pagecontroller.page in this variable next set the page view controller to page controller now the plan is to increase the height of size block according to the progress value let's see the preview Yep this is what we want now let's change the position of the button by following the same process as before great it looks smooth let's wrap the text with an opacity widget and set the opacity to 1 minus progress make a copy of it and change the text and adjust the opacity increasing the width by 32 according to the progress will set the max line to 1 overflow to fade and soft wrap to True source code in the description thanks for watching

Channel: The Flutter Way

Views: 29,643

Keywords: flutter, Android App, iOS app, mobile app, UI speed code, flutter app design, flutter responsive ui

Id: 6e53aoTpc-Y

Length: 1min 0sec (60 seconds)

Published: Sat Aug 05 2023