Fix wide `DatePicker` input mode button padding for Material 3 #147236

TahaTesser · 2024-04-23T13:47:10Z

fixes Wide DatePickerDialog "Switch to input" button has no margin from dialog side

Description

Currently, there is no material design token for the input mode button padding. This PR fixes the padding by taking date picker side padding values into account.

Code sample

expand to view the code sample

import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Builder(builder: (BuildContext context) {
            return ElevatedButton(
              onPressed: () {
                showDatePicker(
                  context: context,
                  initialDate: DateTime.now(),
                  firstDate: DateTime.utc(2010),
                  lastDate: DateTime.utc(2030),
                );
              },
              child: const Text('Show Date Picker'),
            );
          }),
        ),
      ),
    );
  }
}

Before

After

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.

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

hannah-hyj

LGTM

Piinks · 2024-04-29T22:13:34Z

Checked the google testing failures here, there is a small expected screenshot change. 👍

flutter/flutter#147236)

flutter/flutter@db8c475...b597dd2 2024-04-30 [email protected] Roll Flutter Engine from 2c1517bbf555 to 0ce67714ce4c (1 revision) (flutter/flutter#147585) 2024-04-30 [email protected] Roll Packages from 87a7c51 to cc47b06 (5 revisions) (flutter/flutter#147580) 2024-04-30 [email protected] Roll Flutter Engine from 1a6ef9957b24 to 2c1517bbf555 (1 revision) (flutter/flutter#147579) 2024-04-30 [email protected] Roll Flutter Engine from 64877c08661d to 1a6ef9957b24 (1 revision) (flutter/flutter#147576) 2024-04-30 [email protected] Roll Flutter Engine from 1d62704cb3d2 to 64877c08661d (1 revision) (flutter/flutter#147567) 2024-04-30 [email protected] Roll Flutter Engine from aace42365fc7 to 1d62704cb3d2 (2 revisions) (flutter/flutter#147566) 2024-04-30 [email protected] Roll Flutter Engine from ea6343846c62 to aace42365fc7 (2 revisions) (flutter/flutter#147563) 2024-04-30 [email protected] Roll Flutter Engine from c519e9dd182b to ea6343846c62 (1 revision) (flutter/flutter#147560) 2024-04-30 [email protected] Roll Flutter Engine from 27bb23221305 to c519e9dd182b (1 revision) (flutter/flutter#147557) 2024-04-30 [email protected] Roll Flutter Engine from 93ccb9ab2cda to 27bb23221305 (2 revisions) (flutter/flutter#147556) 2024-04-30 [email protected] Roll Flutter Engine from c093562677fa to 93ccb9ab2cda (1 revision) (flutter/flutter#147553) 2024-04-29 [email protected] Bump dependencies in Flutter (flutter/flutter#147546) 2024-04-29 [email protected] Add configurable hitTestBehavior to Scrollable (flutter/flutter#146403) 2024-04-29 [email protected] Fix wide `DatePicker` input mode button padding for Material 3 (flutter/flutter#147236) 2024-04-29 [email protected] Roll Flutter Engine from 13c7ac9376a5 to c093562677fa (1 revision) (flutter/flutter#147547) 2024-04-29 [email protected] Roll Flutter Engine from 5165c711771c to 13c7ac9376a5 (1 revision) (flutter/flutter#147542) 2024-04-29 [email protected] Roll Packages from dd01140 to 87a7c51 (2 revisions) (flutter/flutter#147539) 2024-04-29 [email protected] Roll Flutter Engine from 399837d38807 to 5165c711771c (2 revisions) (flutter/flutter#147537) 2024-04-29 [email protected] [Fix]: showDateRangePicker with "large" helpText cutoffs the save button (flutter/flutter#146049) 2024-04-29 [email protected] Roll Flutter Engine from 752b146df767 to 399837d38807 (10 revisions) (flutter/flutter#147532) 2024-04-29 [email protected] Add ability to disable `FloatingActionButton` scale and rotation animations using `FloatingActionButtonAnimator.noAnimation` (flutter/flutter#146126) 2024-04-29 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Roll Flutter Engine from 752b146df767 to f4c20e97e6aa (2 revisions) (#147495)" (flutter/flutter#147502) 2024-04-28 [email protected] Roll Flutter Engine from 752b146df767 to f4c20e97e6aa (2 revisions) (flutter/flutter#147495) 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

flutter/flutter#147236)

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

TahaTesser marked this pull request as ready for review April 23, 2024 14:35

TahaTesser requested a review from hannah-hyj April 23, 2024 14:35

hannah-hyj approved these changes Apr 24, 2024

View reviewed changes

TahaTesser force-pushed the date_input_mode_button_padding branch 3 times, most recently from b3e5546 to debebc5 Compare April 26, 2024 06:58

Fix wide DatePicker input mode button padding for Material 3

daa0e7f

TahaTesser force-pushed the date_input_mode_button_padding branch from debebc5 to daa0e7f Compare April 29, 2024 07:25

Piinks added the autosubmit Merge PR when tree becomes green via auto submit App label Apr 29, 2024

auto-submit bot merged commit 7ff31a4 into flutter:master Apr 29, 2024

TahaTesser deleted the date_input_mode_button_padding branch April 30, 2024 07:19

engine-flutter-autoroll mentioned this pull request Apr 30, 2024

Roll Flutter from db8c475cac11 to 12ad41ca9e43 (20 revisions) flutter/packages#6628

Closed

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

7ff31a4 Fix wide DatePicker input mode button padding for Material 3 (

01b4af4

flutter/flutter#147236)

engine-flutter-autoroll mentioned this pull request Apr 30, 2024

Roll Flutter from db8c475cac11 to 456f0101fd26 (22 revisions) flutter/packages#6630

Closed

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

7ff31a4 Fix wide DatePicker input mode button padding for Material 3 (

ce1a90c

flutter/flutter#147236)

engine-flutter-autoroll mentioned this pull request Apr 30, 2024

Roll Flutter from db8c475cac11 to b597dd24cb97 (23 revisions) flutter/packages#6631

Merged

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

7ff31a4 Fix wide DatePicker input mode button padding for Material 3 (

2c20949

flutter/flutter#147236)

Piinks mentioned this pull request May 3, 2024

Flutter Framework Team: Notable Commits #121415

Closed

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

7ff31a4 Fix wide DatePicker input mode button padding for Material 3 (

f9bfc3b

flutter/flutter#147236)

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Fix wide `DatePicker` input mode button padding for Material 3 #147236

Fix wide `DatePicker` input mode button padding for Material 3 #147236

Uh oh!

TahaTesser commented Apr 23, 2024 •

edited

Loading

Uh oh!

hannah-hyj left a comment

Uh oh!

Piinks commented Apr 29, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Fix wide DatePicker input mode button padding for Material 3 #147236

Fix wide DatePicker input mode button padding for Material 3 #147236

Uh oh!

Conversation

TahaTesser commented Apr 23, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Code sample

Before

After

Pre-launch Checklist

Uh oh!

hannah-hyj left a comment

Choose a reason for hiding this comment

Uh oh!

Piinks commented Apr 29, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Fix wide `DatePicker` input mode button padding for Material 3 #147236

Fix wide `DatePicker` input mode button padding for Material 3 #147236

TahaTesser commented Apr 23, 2024 •

edited

Loading