Flutter SliverAppBar Widget

sliver app bar widget if you want to create a nap bar just like this one I will show you how to use the sliver app bar widget we will start by using the custom scroll view widget inside you can put the sliver argument this is a list of sliver so you will use first the sliver app bar widget if you set the argument pin as true that's mean that when you scroll you will see a nav bar on the top if you put this as false this will disappear when you scroll the floating is set as true just means that as soon as you start scrolling you will see the up bar is coming back you don't have to wait until you are on the top of the list the expanded height is the height of the image then you can create a flexible space bar inside we will use the title flutter map and the background will be an image asset with the boxfit dot cover but now we still need to have a scrollable widget otherwise it doesn't work so we will create another sliver this one will be a sliver list with this you can actually see the sliver at bar in action just so you see the difference I will put the pinned as false and I will put the floating as false also now you can see that if I scroll the app bar will completely disappear and it will reappear only when I reach the top of the list

Channel: Flutter Mapp

Views: 17,955

Keywords: Flutter, SliverAppBar, flutter sliverappbar, sliverappbar flutter, flutter every widgets, flutter mapp

Id: G6qJkjt08k0

Length: 1min 10sec (70 seconds)

Published: Wed Mar 15 2023