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.
Questions tagged [sliverappbar]
119 questions
0
votes
0 answers
Custom Sliverappbar is not working in flutter
In this screen, I have implemented sliver appbar.
On swipe up Pizza hut text will be set on toolbar. and 'Sec 16, Dwarka, New Delhi' to 'Now open' text layout will be hide. and the offers tabbar will be set below the toolbar.
I tried to set tabbar…
wolfsoft Developer
- 168
- 9
0
votes
1 answer
Flutter Sliver Appbar not showing Icons
I have implemented a SliverAppBar in my Flutter app, but I'm having trouble getting the back button to show up on the left side of the app bar. I've set the leading property of the SliverAppBar to a BackButton, but the button doesn't appear.
the…
FadyFouad
- 815
- 6
- 12
0
votes
0 answers
How do I resolve overflow issue while doing animation on SliverPersistentHeader?
I'm trying to create a dynamic animation described in the mockup above. What I need is:
A round shape that will represent an avatar (user pic, for example);
A text centered below it.
Below those (that use half of the screen) is a scrollable…
Pramanshu
- 71
- 6
0
votes
0 answers
Why the state of my items in SliverPersistentDelegate's NestedScrollView doesn't change
I am setting up an animated profile page with NestedScrollView and slivers. But when I tap on the button to follow a store, it doesn't change until I scroll and I don't understand.
Here is the profile page :
Scaffold(
backgroundColor:…
Rassuul
- 3
- 3
0
votes
0 answers
Flutter - Sliver App Bar (Use Buttons instead of Tabs)
We are using Sliver App bar for our app. The difference in our app is we have multiple buttons instead of tabs (as shown in "Final Result" in the article…
user3600064
- 61
- 1
- 3
0
votes
0 answers
How do i evenly position widgets or items in SliverAppBar Flutter?
I have a SliverAppBar and i am trying to position three items in a row:
User Profile Picture
User Account Information
Notification bar widget
But whenever i try to add the User Account Information Widget in the row i either get a render flex error…
tesseract
- 144
- 1
- 12
0
votes
1 answer
SliverPersistentHeaderDelegate should collapse before the Remaining widgets scroll under it
I am trying to make SliverPersistentHeaderDelegate to collapse first and then the rest of the screen to scroll.
Here is the code.
class MyHomePage extends StatelessWidget {
const MyHomePage({
super.key,
});
@override
Widget…
felixrzayev
- 9
- 1
0
votes
0 answers
flutter sliverappbar with widget overlaping on top
I'm trying to create a screen like this one.
Has anyone ever succeeded in creating something like that?
I'm using a sliverappbar, and i tried with a transform widget with negative value (i'm new to flutter comming from the web :') ) it make the…
Lawlaw
- 1
0
votes
1 answer
flutter - Hide sliverappbar when scrolling starts
I want to hide the app bar and the widget at the bottom right away as soon as the screen scrolls. Also, I want to show what I hid as soon as I scroll to the top.
Also, because I have to put a widget under the Appbar, the widget is located in the…
CHOI YOOBIN
- 166
- 2
- 8
0
votes
0 answers
Flutter floating SliverAppBar expanded height includes the flexible space height
I want to achieve the same collapsing AppBar (toolbar) from my native Android app in my new Flutter app.
The native AppBar is fairly traditional, when reproducing it it should
use the collapsing toolbar (title shrink and fade animation)
have an…
martinseal1987
- 1,862
- 8
- 44
- 77
0
votes
0 answers
how can i make one Slivers AppBar With diffrent behavior and desgin , like WhatsApp desgin?
i started my project to make WhatsApp clone to learn
now i have chalange to my AppBar ( animated , scrollbe , design )
i have used
DefaultTabController
with : Scaffold
with : NestedScrollView
with : SliversAppBar
with : TapBar
and TapBar
and in body…
Nady Nasser
- 1
- 2
0
votes
0 answers
How to place one silverappbar over another?
I want my silverapp bar in this format:
my code is as follows:
body: CustomScrollView(slivers: [
SliverAppBar(
backgroundColor: Colors.black,
expandedHeight: 200,
flexibleSpace: FlexibleSpaceBar(
background:…
Sindu
- 131
- 1
- 10
0
votes
0 answers
Changing the design of a widget after scrolling in sliver app bar
I want to design this ui bellow in flutter the problem is the categories list as you can see it changes on scroll the items design change from vertical to horizontal, here my code down bellow, I m wondering how can I do that on flutter
Click here to…
Abdelilah09
- 1
- 1
0
votes
0 answers
How to place a Column in a title of FlexibleSpaceBar in SliverAppbar
I am working with SliverAppBar, where I used an image in flexibleSpace: FlexibleSpaceBar to fade it during scrolling. I also used a title of FlexibleSpaceBar, which is placed under the image, so when I am scrolling down, an image disappears and…
RobEleven
- 29
- 3
0
votes
0 answers
How customize flexibleSpace property in SliverAppbar in flutter?
I'm trying to create SliverAppBar() like this :
And the result of my trying looks like this :
Here is my code :
Scaffold(
backgroundColor: AppColor.backgroundColor,
body: CustomScrollView(
slivers: [
SliverAppBar(
…
arash shakibaee
- 47
- 6