Stack Overflow
Stack Overflow

Questions tagged [sliverappbar]

In Flutter, the SliverAppBar widget is a specialized app bar that can be used within a CustomScrollView to create scrollable headers and navigation bars. It's specifically designed to work with slivers, which are portions of scrollable areas in Flutter.

SliverAppBar

119 questions
3
votes
2 answers

Adding DraggableScrollableSheet to the bottom of a Sliver page

I’m working on the concept that you can see on the screenshot below: design concept Note: the arrows are not the part of the UI, but were added to demonstrate the draggable functionality. The screen has a SliverAppBar that displays location title,…
Daria Kalashnikova
  • 41
  • 5
3
votes
2 answers

Overlap SliverList children in Flutter

Based on this design: I am trying to use SliverList with SliverAppBar but I can't seem to overlap the items so when the top left and top right radius are applied the color of the previous item is present. It's similar to this other post: How to…
tevvek
  • 516
  • 5
  • 13
3
votes
1 answer

Flutter SliverAppbar in NestedScrollView header does not stretch and zoom like it would stretch in CustomScrollView

The SliverAppbar will stretch and zoom if it is in a customScrollView but it does not when it is in NestedScrollView. Only the body of NestedScrollView has a BouncingScrollPhysics, how can the header of NestedScrollView also have the…
Hasan Ahmed
  • 109
  • 2
  • 5
2
votes
0 answers

How to make a profile pic animation like WhatsApp?

I want to make a profile picture animation-like in WhatsApp. In particular, while the user scrolls upwards, I need the profle picture to move up and shrink into the app bar. In flutter, I'm expecting a titoe of that WhatsApp profile.
Dhinesh
  • 21
  • 1
2
votes
0 answers

Flutter NestedScrollView and SliverAppBar within AutoTabsRouter and nested Scaffolds as children is not working?

Here is my code. The Appbar stays static when I scroll down. If you need more of the code, let me know. I'm using auto_route flutter and the routes InvestHomeRouter() and BonusHomeRouter() lead to other scaffolds that have no own appbar and have…
Caspar Bm
  • 258
  • 4
  • 12
2
votes
0 answers

How to custom search bar on SliverAppBar flutter

I am new with flutter. I would like to custom a search widget on SliverAppBar. On scroll up, I would like it show this search widget with a flexible to nearly cart button as show in pictures. Code final expandedHeight = 150.0; @override …
Wzo
  • 111
  • 7
2
votes
1 answer

In Flutter, How to make SliverAppBar respect the top safe area on Floating State when it is not primary

I have a SliverAppBar looks like this is normal state which is what I want: but when scrolling down the app bar doesn't respect the top safe area on its floating state: here is my build method code return Scaffold( body:…
New Dev
  • 318
  • 4
  • 10
2
votes
1 answer

Shrink SliverAppBar Image animation Like Title Text in Flutter

I am trying to replicate the text shrink effect that comes naturally with a SliverAppBar with an image such that the background image of the sliverhead shrinks to a leading icon in the appbar of the sliverAppBar. I have tried using the…
Flourish
  • 119
  • 1
  • 16
2
votes
1 answer

SliverAppBar flexibleSpace shouldn't show in scroll back up

I'm using flexibleSpace in SliverAppBar with floating: true, pinned: false, snap: true: When I scroll back up. It shows AppBar and flexibleSpace space https://flutter.github.io/assets-for-api-docs/assets/material/app_bar_floating_snap.mp4. But that…
Mr. ZeroOne
  • 904
  • 6
  • 20
2
votes
1 answer

CustomScrollWidget, SliverList, SliverChildBuilderDelegate constantly rebuilds and degrades performance. Flutter

I was thinking of implementing SliverAppBar and a Scrollable items under it, so I have this code right now: CustomScrollView( semanticChildCount: categoryItems.length, physics: BouncingScrollPhysics(), slivers: [ …
whiteWolfie
  • 52
  • 4
2
votes
1 answer

FlexibleSpaceBar background image maintains some opacity when collapsed

I am using SliverAppBar in my project. I have set a background color and a background image in the "flexible space" parameter. However when the appbar collapses, the image does not fully fade out to become the "backgroundColor" I selected, but the…
James__pxlwk
  • 71
  • 1
  • 7
2
votes
3 answers

Status bar turns transparent while scrolling SliverAppBar in flutter

I am using SliverAppBar to scroll the appbar when content scrolls in my flutter app but as soon as I scroll the list statusbar color turns transparent. I want statusbar in its place and with the default primary color which is blue in my…
Sumit Shukla
  • 4,116
  • 5
  • 38
  • 57
2
votes
1 answer

Mouse scroll not work on SliverAppbar() or SliverAppbar() floating not working Flutter Web

When i use SliverAppBar() in a CustomScrollView() then the SliverAppBar() floating:true is not working by the mouse scroll CustomScrollView( slivers: [ SliverAppBar( floating:true, expandedHeight: 150.0, flexibleSpace: const…
Al Mamun
  • 81
  • 4
2
votes
1 answer

Is there a way to programmatically expand the sliver app bar?

I have used sliver app bar for get expanded and collapsible app bar view, i want to know is there any way that can expand the sliver app bar when user touch on collapse app bar..
s.am.i
  • 648
  • 5
  • 16
2
votes
1 answer

SliverAppBar without fading in the AppBar

I really love using Slivers, but really have a Problem with SliverAppBar: usually, I use the SliverAppBar Widget for creating a AppBar that has a Background Image with the Parallax effect. So all I use is the flexible space, which unfortunately gets…
astrorain
  • 51
  • 1
  • 6
1
2
3 4 5 6 7 8