Skip to content

Conversation

TahaTesser
Copy link
Member

@TahaTesser TahaTesser commented Apr 18, 2023

fixes #114340

code sample
import 'package:flutter/material.dart';

/// Flutter code sample for [SliverAppBar.medium].

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        useMaterial3: true,
      ),
      home: MediaQuery(
        data: MediaQuery.of(context).copyWith(textScaleFactor: 3.0),
        child: Material(
          child: CustomScrollView(
            slivers: <Widget>[
              SliverAppBar.medium(
                leading:
                    IconButton(icon: const Icon(Icons.menu), onPressed: () {}),
                title: const Text('Medium App Bar'),
                actions: <Widget>[
                  IconButton(icon: const Icon(Icons.more_vert), onPressed: () {}),
                ],
              ),
              // SliverAppBar.large(
              //   leading:
              //       IconButton(icon: const Icon(Icons.menu), onPressed: () {}),
              //   title: const Text('Large App Bar'),
              //   actions: <Widget>[
              //     IconButton(
              //         icon: const Icon(Icons.more_vert), onPressed: () {}),
              //   ],
              // ),
              // Just some content big enough to have something to scroll.
              SliverToBoxAdapter(
                child: Card(
                  child: SizedBox(
                    height: 1200,
                    child: Padding(
                      padding: const EdgeInsets.fromLTRB(8, 100, 8, 100),
                      child: Text(
                        'Here be scrolling content...',
                        style: Theme.of(context).textTheme.headlineSmall,
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Before

Medium App Bar - textScaleFactor: 3.0 Large App Bar - textScaleFactor.30

After

Medium App Bar - textScaleFactor: 3.0 Large App Bar - textScaleFactor.30

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.

@TahaTesser TahaTesser requested a review from Piinks April 18, 2023 14:55
@flutter-dashboard flutter-dashboard bot added f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels. labels Apr 18, 2023
Copy link
Contributor

@Piinks Piinks left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting! I did not know _kMaxTitleTextScaleFactor existed.
Is this in the spec? I see there is a TODO comment about documenting this that refers to #58769

Can you add some mention of this text scale limit to the AppBar docs?

@TahaTesser
Copy link
Member Author

TahaTesser commented Apr 18, 2023

Is this in the spec? I see there is a TODO comment about documenting this that refers to #58769

It's not but the scale factor is relatively the same regular app bar when compared with the native.

(which also updates the position of the title so it doesn't cut off, which took me quite a while to figure out by testing native a lot)

Can you add some mention of this text scale limit to the AppBar docs?

Sure. :)

@TahaTesser TahaTesser force-pushed the app_bar_medium_large_text_scale branch from 85b5a81 to cd32f3e Compare April 18, 2023 20:24
@TahaTesser
Copy link
Member Author

@Piinks
I need to make a similar PR for NavigationRail.
I noticed the same lack of information there. The accessibility pages have no information about the text scale e.g https://m3.material.io/components/top-app-bar/accessibility.
I've to rely on existing scaling values in Flutter or test the native side myself to compare.

@TahaTesser TahaTesser requested a review from Piinks April 18, 2023 20:28
@Piinks Piinks force-pushed the app_bar_medium_large_text_scale branch from 8186009 to 5931018 Compare April 19, 2023 22:27
@TahaTesser TahaTesser force-pushed the app_bar_medium_large_text_scale branch from d606413 to 3b23d1a Compare April 21, 2023 07:12
Copy link
Contributor

@Piinks Piinks left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

Comment on lines 4720 to 4721
// A bug in the HTML renderer and/or Chrome 96+ causes a
// discrepancy in the paragraph height.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is a strange indentation here

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh I see, It looks like the comment is aligned withe the end of the todo colon. Not necessary, but I don't see why not. :)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I copied this comment from another class. It looks strange for sure. Fixed.

@Piinks Piinks added the autosubmit Merge PR when tree becomes green via auto submit App label Apr 24, 2023
@TahaTesser TahaTesser force-pushed the app_bar_medium_large_text_scale branch from d9a0d51 to c3706c0 Compare April 25, 2023 07:45
@auto-submit auto-submit bot merged commit 6e1d4f9 into flutter:master Apr 25, 2023
@TahaTesser TahaTesser deleted the app_bar_medium_large_text_scale branch April 25, 2023 08:28
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Apr 25, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Apr 25, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Apr 25, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Apr 26, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Apr 26, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Apr 26, 2023
stuartmorgan-g pushed a commit to flutter/packages that referenced this pull request Apr 28, 2023
Roll Flutter from c9004ff to 66fa4c5 (68 revisions)

flutter/flutter@c9004ff...66fa4c5

2023-04-26 zanderso@users.noreply.github.com Remove web compile
benchmarks that specify an attached device (flutter/flutter#125559)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
f75908135e10 to f125a54f5a57 (1 revision) (flutter/flutter#125560)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
c9db1587f207 to f75908135e10 (1 revision) (flutter/flutter#125558)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
58a5a1e3f2c1 to c9db1587f207 (1 revision) (flutter/flutter#125555)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
321f8015b9c2 to 58a5a1e3f2c1 (1 revision) (flutter/flutter#125552)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
87f5f4e939cf to 321f8015b9c2 (1 revision) (flutter/flutter#125549)
2023-04-26 goderbauer@google.com Update prefer_final_parameters comment
(flutter/flutter#125465)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
706c023df44b to 87f5f4e939cf (1 revision) (flutter/flutter#125539)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
7b385abd18a2 to 706c023df44b (1 revision) (flutter/flutter#125536)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
610c57781b47 to 7b385abd18a2 (1 revision) (flutter/flutter#125533)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
b3cbf0678487 to 610c57781b47 (1 revision) (flutter/flutter#125531)
2023-04-26 zanderso@users.noreply.github.com Add hostonly web compile
size benchmarks (flutter/flutter#125518)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
34ece7a4abac to b3cbf0678487 (6 revisions) (flutter/flutter#125529)
2023-04-25 thkim1011@users.noreply.github.com Handle dollar signs
properly when generating localizations (flutter/flutter#125514)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
6d798393a15a to 34ece7a4abac (1 revision) (flutter/flutter#125516)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
469e5b409686 to 6d798393a15a (2 revisions) (flutter/flutter#125513)
2023-04-25 47866232+chunhtai@users.noreply.github.com Adds selected
semantics flag to radio button for Apple devices
(flutter/flutter#125499)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
0e236982086b to 469e5b409686 (1 revision) (flutter/flutter#125510)
2023-04-25 58529443+srujzs@users.noreply.github.com Relabel JSFunction
as JSExportedDartFunction (flutter/flutter#125453)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
60c4e61416cd to 0e236982086b (2 revisions) (flutter/flutter#125504)
2023-04-25 jmccandless@google.com iOS TextField spell check style
(flutter/flutter#125432)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
308bce499087 to 60c4e61416cd (1 revision) (flutter/flutter#125490)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
54ddef68b124 to 308bce499087 (1 revision) (flutter/flutter#125485)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
307416f43b5a to 54ddef68b124 (1 revision) (flutter/flutter#125481)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
232810b36671 to 307416f43b5a (1 revision) (flutter/flutter#125475)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
1c4b6c0cb862 to 232810b36671 (2 revisions) (flutter/flutter#125472)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
a26a479e86b3 to 1c4b6c0cb862 (1 revision) (flutter/flutter#125463)
2023-04-25 tessertaha@gmail.com Fix `SliverAppBar.medium` &
`SliverAppBar.large` text scale (flutter/flutter#125038)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
3f4116c225e8 to a26a479e86b3 (1 revision) (flutter/flutter#125459)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
64882f4b7371 to 3f4116c225e8 (2 revisions) (flutter/flutter#125458)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
8fe8e94c02fc to 64882f4b7371 (1 revision) (flutter/flutter#125454)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
5fbde6c0fc57 to 8fe8e94c02fc (10 revisions) (flutter/flutter#125452)
2023-04-24 tessertaha@gmail.com Add Sliders to `macrobenchmarks`
(flutter/flutter#125296)
2023-04-24 pateltirth454@gmail.com [date_picker] [date_range_picker] add
properties to change switch-to icons (flutter/flutter#124881)
2023-04-24 thkim1011@users.noreply.github.com Sliver Constrained Cross
Axis (flutter/flutter#125239)
2023-04-24 kevmoo@users.noreply.github.com tool: Move cdKey to
CustomDimensionsEnum (flutter/flutter#125335)
2023-04-24 bernaferrari2@gmail.com Add `borderRadius` to
LinearProgressIndicator (flutter/flutter#123517)
2023-04-24 58529443+srujzs@users.noreply.github.com Fix JS types in
_test_http_request.dart (flutter/flutter#125220)
2023-04-24 tessertaha@gmail.com Fix `OutlinedButton`, `TextButton`, and
`IconButton` throw exception when passing only one cursor to `styleFrom`
(flutter/flutter#125204)
2023-04-24 magder@google.com Swap some iOS TESTOWNERS
(flutter/flutter#125340)
2023-04-24 rmolivares@renzo-olivares.dev Fix iOS touch drag behavior
(flutter/flutter#125169)
2023-04-24 54558023+keyonghan@users.noreply.github.com Mark
module_test_ios flaky (flutter/flutter#125426)
2023-04-24 47866232+chunhtai@users.noreply.github.com Implement url
support for RouteInformation and didPushRouteInformation
(flutter/flutter#119968)
2023-04-24 kevmoo@users.noreply.github.com [tool,web] Include more info
URI on Wasm init failure (flutter/flutter#125312)
2023-04-24 magder@google.com Do not run
`windows_home_scroll_perf__timeline_summary` benchmark in presubmit
(flutter/flutter#125343)
2023-04-24 5236035+fzyzcjy@users.noreply.github.com Tiny fix doc
pointing to incorrect widget confusing the readers
(flutter/flutter#125394)
...
auto-submit bot pushed a commit that referenced this pull request Jun 6, 2023
I am trying to remove `textScaleFactor`-dependent logic from the framework since it's likely going to be deprecated, hopefully the original logic isn't from the material spec.

I stole the sample code from #125038 and here are the screenshots (`textScaleFactor = 3.0`). 

Internal Tests: **no relevant test failures**

|  Medium  |   Large |
| --------------- | --------------- |
| ![flutter_01](https://github.com/flutter/flutter/assets/31859944/515226d9-716f-470a-b794-5fd14b957d36) | ![flutter_03](https://github.com/flutter/flutter/assets/31859944/475c421d-550e-4d02-be08-709b63b63011) |
nploi pushed a commit to nploi/packages that referenced this pull request Jul 16, 2023
Roll Flutter from c9004ff to 66fa4c5 (68 revisions)

flutter/flutter@c9004ff...66fa4c5

2023-04-26 zanderso@users.noreply.github.com Remove web compile
benchmarks that specify an attached device (flutter/flutter#125559)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
f75908135e10 to f125a54f5a57 (1 revision) (flutter/flutter#125560)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
c9db1587f207 to f75908135e10 (1 revision) (flutter/flutter#125558)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
58a5a1e3f2c1 to c9db1587f207 (1 revision) (flutter/flutter#125555)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
321f8015b9c2 to 58a5a1e3f2c1 (1 revision) (flutter/flutter#125552)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
87f5f4e939cf to 321f8015b9c2 (1 revision) (flutter/flutter#125549)
2023-04-26 goderbauer@google.com Update prefer_final_parameters comment
(flutter/flutter#125465)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
706c023df44b to 87f5f4e939cf (1 revision) (flutter/flutter#125539)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
7b385abd18a2 to 706c023df44b (1 revision) (flutter/flutter#125536)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
610c57781b47 to 7b385abd18a2 (1 revision) (flutter/flutter#125533)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
b3cbf0678487 to 610c57781b47 (1 revision) (flutter/flutter#125531)
2023-04-26 zanderso@users.noreply.github.com Add hostonly web compile
size benchmarks (flutter/flutter#125518)
2023-04-26 engine-flutter-autoroll@skia.org Roll Flutter Engine from
34ece7a4abac to b3cbf0678487 (6 revisions) (flutter/flutter#125529)
2023-04-25 thkim1011@users.noreply.github.com Handle dollar signs
properly when generating localizations (flutter/flutter#125514)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
6d798393a15a to 34ece7a4abac (1 revision) (flutter/flutter#125516)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
469e5b409686 to 6d798393a15a (2 revisions) (flutter/flutter#125513)
2023-04-25 47866232+chunhtai@users.noreply.github.com Adds selected
semantics flag to radio button for Apple devices
(flutter/flutter#125499)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
0e236982086b to 469e5b409686 (1 revision) (flutter/flutter#125510)
2023-04-25 58529443+srujzs@users.noreply.github.com Relabel JSFunction
as JSExportedDartFunction (flutter/flutter#125453)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
60c4e61416cd to 0e236982086b (2 revisions) (flutter/flutter#125504)
2023-04-25 jmccandless@google.com iOS TextField spell check style
(flutter/flutter#125432)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
308bce499087 to 60c4e61416cd (1 revision) (flutter/flutter#125490)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
54ddef68b124 to 308bce499087 (1 revision) (flutter/flutter#125485)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
307416f43b5a to 54ddef68b124 (1 revision) (flutter/flutter#125481)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
232810b36671 to 307416f43b5a (1 revision) (flutter/flutter#125475)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
1c4b6c0cb862 to 232810b36671 (2 revisions) (flutter/flutter#125472)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
a26a479e86b3 to 1c4b6c0cb862 (1 revision) (flutter/flutter#125463)
2023-04-25 tessertaha@gmail.com Fix `SliverAppBar.medium` &
`SliverAppBar.large` text scale (flutter/flutter#125038)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
3f4116c225e8 to a26a479e86b3 (1 revision) (flutter/flutter#125459)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
64882f4b7371 to 3f4116c225e8 (2 revisions) (flutter/flutter#125458)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
8fe8e94c02fc to 64882f4b7371 (1 revision) (flutter/flutter#125454)
2023-04-25 engine-flutter-autoroll@skia.org Roll Flutter Engine from
5fbde6c0fc57 to 8fe8e94c02fc (10 revisions) (flutter/flutter#125452)
2023-04-24 tessertaha@gmail.com Add Sliders to `macrobenchmarks`
(flutter/flutter#125296)
2023-04-24 pateltirth454@gmail.com [date_picker] [date_range_picker] add
properties to change switch-to icons (flutter/flutter#124881)
2023-04-24 thkim1011@users.noreply.github.com Sliver Constrained Cross
Axis (flutter/flutter#125239)
2023-04-24 kevmoo@users.noreply.github.com tool: Move cdKey to
CustomDimensionsEnum (flutter/flutter#125335)
2023-04-24 bernaferrari2@gmail.com Add `borderRadius` to
LinearProgressIndicator (flutter/flutter#123517)
2023-04-24 58529443+srujzs@users.noreply.github.com Fix JS types in
_test_http_request.dart (flutter/flutter#125220)
2023-04-24 tessertaha@gmail.com Fix `OutlinedButton`, `TextButton`, and
`IconButton` throw exception when passing only one cursor to `styleFrom`
(flutter/flutter#125204)
2023-04-24 magder@google.com Swap some iOS TESTOWNERS
(flutter/flutter#125340)
2023-04-24 rmolivares@renzo-olivares.dev Fix iOS touch drag behavior
(flutter/flutter#125169)
2023-04-24 54558023+keyonghan@users.noreply.github.com Mark
module_test_ios flaky (flutter/flutter#125426)
2023-04-24 47866232+chunhtai@users.noreply.github.com Implement url
support for RouteInformation and didPushRouteInformation
(flutter/flutter#119968)
2023-04-24 kevmoo@users.noreply.github.com [tool,web] Include more info
URI on Wasm init failure (flutter/flutter#125312)
2023-04-24 magder@google.com Do not run
`windows_home_scroll_perf__timeline_summary` benchmark in presubmit
(flutter/flutter#125343)
2023-04-24 5236035+fzyzcjy@users.noreply.github.com Tiny fix doc
pointing to incorrect widget confusing the readers
(flutter/flutter#125394)
...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
autosubmit Merge PR when tree becomes green via auto submit App f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

SliverAppBar.medium cuts off title when the system font size is increased
2 participants