flutter / flutter/flutter

AppBar tint remains applied when using IndexedStack

Open
#139,393 9 comments 0 reactions 0 assignees View on GitHub
f: scrolling found in release: 3.16 found in release: 3.18 has reproducible steps p: material_ui P2 package team-design triaged-design
Dominant language
Dart
Stars
179k
Forks
31.1k
PR merge metrics
PR metrics pending

Description

### Is there an existing issue for this?

- [X] I have searched the [existing issues](https://github.com/flutter/flutter/issues)
- [X] I have read the [guide to filing a bug](https://flutter.dev/docs/resources/bug-reports)

### Steps to reproduce

1. Create an `IndexedStack` where at least 1 page is scrollable.
2. Scroll that page so the app bar has tint applied.
3. Go to another index on the `IndexedStack`

### Expected results

The app bar should have its tint cleared, because there is no scrolled container in the view.

### Actual results

The app bar remains with tint, even the new content is not scrollable or it is not scrolled.

When a second scrollable content is scrolled then it is scrolled back to the begin, then the tint disappears.

Widgets that changes the current viewport, such as tabs, indexed stacks, pageview, etc. should notify the appbar to reapply its tint, if necessary.

### Code sample

Code sample

```dart
import 'package:flutter/material.dart';

void main() {
runApp(const MyApp());
}

class MyApp extends StatefulWidget {
const MyApp({super.key});

@override
State createState() => _MyAppState();
}

class _MyAppState extends State {
int selectedIndex = 0;

@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
useMaterial3: true,
),
home: Scaffold(
appBar: AppBar(
title: Text("Some title"),
),
body: IndexedStack(
index: selectedIndex,
children: [
SingleChildScrollView(
padding: EdgeInsets.all(16),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Text("Scroll me to the bottom, then press the button"),
Placeholder(fallbackHeight: 1500),
TextButton(
onPressed: () => setState(() => selectedIndex = 1),
child: Text("Press me"),
),
],
),
),
Center(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Text("I'm not scrollable"),
TextButton(
onPressed: () => setState(() => selectedIndex = 2),
child: Text("Go to some scrollable content"),
),
TextButton(
onPressed: () => setState(() => selectedIndex = 2),
child: Text("Go back to the first page"),
),
],
),
),
SingleChildScrollView(
padding: EdgeInsets.all(16),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Text("I am scrollable"),
Placeholder(fallbackHeight: 1500),
TextButton(
onPressed: () => setState(() => selectedIndex = 0),
child: Text("Home"),
),
],
),
),
],
),
),
);
}
}

```

### Screenshots or Video

Screenshots / Video demonstration

https://github.com/flutter/flutter/assets/379339/6592c229-824a-473b-b716-ee8517e3f9e2

### Logs

_No response_

### Flutter Doctor output

Doctor output

```console
╰─ flutter doctor Doctor summary (to see all details, run flutter doctor -v):
[!] Flutter (Channel stable, 3.16.2, on Microsoft Windows [Version 10.0.22631.2715], locale pt-BR)
! Warning: `flutter` on your path resolves to C:\Users\jckod\fvm\versions\3.16.2\bin\flutter, which is not inside your current Flutter SDK checkout at C:\Users\jckod\fvm\default. Consider adding
C:\Users\jckod\fvm\default\bin to the front of your path.
! Warning: `dart` on your path resolves to C:\Users\jckod\fvm\versions\3.16.2\bin\dart, which is not inside your current Flutter SDK checkout at C:\Users\jckod\fvm\default. Consider adding
C:\Users\jckod\fvm\default\bin to the front of your path.
[✓] Windows Version (Installed version of Windows is version 10 or higher)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[✓] Chrome - develop for the web
[✓] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.8.1)
[✓] Android Studio (version 2022.3)
[✓] VS Code (version 1.84.2)
[✓] Connected device (4 available)
[✓] Network resources

! Doctor found issues in 1 category.
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.