docs: Update doc for scale behaviour of floating label #151835

rkishan516 · 2024-07-16T16:44:45Z

In input decoration if we are showing label as floating when it is focused, it scales down to _kFinalLabelScale i.e. 0.75 right now, but it was not mentioned anywhere.

Resolves #151406

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].
I followed the [breaking change policy] and added [Data Driven Fixes] where supported.
All existing and new tests are passing.

goderbauer · 2024-07-17T09:38:14Z

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

  /// [InputDecoration.errorStyle] color or [ColorScheme.error].
  ///
+  /// When [label] is shown above the input field, it is scaled down
+  /// to [_kFinalLabelScale]. So, any given font size needs to be changed


Please don't reference private symbols in doc comments

Hey @goderbauer, I want to show the scale number, should I directly add 0.75 rather than using private variable. Or any other approach ?

Putting 0.75 in the docs is alright, since otherwise folks won't be able to look up the private value without visiting the source code. :)

Piinks · 2024-07-24T18:24:39Z

Hey @rkishan516 thanks for the update! It looks like the [label] reference is causing the docs failure here:

dartdoc:stderr:   error: unresolved doc reference [label]
dartdoc:stderr:     from material.InputDecorationTheme.floatingLabelStyle: (file:///b/s/w/ir/x/w/flutter/packages/flutter/lib/src/material/input_decorator.dart:3926:20)
dartdoc:stderr:     in documentation inherited from material.InputDecorationTheme.floatingLabelStyle: (file:///b/s/w/ir/x/w/flutter/packages/flutter/lib/src/material/input_decorator.dart:3926:20)

rkishan516 · 2024-07-25T03:18:07Z

Hey @rkishan516 thanks for the update! It looks like the [label] reference is causing the docs failure here:

dartdoc:stderr:   error: unresolved doc reference [label]
dartdoc:stderr:     from material.InputDecorationTheme.floatingLabelStyle: (file:///b/s/w/ir/x/w/flutter/packages/flutter/lib/src/material/input_decorator.dart:3926:20)
dartdoc:stderr:     in documentation inherited from material.InputDecorationTheme.floatingLabelStyle: (file:///b/s/w/ir/x/w/flutter/packages/flutter/lib/src/material/input_decorator.dart:3926:20)

@Piinks If I am not wrong, I can access label property in doc. Can you please tell me, why its responding with Unresolved doc reference ?

Piinks · 2024-07-29T20:11:33Z

It is because that doc is also being referenced in other places as a template. It needs the full reference that includes the class name.

Piinks · 2024-08-07T18:28:33Z

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

+  /// to 0.75. So, any given font size needs to be changed
+  /// accordingly that it will be scaling down at the end.


@rkishan516 can you help clarify this last sentence? I am not sure what font size you are referring to and how it affects the scaling down in response to focus.

Yaa, sure. For any given floatingLabelStyle when we are in focus, we do transform operation to scale down by 75%.
Meaning :- If you are giving fontSize as 24, What you will see is fontSize 18. So, if we want to see fontSize 24, then we should give fontSize as 32.

Just FYI, We are not scaling down fontSize rather we are scaling down whole box where its rendering label. So, actual visible font size will be always 75% of what is given.

Piinks · 2024-08-08T23:41:12Z

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

+  /// When [InputDecoration.label] is shown above the input field, it is scaled down
+  /// to 0.75. So, any given font size needs to be changed
+  /// accordingly that it will be scaling down at the end.


Suggested change

/// When [InputDecoration.label] is shown above the input field, it is scaled down

/// to 0.75. So, any given font size needs to be changed

/// accordingly that it will be scaling down at the end.

/// When the input field receives focus, the font size of [InputDecoration.label] is

/// scaled down by 75%.

What do you think @rkishan516?

@Piinks We only use floatingLabelStyle when field has focus. I don't know, we should mention that or not. Also, we should clearly tell user that it's not font size changing its label itself scaling down by 75%.

/// The [InputDecoration.label] is scaled down to 75% when input field receives focus. /// Adjust the font size accordingly to ensure it appears as intended after scaling.

May be we don't need

/// Adjust the font size accordingly to ensure it appears as intended after scaling.

But to be on safe side, I want user to know that he should change fontSize knowing this fact.

They may not need to change the font size if the default behavior is what they want. This seems like for of a 'for your information' doc, rather than a call to action. If it were a bug, we would just fix the font scaling for them. :)

Yes @Piinks, I think we need to go back to #151406, to understand the issue. That says let suppose if we are giving x font size for floatingLabelStyle, but actually its visible size is not x, reason the whole label is scaled down by 75%.

Ok! From the original issue:

Nothing in the official docs even mentions that this would happen.

I think it is fine to just mention the behavior, since it is working as expected. Users do not necessarily need to make any changes, which is why I suggested removing the recommendation.

Sure, I have done the change.

Piinks

LGTM!

sfshaza2

Well, I might. not be a blessed reviewer over here, but this comment text looks great to me!

…er/flutter#151835)

flutter/flutter@e7da16d...b8f89f7 2024-08-21 [email protected] docs: Update doc for scale behaviour of floating label (flutter/flutter#151835) 2024-08-21 [email protected] Disable Dropdown menu search during keyboard navigation (flutter/flutter#152378) 2024-08-21 [email protected] Add a `bin/flutter-dev` script, for running the `flutter` command-line tool from source (flutter/flutter#153599) 2024-08-21 [email protected] Roll Packages from 4d2d2e3 to 4e5d47e (6 revisions) (flutter/flutter#153848) 2024-08-21 [email protected] Remove unnecessary breaks in default clauses of switch statements (flutter/flutter#153843) 2024-08-21 [email protected] Create Postmortem-Platform-View-android-14-regression (flutter/flutter#149201) 2024-08-21 [email protected] Roll pub packages (flutter/flutter#153838) 2024-08-21 [email protected] Roll pub packages (flutter/flutter#153833) 2024-08-21 [email protected] Add tests for `SingleChildScrollView` examples (flutter/flutter#153548) 2024-08-21 [email protected] Roll Flutter Engine from b1220aa0ebf2 to b94e0097035d (3 revisions) (flutter/flutter#153817) 2024-08-21 [email protected] Roll Flutter Engine from aa1422391cf6 to b1220aa0ebf2 (1 revision) (flutter/flutter#153810) 2024-08-21 [email protected] Roll Flutter Engine from a6508d6557dc to aa1422391cf6 (2 revisions) (flutter/flutter#153808) 2024-08-21 [email protected] Roll Flutter Engine from 5cbf96d0a80f to a6508d6557dc (1 revision) (flutter/flutter#153806) 2024-08-21 [email protected] Roll Flutter Engine from 3d18f65c378a to 5cbf96d0a80f (3 revisions) (flutter/flutter#153804) 2024-08-21 [email protected] `_InteractiveViewerState` code cleanup (flutter/flutter#153645) 2024-08-20 [email protected] Roll Flutter Engine from b80c831e03f7 to 3d18f65c378a (1 revision) (flutter/flutter#153797) 2024-08-20 [email protected] Fix leaky test. (flutter/flutter#153798) 2024-08-20 [email protected] Fix leaky tests. (flutter/flutter#153786) 2024-08-20 [email protected] Roll Flutter Engine from 663176175b4c to b80c831e03f7 (1 revision) (flutter/flutter#153789) 2024-08-20 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Update template/test `compileSdk`, `targetSdk`, `ndk` versions (#152487)" (flutter/flutter#153793) 2024-08-20 [email protected] Update template/test `compileSdk`, `targetSdk`, `ndk` versions (flutter/flutter#152487) 2024-08-20 [email protected] add autofocus to fix a11y issue with dialog (flutter/flutter#152637) 2024-08-20 [email protected] [Release] Update bots to expect new entitlements (flutter/flutter#153787) 2024-08-20 [email protected] Roll Flutter Engine from d6bc4dc6e59d to 663176175b4c (1 revision) (flutter/flutter#153785) 2024-08-20 [email protected] Roll pub packages (flutter/flutter#153740) 2024-08-20 [email protected] Implement tap to scroll to item in CupertinoPicker (flutter/flutter#153386) 2024-08-20 [email protected] Fix leaky test. (flutter/flutter#153780) 2024-08-20 [email protected] Roll Flutter Engine from e10b07598091 to d6bc4dc6e59d (2 revisions) (flutter/flutter#153781) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC [email protected],[email protected],[email protected] on the revert to ensure that a human is aware of the problem. To file a bug in Packages: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

In input decoration if we are showing label as floating when it is focused, it scales down to `_kFinalLabelScale` i.e. 0.75 right now, but it was not mentioned anywhere. Resolves flutter#151406

…er/flutter#151835)

github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Jul 16, 2024

goderbauer reviewed Jul 17, 2024

View reviewed changes

Piinks added the d: api docs Issues with https://api.flutter.dev/ label Jul 18, 2024

rkishan516 force-pushed the floating-label-font-size branch from e8dfa9b to 08e2455 Compare July 19, 2024 00:23

github-actions bot removed the d: api docs Issues with https://api.flutter.dev/ label Jul 19, 2024

rkishan516 force-pushed the floating-label-font-size branch from 08e2455 to 18892ff Compare July 19, 2024 00:27

rkishan516 force-pushed the floating-label-font-size branch 2 times, most recently from 5d5b8c8 to 315ea7a Compare July 25, 2024 03:13

rkishan516 force-pushed the floating-label-font-size branch 2 times, most recently from 7c2bfab to 9c8d09f Compare July 30, 2024 02:37

Piinks reviewed Aug 7, 2024

View reviewed changes

Piinks reviewed Aug 8, 2024

View reviewed changes

Piinks added the d: api docs Issues with https://api.flutter.dev/ label Aug 12, 2024

rkishan516 force-pushed the floating-label-font-size branch from 026e083 to b793d2f Compare August 17, 2024 05:45

github-actions bot removed the d: api docs Issues with https://api.flutter.dev/ label Aug 17, 2024

docs: Update doc for scale behaviour of floating label

737fb06

rkishan516 force-pushed the floating-label-font-size branch from b793d2f to 737fb06 Compare August 17, 2024 05:45

rkishan516 added 2 commits August 19, 2024 09:53

Merge branch 'master' into floating-label-font-size

36622e2

Merge branch 'master' into floating-label-font-size

28a64c0

Piinks approved these changes Aug 21, 2024

View reviewed changes

victorsanni approved these changes Aug 21, 2024

View reviewed changes

victorsanni added the autosubmit Merge PR when tree becomes green via auto submit App label Aug 21, 2024

auto-submit bot merged commit b8f89f7 into flutter:master Aug 21, 2024

sfshaza2 reviewed Aug 21, 2024

View reviewed changes

engine-flutter-autoroll mentioned this pull request Aug 21, 2024

Roll Flutter from e7da16df76cd to b8f89f70bf4e (28 revisions) flutter/packages#7471

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 21, 2024

b8f89f7 docs: Update doc for scale behaviour of floating label (flutt…

36bbd81

…er/flutter#151835)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Dec 11, 2024

b8f89f7 docs: Update doc for scale behaviour of floating label (flutt…

41d720e

…er/flutter#151835)

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Dec 12, 2024

b8f89f7 docs: Update doc for scale behaviour of floating label (flutt…

3b1b3b5

…er/flutter#151835)

rkishan516 deleted the floating-label-font-size branch July 26, 2025 05:48

		/// to 0.75. So, any given font size needs to be changed
		/// accordingly that it will be scaling down at the end.

docs: Update doc for scale behaviour of floating label #151835

docs: Update doc for scale behaviour of floating label #151835

Uh oh!

Conversation

rkishan516 commented Jul 16, 2024

Pre-launch Checklist

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Piinks commented Jul 24, 2024

Uh oh!

rkishan516 commented Jul 25, 2024

Uh oh!

Piinks commented Jul 29, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rkishan516 Aug 7, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Piinks left a comment

Choose a reason for hiding this comment

Uh oh!

sfshaza2 left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Piinks commented Jul 29, 2024 •

edited

Loading

rkishan516 Aug 7, 2024 •

edited

Loading