Fix `subtitleTextStyle.color` isn't applied to the `ListTile.subtitle` in Material 2 #133422

burakJs · 2023-08-28T01:35:08Z

The difference between header text style and subtitle text style and the reason why it doesn't work is the code difference below. If we make the subtitle text style the same as the title text style it will work

Title Text Style

All Code

TextStyle titleStyle = titleTextStyle
    ?? tileTheme.titleTextStyle
    ?? defaults.titleTextStyle!;
  final Color? titleColor = effectiveColor;
  titleStyle = titleStyle.copyWith(
    color: titleColor,
    fontSize: _isDenseLayout(theme, tileTheme) ? 13.0 : null,
  );
  final Widget titleText = AnimatedDefaultTextStyle(
    style: titleStyle,
    duration: kThemeChangeDuration,
    child: title ?? const SizedBox(),
  );

Different Code Section

final Color? titleColor = effectiveColor;

Subtitle Text Style

All Code

subtitleStyle = subtitleTextStyle
      ?? tileTheme.subtitleTextStyle
      ?? defaults.subtitleTextStyle!;
    final Color? subtitleColor = effectiveColor
      ?? (theme.useMaterial3 ? null : theme.textTheme.bodySmall!.color);
    subtitleStyle = subtitleStyle.copyWith(
      color: subtitleColor,
      fontSize: _isDenseLayout(theme, tileTheme) ? 12.0 : null,
    );
    subtitleText = AnimatedDefaultTextStyle(
      style: subtitleStyle,
      duration: kThemeChangeDuration,
      child: subtitle!,
    );

Different Code Section

final Color? subtitleColor = effectiveColor
      ?? (theme.useMaterial3 ? null : theme.textTheme.bodySmall!.color);

Description for code

The value theme.textTheme.bodySmall!.color is given because the effectiveColor value is null and the theme.useMaterial3 value is false

Problem solved code

All Code

subtitleStyle = subtitleTextStyle
      ?? tileTheme.subtitleTextStyle
      ?? defaults.subtitleTextStyle!;
    final Color? subtitleColor = effectiveColor;
    subtitleStyle = subtitleStyle.copyWith(
      color: subtitleColor,
      fontSize: _isDenseLayout(theme, tileTheme) ? 12.0 : null,
    );
    subtitleText = AnimatedDefaultTextStyle(
      style: subtitleStyle,
      duration: kThemeChangeDuration,
      child: subtitle!,
    );

Screenshot of the result after making the necessary change

#133412

If you had to change anything in the flutter/tests repo, include a link to the migration guide as per the breaking change policy.

Pre-launch Checklist

I read the Contributor Guide and followed the process outlined there for submitting PRs.
I read the Tree Hygiene wiki page, which explains my responsibilities.
I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
I signed the CLA.
I listed at least one issue that this PR fixes in the description above.
I updated/added relevant documentation (doc comments with ///).
I added new tests to check the change I am making, or this PR is test-exempt.
All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

flutter-dashboard · 2023-08-28T01:35:10Z

It looks like this pull request may not have tests. Please make sure to add tests before merging. If you need an exemption to this rule, contact Hixie on the #hackers channel in Chat (don't just cc him here, he won't see it! He's on Discord!).

If you are not sure if you need tests, consider this rule of thumb: the purpose of a test is to make sure someone doesn't accidentally revert the fix. Ask yourself, is there anything in your PR that you feel it is important we not accidentally revert back to how it was before your fix?

Reviewers: Read the Tree Hygiene page and make sure this patch meets those guidelines before LGTMing.

TahaTesser · 2023-08-28T14:28:03Z

It looks like there are some test failures.

burakJs · 2023-08-28T15:49:34Z

It looks like there are some test failures.

I'm investigating and will let you know as soon as possible.

burakJs · 2023-08-28T20:01:40Z

I think the failed customer_testing results are not a problem with the code change as seen in this issue Customer testing flutter_reactive_ble is failing in CI #133483

TahaTesser · 2023-08-31T08:53:03Z

final Color? subtitleColor = effectiveColor
    ?? (theme.useMaterial3 ? null : theme.textTheme.bodySmall!.color);
So why do we change the color property of the subtitleTextStyle given by the user in this code?

textColor & selectedColor overrides both titleTextStyle & subtitleTextStyle, that's effectiveColor

If both text & selectedColor are null, we default to a null value so the recently added subtitleTextStyle's color can be used only for M3 and we default bodySmall color` for backward compatibility.

bodySmall!.color has been used for the subtitle in M2 as the default color and you're changing this default behavior hence the test issues.

If we still want the subtitleTextStyle color for M2 we can do this without the changing M2 default. Please apply the suggested code below and revert the default test update.

packages/flutter/lib/src/material/list_tile.dart

packages/flutter/test/material/list_tile_test.dart

TahaTesser · 2023-08-31T09:00:13Z

@burakJs
With the updated fix and the default test update revert. This should work without breaking the customer test.

We'll need to test in the list_tile_theme_test.dart to land this. Update existing test if it exists.

burakJs · 2023-08-31T12:21:28Z

I will make changes and corrections as soon as possible. Thanks for the help and detailed explanation.

burakJs · 2023-09-01T00:11:25Z

I made all the changes you mentioned.
All tests in list_tile_theme_test .dart file pass

TahaTesser · 2023-09-01T14:56:27Z

#133422 (comment)

We'll need to test in the list_tile_theme_test.dart to land this. Update existing test if it exists.

Hey @burakJs
Since you're a new contributor. I've improved tests for M3 and added tests for the M2 to land this PR.
I also updated the fix itself to be much more straightforward and pushed changes myself.
I'd advise you to take a look at the changes I've made for future potential PRs.

Thank you for raising this PR.

TahaTesser

LGTM

TahaTesser · 2023-09-01T15:18:02Z

This will need a second review from @HansMuller before we land.

HansMuller

LGTM

…subtitle` in Material 2 (flutter/flutter#133422)

Manual roll Flutter from 685ce14 to aea4552 (64 revisions) Manual roll requested by [email protected] flutter/flutter@685ce14...aea4552 2023-09-07 [email protected] add --exit flag to dev/devicelab/bin/test_runner.dart (flutter/flutter#134165) 2023-09-07 [email protected] fix `--exit` flag in dev/devicelab/bin/run.dart (flutter/flutter#134162) 2023-09-07 [email protected] Roll Packages from e7d812c to 22d4754 (9 revisions) (flutter/flutter#134232) 2023-09-07 [email protected] Roll Flutter Engine from 71bea01d3abe to f0b718e28779 (2 revisions) (flutter/flutter#134231) 2023-09-07 [email protected] DropdownRoutePage should dispose the created ScrollController. (flutter/flutter#133941) 2023-09-07 [email protected] Cover some test/widgets tests with leak tracking (flutter/flutter#133803) 2023-09-07 [email protected] SearchDelegate should dispose resources. (flutter/flutter#133948) 2023-09-07 [email protected] Fixed [NavigationRailDestination]'s label opacity while disabled not being coherent with the icon (flutter/flutter#132345) 2023-09-07 [email protected] Roll Flutter Engine from 558136a1ccbf to 71bea01d3abe (2 revisions) (flutter/flutter#134216) 2023-09-07 [email protected] Roll Flutter Engine from 5a45ecd24aa3 to 558136a1ccbf (1 revision) (flutter/flutter#134206) 2023-09-07 [email protected] Roll Flutter Engine from d864ae68db3c to 5a45ecd24aa3 (1 revision) (flutter/flutter#134201) 2023-09-07 [email protected] Fix `TabBar` doesn't use `labelStyle` & `unselectedLabelStyle` color (flutter/flutter#133989) 2023-09-07 [email protected] Fix `DataTable`'s `headingTextStyle` & `dataTextStyle` are not merged with default text style (flutter/flutter#134138) 2023-09-07 [email protected] Roll Flutter Engine from 187c5b3c5f71 to d864ae68db3c (2 revisions) (flutter/flutter#134199) 2023-09-07 [email protected] Reland "Fix `Chip.shape`'s side is not used when provided in Material 3" (flutter/flutter#133856) 2023-09-07 [email protected] Roll Flutter Engine from 75437a3bd002 to 187c5b3c5f71 (1 revision) (flutter/flutter#134193) 2023-09-07 [email protected] Manual roll Flutter Engine from 2c69d05dfafb to 75437a3bd002 (15 revisions) (flutter/flutter#134188) 2023-09-07 [email protected] Revert "Roll Flutter Engine from 2c69d05dfafb to fa14d337449b (6 revisions)" (flutter/flutter#134183) 2023-09-06 49699333+dependabot[bot]@users.noreply.github.com Bump actions/upload-artifact from 3.1.2 to 3.1.3 (flutter/flutter#134173) 2023-09-06 [email protected] Roll Flutter Engine from 2c69d05dfafb to fa14d337449b (6 revisions) (flutter/flutter#134169) 2023-09-06 [email protected] DraggableScrollableActuator should dispose notifier. (flutter/flutter#133917) 2023-09-06 [email protected] Roll Flutter Engine from b04c2a378302 to 2c69d05dfafb (3 revisions) (flutter/flutter#134164) 2023-09-06 [email protected] Clean the fixed TODOs. (flutter/flutter#133859) 2023-09-06 [email protected] Roll Flutter Engine from 839051596b1d to b04c2a378302 (7 revisions) (flutter/flutter#134158) 2023-09-06 [email protected] [Windows Arm64] Also use Windows 11 for Devicelab tests (flutter/flutter#134082) 2023-09-06 [email protected] Fix `subtitleTextStyle.color` isn't applied to the `ListTile.subtitle` in Material 2 (flutter/flutter#133422) 2023-09-06 [email protected] Add `CheckedPopupMenuItem.onTap` callback (flutter/flutter#134000) 2023-09-06 [email protected] MinimumTextContrastGuideline should dispose image. (flutter/flutter#133861) 2023-09-06 [email protected] [flutter_tools] Fix "FormatException: Invalid date format" during version freshness check (flutter/flutter#134088) 2023-09-06 [email protected] Fix not disposed items in Cupertino app and route. (flutter/flutter#134085) 2023-09-06 [email protected] Roll Flutter Engine from a5e7fa6bf81a to 839051596b1d (2 revisions) (flutter/flutter#134140) 2023-09-06 [email protected] _DropdownMenuState should dispose TextEditingController. (flutter/flutter#133914) 2023-09-06 [email protected] Roll Flutter Engine from 5253a33096d1 to a5e7fa6bf81a (1 revision) (flutter/flutter#134137) 2023-09-06 [email protected] Roll Flutter Engine from c7fd088291e2 to 5253a33096d1 (1 revision) (flutter/flutter#134135) 2023-09-06 [email protected] Roll Flutter Engine from 3d9989f1e155 to c7fd088291e2 (1 revision) (flutter/flutter#134132) 2023-09-06 [email protected] Roll Flutter Engine from bace539bb654 to 3d9989f1e155 (3 revisions) (flutter/flutter#134128) 2023-09-06 [email protected] Roll Flutter Engine from 9344685efbc3 to bace539bb654 (1 revision) (flutter/flutter#134104) 2023-09-06 [email protected] Roll Flutter Engine from 0c8c1647dcd0 to 9344685efbc3 (1 revision) (flutter/flutter#134103) 2023-09-06 [email protected] Roll Flutter Engine from 0c663258fd09 to 0c8c1647dcd0 (1 revision) (flutter/flutter#134100) 2023-09-06 [email protected] Roll Flutter Engine from 8bacc3b38707 to 0c663258fd09 (3 revisions) (flutter/flutter#134096) 2023-09-06 [email protected] Roll Flutter Engine from 590349006d23 to 8bacc3b38707 (5 revisions) (flutter/flutter#134089) 2023-09-06 [email protected] Roll Flutter Engine from 5b2cc9d9b8fe to 590349006d23 (2 revisions) (flutter/flutter#134081) 2023-09-05 [email protected] Roll Flutter Engine from 98b036ae708e to 5b2cc9d9b8fe (2 revisions) (flutter/flutter#134080) 2023-09-05 [email protected] Roll Flutter Engine from f4975e04f35e to 98b036ae708e (3 revisions) (flutter/flutter#134077) ...

…subtitle` in Material 2 (flutter/flutter#133422)

github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Aug 28, 2023

burakJs mentioned this pull request Aug 28, 2023

[M2] ListTile subtitleTextStyle does not change the color of the subtitle #133412

Closed

2 tasks

TahaTesser self-requested a review August 28, 2023 12:35

TahaTesser changed the title ~~Fix SubTitleTextStyle For ListTile~~ Fix subtitleTextStyle.color isn't applied to the ListTile.subtitle in Material 2 Aug 28, 2023

This comment was marked as resolved.

Sign in to view

TahaTesser requested changes Aug 31, 2023

View reviewed changes

packages/flutter/lib/src/material/list_tile.dart Outdated Show resolved Hide resolved

packages/flutter/test/material/list_tile_test.dart Outdated Show resolved Hide resolved

packages/flutter/test/material/list_tile_test.dart Outdated Show resolved Hide resolved

TahaTesser approved these changes Sep 1, 2023

View reviewed changes

TahaTesser requested a review from HansMuller September 1, 2023 15:17

burakJs and others added 5 commits September 6, 2023 16:49

fix: remove default value for titleColor

fc6ac44

fix: color of subtitle text on list_tile_test.dart

4435c1b

fix: fix color of subtitletext when build frame default

5837d7c

fix: fix subtitle text style for material 2 and 3

af71368

Fix subtitleTextStyle.color isn't applied in Material 2

2e481c8

TahaTesser force-pushed the fix/bi/subtitletext-style-bug branch from 93d7730 to 2e481c8 Compare September 6, 2023 13:49

HansMuller approved these changes Sep 6, 2023

View reviewed changes

HansMuller added the autosubmit Merge PR when tree becomes green via auto submit App label Sep 6, 2023

auto-submit bot merged commit cd9a257 into flutter:master Sep 6, 2023

engine-flutter-autoroll mentioned this pull request Sep 6, 2023

Roll Flutter from c175cf87a6a3 to cd9a257d741f (95 revisions) flutter/packages#4861

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Sep 6, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

d3f7099

…subtitle` in Material 2 (flutter/flutter#133422)

engine-flutter-autoroll mentioned this pull request Sep 7, 2023

Roll Flutter from c175cf87a6a3 to bbf5d11aadb4 (111 revisions) flutter/packages#4864

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Sep 7, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

23d0711

…subtitle` in Material 2 (flutter/flutter#133422)

engine-flutter-autoroll mentioned this pull request Sep 7, 2023

Roll Flutter from c175cf87a6a3 to 6ddb3b04b4fe (112 revisions) flutter/packages#4865

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Sep 7, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

1de9147

…subtitle` in Material 2 (flutter/flutter#133422)

engine-flutter-autoroll mentioned this pull request Sep 7, 2023

Roll Flutter from c175cf87a6a3 to 2867b31f5ed4 (113 revisions) flutter/packages#4867

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Sep 7, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

154fe1a

…subtitle` in Material 2 (flutter/flutter#133422)

engine-flutter-autoroll mentioned this pull request Sep 7, 2023

Roll Flutter from c175cf87a6a3 to aca91df6b784 (115 revisions) flutter/packages#4868

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Sep 7, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

54ce844

…subtitle` in Material 2 (flutter/flutter#133422)

engine-flutter-autoroll mentioned this pull request Sep 7, 2023

Roll Flutter from c175cf87a6a3 to ea351694fe5b (118 revisions) flutter/packages#4869

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Sep 7, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

ed349ce

…subtitle` in Material 2 (flutter/flutter#133422)

engine-flutter-autoroll mentioned this pull request Sep 7, 2023

Manual roll Flutter from 685ce14b2d0f to aea4552acdc7 (64 revisions) flutter/packages#4870

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Sep 7, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

351c0bb

…subtitle` in Material 2 (flutter/flutter#133422)

HansMuller mentioned this pull request Sep 8, 2023

Flutter Framework Team: Notable Commits #121415

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Nov 15, 2023

cd9a257 Fix subtitleTextStyle.color isn't applied to the `ListTile.…

ea6ff8a

…subtitle` in Material 2 (flutter/flutter#133422)

Fix subtitleTextStyle.color isn't applied to the ListTile.subtitle in Material 2 #133422

Fix subtitleTextStyle.color isn't applied to the ListTile.subtitle in Material 2 #133422

Uh oh!

Conversation

burakJs commented Aug 28, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

All Code

Different Code Section

All Code

Different Code Section

Description for code

All Code

Pre-launch Checklist

Uh oh!

flutter-dashboard bot commented Aug 28, 2023

Uh oh!

TahaTesser commented Aug 28, 2023

Uh oh!

burakJs commented Aug 28, 2023

Uh oh!

burakJs commented Aug 28, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

This comment was marked as resolved.

This comment was marked as resolved.

TahaTesser commented Aug 31, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

TahaTesser commented Aug 31, 2023

Uh oh!

burakJs commented Aug 31, 2023

Uh oh!

burakJs commented Sep 1, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

TahaTesser commented Sep 1, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

TahaTesser left a comment

Choose a reason for hiding this comment

Uh oh!

TahaTesser commented Sep 1, 2023

Uh oh!

HansMuller left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Fix `subtitleTextStyle.color` isn't applied to the `ListTile.subtitle` in Material 2 #133422

Fix `subtitleTextStyle.color` isn't applied to the `ListTile.subtitle` in Material 2 #133422

burakJs commented Aug 28, 2023 •

edited

Loading

burakJs commented Aug 28, 2023 •

edited

Loading

TahaTesser commented Aug 31, 2023 •

edited

Loading

burakJs commented Sep 1, 2023 •

edited

Loading

TahaTesser commented Sep 1, 2023 •

edited

Loading