Hassane Sanogo
Hassane Sanogo

Reputation: 11

Flutter Material3 disable appbar color change on scroll (on TabBar)

I just upgraded my flutter version to 3.19. and set userMaterial3 to true. Now, when user scroll, TabBar color change taking primaryColor of the APP (red) with opacity. I wanna know how can I disable that in the App.

Thanks,

I try to avoid this color change when scrolling and I need help to handle this.

Upvotes: 0

Views: 891

Answers (3)

Cương Nguyễn
Cương Nguyễn

Reputation: 1055

AppBar(
   scrolledUnderElevation: 0.0,
   backgroundColor: Colors.transparent,
)

or

forceMaterialTransparency: true,

These worked for me.

Note: both will make the appbar jerky for page transitions. And i have not found the perfect solution yet.

Upvotes: 1

acattani123
acattani123

Reputation: 39

Try to put:

shadowColor: Theme.of(context).colorScheme.surface,
backgroundColor: Theme.of(context).colorScheme.surface,

or whatever color you want. This should disable color change when scrolling

Upvotes: 0

A-E
A-E

Reputation: 3327

Try to set scrolledUnderElevation to 0 in the AppBar.

scrolledUnderElevation: defines The elevation that will be used if this app bar has something scrolled underneath it.

That's if your TabBar is placed in the bottom of the AppBar. if not then try to provide some code.

Upvotes: 2

Related Questions