From bc611f565b0554c09832ff23a16e89a12aefc56c Mon Sep 17 00:00:00 2001 From: "auto-submit[bot]" <98614782+auto-submit[bot]@users.noreply.github.com> Date: Thu, 14 Mar 2024 18:00:26 +0000 Subject: [PATCH] Reverts "Fix TextField helper top padding on M3 (#145087)" (#145168) Reverts: flutter/flutter#145087 Initiated by: Jasguerrero Reason for reverting: failing on accessibility checks b/329548765 Original PR Author: bleroux Reviewed By: {justinmc} This change reverts the following previous change: ## Description `InputDecorator` adds a 8.0 gap beetween the container and the helper text. From the Material 3 specification, this gap should be 4.0. See https://m3.material.io/components/text-fields/specs#0c5c8d6d-2169-4d42-960c-51f6ee42eb57. This PR sets the correct values for M3 without changing the value for M2. | Before | After | M3 Spec | |--------|--------|--------| | ![image](https://github.com/flutter/flutter/assets/840911/9947f334-d98f-4f7e-9da7-ca6d5c0770ac) | ![image](https://github.com/flutter/flutter/assets/840911/081dec4b-eb9f-4eee-a7dc-2538e7110ff0)| ![image](https://github.com/flutter/flutter/assets/840911/c8c8f045-3b79-43a5-a1a3-cc6d5460644f) | If this change is accepted, a future step will be to make this value configurable, probably by `InputDecorationTheme`. ## Related Issue Fixes https://github.com/flutter/flutter/issues/144984 ## Tests Updates a value used by several existing tests. --- packages/flutter/lib/src/material/input_decorator.dart | 4 +--- packages/flutter/test/material/input_decorator_test.dart | 9 ++++++--- 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/packages/flutter/lib/src/material/input_decorator.dart b/packages/flutter/lib/src/material/input_decorator.dart index c75794e0243..136826b0e65 100644 --- a/packages/flutter/lib/src/material/input_decorator.dart +++ b/packages/flutter/lib/src/material/input_decorator.dart @@ -726,9 +726,7 @@ class _RenderDecoration extends RenderBox with SlottedContainerRenderObjectMixin _expands = expands, _material3 = material3; - // TODO(bleroux): consider defining this value as a Material token and making it - // configurable by InputDecorationTheme. - double get subtextGap => material3 ? 4.0 : 8.0; + static const double subtextGap = 8.0; RenderBox? get icon => childForSlot(_DecorationSlot.icon); RenderBox? get input => childForSlot(_DecorationSlot.input); diff --git a/packages/flutter/test/material/input_decorator_test.dart b/packages/flutter/test/material/input_decorator_test.dart index c35562d6171..2f5405592d7 100644 --- a/packages/flutter/test/material/input_decorator_test.dart +++ b/packages/flutter/test/material/input_decorator_test.dart @@ -1504,20 +1504,23 @@ void main() { }); group('Material3 - InputDecoration helper/counter/error', () { - // Overall height for InputDecorator (filled or outlined) is 76dp on mobile: + // Overall height for InputDecorator (filled or outlined) is 80dp on mobile: // 8 - top padding // 12 - floating label (font size = 16 * 0.75, line height is forced to 1.0) // 4 - gap between label and input // 24 - input text (font size = 16, line height = 1.5) // 8 - bottom padding - // 4 - gap above helper/error/counter + // 8 - gap above supporting text // 16 - helper/counter (font size = 12, line height is 1.5) const double topPadding = 8.0; const double floatingLabelHeight = 12.0; const double labelInputGap = 4.0; const double inputHeight = 24.0; const double bottomPadding = 8.0; - const double helperGap = 4.0; + // TODO(bleroux): make the InputDecorator implementation compliant with M3 spec by changing + // the helperGap to 4.0 instead of 8.0. + // See https://github.com/flutter/flutter/issues/144984. + const double helperGap = 8.0; const double helperHeight = 16.0; const double containerHeight = topPadding + floatingLabelHeight + labelInputGap + inputHeight + bottomPadding; // 56.0 const double fullHeight = containerHeight + helperGap + helperHeight; // 80.0 (should be 76.0 based on M3 spec)