Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix CalendarDatePicker day selection shape and overlay #144317

Merged

Conversation

TahaTesser
Copy link
Member

@TahaTesser TahaTesser commented Feb 28, 2024

fixes DatePickerDialog date entry hover background and ink splash have different radius
fixes Ability to customize DatePicker day selection background and overlay shape

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: (context) {
            return FilledButton(
              onPressed: () {
                showDatePicker(
                  context: context,
                  initialDate: DateTime.now(),
                  firstDate: DateTime.utc(2010),
                  lastDate: DateTime.utc(2030),
                );
              },
              child: const Text('Show Date picker'),
            );
          }),
        ),
      ),
    );
  }
}

Material DatePicker states specs

overlay_specs

Day selection overlay

Before After

Hover, pressed, highlight preview

Before After
before_recording.mov
after_recording.mov

Using DatePickerThemeData.dayShape to customize day selection background and overlay shape

Before After

Example preview

Screenshot 2024-02-29 at 15 07 50

Pre-launch Checklist

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

@github-actions github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Feb 28, 2024
@TahaTesser TahaTesser force-pushed the date_picker_day_selection_overlay branch from 03e197d to 4ad289e Compare February 28, 2024 18:37
@TahaTesser TahaTesser marked this pull request as ready for review February 28, 2024 19:23
Copy link
Contributor

@HansMuller HansMuller left a comment

Choose a reason for hiding this comment

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

LGTM with one small request for additional doc and maybe an example.

@@ -163,6 +164,10 @@ class DatePickerThemeData with Diagnosticable {
/// indicate that a day in the grid is focused, hovered, or pressed.
final MaterialStateProperty<Color?>? dayOverlayColor;

/// Overrides the default shape used to paint the shape decoration of the
/// day labels in the grid of the date picker.
final MaterialStateProperty<OutlinedBorder?>? dayShape;
Copy link
Contributor

@HansMuller HansMuller Feb 28, 2024

Choose a reason for hiding this comment

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

Since this property only appears in the theme (which is OK) you should explain how it interacts with dayBorder and dayForegroundColor

You could also include a simple example here and link the same example from todayBorder and dayForegroundColor.

@TahaTesser TahaTesser removed the request for review from gspencergoog February 29, 2024 09:49
@github-actions github-actions bot added d: api docs Issues with https://api.flutter.dev/ d: examples Sample code and demos labels Feb 29, 2024
@flutter-dashboard
Copy link

Golden file changes have been found for this pull request. Click here to view and triage (e.g. because this is an intentional change).

If you are still iterating on this change and are not ready to resolve the images on the Flutter Gold dashboard, consider marking this PR as a draft pull request above. You will still be able to view image results on the dashboard, commenting will be silenced, and the check will not try to resolve itself until marked ready for review.

For more guidance, visit Writing a golden file test for package:flutter.

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

Changes reported for pull request #144317 at sha fcf4d843a214e3f085e764d4faa59c7bee0a22b1

@flutter-dashboard flutter-dashboard bot added the will affect goldens Changes to golden files label Feb 29, 2024
@TahaTesser TahaTesser force-pushed the date_picker_day_selection_overlay branch from fcf4d84 to 46da138 Compare March 1, 2024 09:10
@TahaTesser TahaTesser added the autosubmit Merge PR when tree becomes green via auto submit App label Mar 1, 2024
@auto-submit auto-submit bot merged commit ba719bc into flutter:master Mar 1, 2024
132 checks passed
@TahaTesser TahaTesser deleted the date_picker_day_selection_overlay branch March 1, 2024 12:45
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 1, 2024
auto-submit bot pushed a commit to flutter/packages that referenced this pull request Mar 1, 2024
Roll Flutter from e92bca3ff5d2 to ba719bc588ed (37 revisions)

flutter/flutter@e92bca3...ba719bc

2024-03-01 tessertaha@gmail.com Fix `CalendarDatePicker` day selection shape and overlay (flutter/flutter#144317)
2024-03-01 tessertaha@gmail.com Fix chips use square delete button `InkWell` shape instead of circular (flutter/flutter#144319)
2024-03-01 leroux_bruno@yahoo.fr InputDecorator M3 tests migration - Step4 - Hint tests (flutter/flutter#144169)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f0037d4fbd67 to 2a5a9a6dead0 (1 revision) (flutter/flutter#144468)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 16e04d264145 to f0037d4fbd67 (1 revision) (flutter/flutter#144464)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1dff89788b18 to 16e04d264145 (1 revision) (flutter/flutter#144459)
2024-03-01 leroux_bruno@yahoo.fr Horizontally expand text selection toolbar buttons in overflow menu (flutter/flutter#144391)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f68cc57cbe12 to 1dff89788b18 (2 revisions) (flutter/flutter#144457)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 76140bc9cec9 to f68cc57cbe12 (2 revisions) (flutter/flutter#144455)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f300ced56a4e to 76140bc9cec9 (1 revision) (flutter/flutter#144453)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 34cf95c7bd82 to f300ced56a4e (1 revision) (flutter/flutter#144452)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 0db468f7bae5 to 34cf95c7bd82 (1 revision) (flutter/flutter#144450)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 6f8044436eb3 to 0db468f7bae5 (3 revisions) (flutter/flutter#144448)
2024-03-01 goderbauer@google.com Remove master from API docs (flutter/flutter#144425)
2024-03-01 goderbauer@google.com Enable missing-code-block-language (flutter/flutter#144443)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7e8fefe4a084 to 6f8044436eb3 (5 revisions) (flutter/flutter#144436)
2024-02-29 49699333+dependabot[bot]@users.noreply.github.com Bump github/codeql-action from 3.24.5 to 3.24.6 (flutter/flutter#144424)
2024-02-29 jhy03261997@gmail.com Reland [a11y] Fix date picker cannot focus on the edit field  (flutter/flutter#144198)
2024-02-29 goderbauer@google.com Reland "Use dartpad's main channel for master/main docs (#144329)" (flutter/flutter#144431)
2024-02-29 chingjun@google.com Make daemon server work on ipv6-only machines. (flutter/flutter#144359)
2024-02-29 36861262+QuncCccccc@users.noreply.github.com Remove deprecated `backgroundColor` from `ThemeData` (flutter/flutter#144079)
2024-02-29 amirpanahandeh@yahoo.com Add stateful reordering test for TwoDimensionalViewport (flutter/flutter#142375)
2024-02-29 jacksongardner@google.com Always use local CanvasKit/Skwasm in benchmarks for better hermeticity. (flutter/flutter#144423)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from bb6c6a01000f to 7e8fefe4a084 (2 revisions) (flutter/flutter#144419)
2024-02-29 chingjun@google.com Fix a crash in remote device daemon. (flutter/flutter#144358)
2024-02-29 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Use dartpad's main channel for master/main docs (#144329)" (flutter/flutter#144429)
2024-02-29 36861262+QuncCccccc@users.noreply.github.com Remove `toggleableActiveColor` from `ThemeData` (flutter/flutter#144178)
2024-02-29 31859944+LongCatIsLooong@users.noreply.github.com Add `FocusNode.focusabilityListenable` (flutter/flutter#144280)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1f24eaa4979d to bb6c6a01000f (2 revisions) (flutter/flutter#144416)
2024-02-29 jonahwilliams@google.com [devicelab] fix motog4 tests and update comment. (flutter/flutter#144410)
2024-02-29 goderbauer@google.com Bump dartdocs to 8.0.6 (flutter/flutter#144413)
2024-02-29 goderbauer@google.com Use dartpad's main channel for master/main docs (flutter/flutter#144329)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7b3ef43fa7e6 to 1f24eaa4979d (2 revisions) (flutter/flutter#144405)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7dd404724c50 to 7b3ef43fa7e6 (1 revision) (flutter/flutter#144399)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 8179b0ed778e to 7dd404724c50 (3 revisions) (flutter/flutter#144395)
2024-02-29 engine-flutter-autoroll@skia.org Roll Packages from 353086c to 6d02f03 (14 revisions) (flutter/flutter#144393)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from d068d980f952 to 8179b0ed778e (1 revision) (flutter/flutter#144378)

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 bmparr@google.com,rmistry@google.com,stuartmorgan@google.com 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

...
LouiseHsu pushed a commit to LouiseHsu/packages that referenced this pull request Mar 7, 2024
…r#6235)

Roll Flutter from e92bca3ff5d2 to ba719bc588ed (37 revisions)

flutter/flutter@e92bca3...ba719bc

2024-03-01 tessertaha@gmail.com Fix `CalendarDatePicker` day selection shape and overlay (flutter/flutter#144317)
2024-03-01 tessertaha@gmail.com Fix chips use square delete button `InkWell` shape instead of circular (flutter/flutter#144319)
2024-03-01 leroux_bruno@yahoo.fr InputDecorator M3 tests migration - Step4 - Hint tests (flutter/flutter#144169)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f0037d4fbd67 to 2a5a9a6dead0 (1 revision) (flutter/flutter#144468)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 16e04d264145 to f0037d4fbd67 (1 revision) (flutter/flutter#144464)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1dff89788b18 to 16e04d264145 (1 revision) (flutter/flutter#144459)
2024-03-01 leroux_bruno@yahoo.fr Horizontally expand text selection toolbar buttons in overflow menu (flutter/flutter#144391)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f68cc57cbe12 to 1dff89788b18 (2 revisions) (flutter/flutter#144457)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 76140bc9cec9 to f68cc57cbe12 (2 revisions) (flutter/flutter#144455)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f300ced56a4e to 76140bc9cec9 (1 revision) (flutter/flutter#144453)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 34cf95c7bd82 to f300ced56a4e (1 revision) (flutter/flutter#144452)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 0db468f7bae5 to 34cf95c7bd82 (1 revision) (flutter/flutter#144450)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 6f8044436eb3 to 0db468f7bae5 (3 revisions) (flutter/flutter#144448)
2024-03-01 goderbauer@google.com Remove master from API docs (flutter/flutter#144425)
2024-03-01 goderbauer@google.com Enable missing-code-block-language (flutter/flutter#144443)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7e8fefe4a084 to 6f8044436eb3 (5 revisions) (flutter/flutter#144436)
2024-02-29 49699333+dependabot[bot]@users.noreply.github.com Bump github/codeql-action from 3.24.5 to 3.24.6 (flutter/flutter#144424)
2024-02-29 jhy03261997@gmail.com Reland [a11y] Fix date picker cannot focus on the edit field  (flutter/flutter#144198)
2024-02-29 goderbauer@google.com Reland "Use dartpad's main channel for master/main docs (#144329)" (flutter/flutter#144431)
2024-02-29 chingjun@google.com Make daemon server work on ipv6-only machines. (flutter/flutter#144359)
2024-02-29 36861262+QuncCccccc@users.noreply.github.com Remove deprecated `backgroundColor` from `ThemeData` (flutter/flutter#144079)
2024-02-29 amirpanahandeh@yahoo.com Add stateful reordering test for TwoDimensionalViewport (flutter/flutter#142375)
2024-02-29 jacksongardner@google.com Always use local CanvasKit/Skwasm in benchmarks for better hermeticity. (flutter/flutter#144423)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from bb6c6a01000f to 7e8fefe4a084 (2 revisions) (flutter/flutter#144419)
2024-02-29 chingjun@google.com Fix a crash in remote device daemon. (flutter/flutter#144358)
2024-02-29 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Use dartpad's main channel for master/main docs (#144329)" (flutter/flutter#144429)
2024-02-29 36861262+QuncCccccc@users.noreply.github.com Remove `toggleableActiveColor` from `ThemeData` (flutter/flutter#144178)
2024-02-29 31859944+LongCatIsLooong@users.noreply.github.com Add `FocusNode.focusabilityListenable` (flutter/flutter#144280)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1f24eaa4979d to bb6c6a01000f (2 revisions) (flutter/flutter#144416)
2024-02-29 jonahwilliams@google.com [devicelab] fix motog4 tests and update comment. (flutter/flutter#144410)
2024-02-29 goderbauer@google.com Bump dartdocs to 8.0.6 (flutter/flutter#144413)
2024-02-29 goderbauer@google.com Use dartpad's main channel for master/main docs (flutter/flutter#144329)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7b3ef43fa7e6 to 1f24eaa4979d (2 revisions) (flutter/flutter#144405)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7dd404724c50 to 7b3ef43fa7e6 (1 revision) (flutter/flutter#144399)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 8179b0ed778e to 7dd404724c50 (3 revisions) (flutter/flutter#144395)
2024-02-29 engine-flutter-autoroll@skia.org Roll Packages from 353086c to 6d02f03 (14 revisions) (flutter/flutter#144393)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from d068d980f952 to 8179b0ed778e (1 revision) (flutter/flutter#144378)

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 bmparr@google.com,rmistry@google.com,stuartmorgan@google.com 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

...
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 14, 2024
arc-yong pushed a commit to Arctuition/packages-arc that referenced this pull request Jun 14, 2024
…r#6235)

Roll Flutter from e92bca3ff5d2 to ba719bc588ed (37 revisions)

flutter/flutter@e92bca3...ba719bc

2024-03-01 tessertaha@gmail.com Fix `CalendarDatePicker` day selection shape and overlay (flutter/flutter#144317)
2024-03-01 tessertaha@gmail.com Fix chips use square delete button `InkWell` shape instead of circular (flutter/flutter#144319)
2024-03-01 leroux_bruno@yahoo.fr InputDecorator M3 tests migration - Step4 - Hint tests (flutter/flutter#144169)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f0037d4fbd67 to 2a5a9a6dead0 (1 revision) (flutter/flutter#144468)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 16e04d264145 to f0037d4fbd67 (1 revision) (flutter/flutter#144464)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1dff89788b18 to 16e04d264145 (1 revision) (flutter/flutter#144459)
2024-03-01 leroux_bruno@yahoo.fr Horizontally expand text selection toolbar buttons in overflow menu (flutter/flutter#144391)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f68cc57cbe12 to 1dff89788b18 (2 revisions) (flutter/flutter#144457)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 76140bc9cec9 to f68cc57cbe12 (2 revisions) (flutter/flutter#144455)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from f300ced56a4e to 76140bc9cec9 (1 revision) (flutter/flutter#144453)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 34cf95c7bd82 to f300ced56a4e (1 revision) (flutter/flutter#144452)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 0db468f7bae5 to 34cf95c7bd82 (1 revision) (flutter/flutter#144450)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 6f8044436eb3 to 0db468f7bae5 (3 revisions) (flutter/flutter#144448)
2024-03-01 goderbauer@google.com Remove master from API docs (flutter/flutter#144425)
2024-03-01 goderbauer@google.com Enable missing-code-block-language (flutter/flutter#144443)
2024-03-01 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7e8fefe4a084 to 6f8044436eb3 (5 revisions) (flutter/flutter#144436)
2024-02-29 49699333+dependabot[bot]@users.noreply.github.com Bump github/codeql-action from 3.24.5 to 3.24.6 (flutter/flutter#144424)
2024-02-29 jhy03261997@gmail.com Reland [a11y] Fix date picker cannot focus on the edit field  (flutter/flutter#144198)
2024-02-29 goderbauer@google.com Reland "Use dartpad's main channel for master/main docs (#144329)" (flutter/flutter#144431)
2024-02-29 chingjun@google.com Make daemon server work on ipv6-only machines. (flutter/flutter#144359)
2024-02-29 36861262+QuncCccccc@users.noreply.github.com Remove deprecated `backgroundColor` from `ThemeData` (flutter/flutter#144079)
2024-02-29 amirpanahandeh@yahoo.com Add stateful reordering test for TwoDimensionalViewport (flutter/flutter#142375)
2024-02-29 jacksongardner@google.com Always use local CanvasKit/Skwasm in benchmarks for better hermeticity. (flutter/flutter#144423)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from bb6c6a01000f to 7e8fefe4a084 (2 revisions) (flutter/flutter#144419)
2024-02-29 chingjun@google.com Fix a crash in remote device daemon. (flutter/flutter#144358)
2024-02-29 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Use dartpad's main channel for master/main docs (#144329)" (flutter/flutter#144429)
2024-02-29 36861262+QuncCccccc@users.noreply.github.com Remove `toggleableActiveColor` from `ThemeData` (flutter/flutter#144178)
2024-02-29 31859944+LongCatIsLooong@users.noreply.github.com Add `FocusNode.focusabilityListenable` (flutter/flutter#144280)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 1f24eaa4979d to bb6c6a01000f (2 revisions) (flutter/flutter#144416)
2024-02-29 jonahwilliams@google.com [devicelab] fix motog4 tests and update comment. (flutter/flutter#144410)
2024-02-29 goderbauer@google.com Bump dartdocs to 8.0.6 (flutter/flutter#144413)
2024-02-29 goderbauer@google.com Use dartpad's main channel for master/main docs (flutter/flutter#144329)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7b3ef43fa7e6 to 1f24eaa4979d (2 revisions) (flutter/flutter#144405)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 7dd404724c50 to 7b3ef43fa7e6 (1 revision) (flutter/flutter#144399)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from 8179b0ed778e to 7dd404724c50 (3 revisions) (flutter/flutter#144395)
2024-02-29 engine-flutter-autoroll@skia.org Roll Packages from 353086c to 6d02f03 (14 revisions) (flutter/flutter#144393)
2024-02-29 engine-flutter-autoroll@skia.org Roll Flutter Engine from d068d980f952 to 8179b0ed778e (1 revision) (flutter/flutter#144378)

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 bmparr@google.com,rmistry@google.com,stuartmorgan@google.com 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

...
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 d: api docs Issues with https://api.flutter.dev/ d: examples Sample code and demos f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels. will affect goldens Changes to golden files
Projects
None yet
2 participants