Skip to content

[CP] FlexibleSpace background rebuild #128257

@Piinks

Description

@Piinks

issue_link

#127836

Commit Hash

N/A, did not use git cp command. See PR.

Target

stable

pr_link

#128288

Changelog Description

A change in the Opacity widget caused a regression in FlexibleSpaceBar where it was not rebuilding as expected. This fixes that regression.

Impacted Users

Users of the FlexibleSpaceBar widget.

Impact Description

This issue created an unusable UI experience for some users based on what widgets they were placing in the flexible space bar. Shown below:

Before the regression:
image

The issue:
image

Workaround

None

Risk

low

Test Coverage

yes

Validation Steps

Running this sample code should not result in the unsightly content overlap above:

import 'package:flutter/material.dart';

enum SampleItem { itemOne, itemTwo, itemThree }

void main() => runApp(const MyApp());

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        useMaterial3: true,
        scrollbarTheme: const ScrollbarThemeData(
          thumbColor: MaterialStatePropertyAll<Color?>(Colors.red),
        ),
        textButtonTheme: TextButtonThemeData(
          style: ButtonStyle(
            textStyle: MaterialStatePropertyAll<TextStyle?>(
                TextStyle(color: Colors.white)),
            backgroundColor: MaterialStatePropertyAll<Color?>(Colors.red),
          ),
        ),
      ),
      home: const SubCategoryScreenView(addtionallTag: "sdfsdf"),
    );
  }
}

class SubCategoryScreenView extends StatefulWidget {
  final String addtionallTag;
  const SubCategoryScreenView({
    Key? key,
    required this.addtionallTag,
  }) : super(key: key);

  @override
  _SubCategoryScreenViewState createState() => _SubCategoryScreenViewState();
}

class _SubCategoryScreenViewState extends State<SubCategoryScreenView>
    with TickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text("Test"),
      ),
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            pinned: false,
            snap: false,
            leading: const SizedBox(),
            floating: false,
            expandedHeight: MediaQuery.of(context).size.width / 1.7,
            collapsedHeight: 0,
            toolbarHeight: 0,
            titleSpacing: 0,
            leadingWidth: 0,
            flexibleSpace: FlexibleSpaceBar(
              // title: Text(widget.category.localedName),
              background: AspectRatio(
                aspectRatio: 1.7,
                child: Hero(
                  tag: "${widget.addtionallTag}",
                  child: Image.network(
                    "https://picsum.photos/1200/1300",
                    fit: BoxFit.contain,
                  ),
                ),
              ),
            ),
          ),
           
          const SliverToBoxAdapter(child: SizedBox(height: 12)),
          SliverToBoxAdapter(
              child: GridView.builder(
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3,
                  ),
                  shrinkWrap: true,
                  physics: const NeverScrollableScrollPhysics(),
                  itemCount: 300,
                  itemBuilder: (BuildContext context, int index) {
                    return Card(
                      color: Colors.amber,
                      child: Center(child: Text('$index')),
                    );
                  })),
          const SliverToBoxAdapter(child: SizedBox(height: 12)),
        ],
      ),
    );
  }
}

Metadata

Metadata

Assignees

Labels

cp: approvedApproved cherry-pick requestcp: merge-to-stableCherry-picks that should be merged to stablecp: reviewCherry-picks in the review queue

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions