Android App Development
iOS App Development
Flutter App Development
Cross Platform App Development
Hire on-demand project developers and turn your idea into working reality.
Big thanks to Webkul and his team for helping get Opencart 184.108.40.206 release ready!
Updated 26 May 2023
In this blog, we are going to learn about how to create a sliver app bar in a flutter. So let’s get started.
A Material Design sliver app bar, that integrates with a CustomScrollView.
SliverAppBar is a Material Design widget in flutter which gives scrollable or collapsible app-bar. The word Sliver is given to scrollable areas here.
The Sliver app bar consists of a Tabbar and a FlexibleSpaceBar.
The word Sliver is given to scrollable areas here.
You may also check our Flutter app development company.
1.) Create a Scaffold.
2.) Display the sliver app bar.
3.) Provide an optional action.
Inside Scaffold widgets, it Implements the basic material design visual layout structure.
This class provides APIs for showing drawers and bottom sheets. We can add the background color inside the scaffold widget.
It also supports special Material Design components, such as Drawers, AppBars, and SnackBars.
We have the main function which calls the MyApp class through the runApp method.
Then by using the Widget build(BuildContext context), started describing the UI of the app.
We have provided the example below.
First, create an CustomScrollView, for making the sliver app bar, then display it using ScaffoldMessenger.
We have slivers property that takes a list of widgets and makes them scrollable.
The first three properties snap is false, pinned is true and floating is false.
Now, we need to provide an action to the user when the Sliver app bar is displayed.
The full code is mentioned below.
Your email address will not be published. Required fields are marked*
Save my name email and website in this browser for the next time I comment.
Be the first to comment.
Enquiry or Requirement
If you have more details or questions, you can reply to the received confirmation email.