Skip to content

Commit 223bf15

Browse files
Material Design Teamdsn5ft
Material Design Team
authored and
dsn5ft
committed
[DatePicker] Fix header layout overlapping in landscape
Replaced the FrameLayout in the landscape header with a ConstraintLayout to prevent the title and selection text from overlapping. Enabled autoSizeTextType on the selection text view to handle long text. PiperOrigin-RevId: 786244700
1 parent 5e7e823 commit 223bf15

File tree

3 files changed

+64
-9
lines changed

3 files changed

+64
-9
lines changed

‎gradle/libs.versions.toml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ androidXAnnotation = "1.2.0"
1010
androidXAnnotationExperimental = "1.0.0"
1111
androidXAppCompat = "1.7.0"
1212
androidXCardView = "1.0.0"
13-
androidXConstraintLayout = "2.1.0"
13+
androidXConstraintLayout = "2.2.1"
1414
androidXCoordinatorLayout = "1.1.0"
1515
androidXCore = "1.16.0"
1616
androidXComposeMaterialIconsCore = "1.7.8"

‎lib/java/com/google/android/material/datepicker/res/layout-land/mtrl_picker_header_dialog.xml‎

Lines changed: 45 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,8 @@
1515
limitations under the License.
1616
-->
1717
<merge xmlns:android="http://schemas.android.com/apk/res/android"
18+
xmlns:app="http://schemas.android.com/apk/res-auto"
19+
xmlns:tools="http://schemas.android.com/tools"
1820
android:layout_width="wrap_content"
1921
android:layout_height="match_parent">
2022

@@ -31,30 +33,65 @@
3133
android:paddingRight="@dimen/mtrl_calendar_header_content_padding"
3234
android:orientation="vertical">
3335

34-
<FrameLayout
36+
<androidx.constraintlayout.widget.ConstraintLayout
3537
android:id="@+id/mtrl_picker_header_title_and_selection"
3638
android:layout_width="@dimen/mtrl_calendar_landscape_header_width"
3739
android:layout_height="0dp"
3840
android:layout_weight="1"
3941
android:paddingStart="@dimen/mtrl_calendar_header_text_padding"
4042
android:paddingLeft="@dimen/mtrl_calendar_header_text_padding"
41-
android:importantForAccessibility="yes"
4243
android:focusable="false"
43-
android:focusableInTouchMode="false">
44+
android:focusableInTouchMode="false"
45+
android:importantForAccessibility="yes">
4446

45-
<include layout="@layout/mtrl_picker_header_title_text"/>
46-
<include layout="@layout/mtrl_picker_header_selection_text"/>
47+
<androidx.constraintlayout.widget.Guideline
48+
android:id="@+id/guideline"
49+
android:layout_width="wrap_content"
50+
android:layout_height="wrap_content"
51+
android:orientation="horizontal"
52+
app:layout_constraintGuide_percent="0.55" />
4753

48-
</FrameLayout>
54+
<!-- Disable InconsistentLayout check. This ID is used in an <include>
55+
in the portrait layout , which the Lint check doesn't detect. -->
56+
<TextView
57+
android:id="@+id/mtrl_picker_title_text"
58+
style="?attr/materialCalendarHeaderTitle"
59+
android:layout_width="0dp"
60+
android:layout_height="wrap_content"
61+
app:firstBaselineToTopHeight="@dimen/mtrl_calendar_title_baseline_to_top"
62+
app:layout_constrainedHeight="true"
63+
app:layout_constraintBottom_toTopOf="@+id/guideline"
64+
app:layout_constraintEnd_toEndOf="parent"
65+
app:layout_constraintStart_toStartOf="parent"
66+
app:layout_constraintTop_toTopOf="parent"
67+
app:layout_constraintVertical_bias="0"
68+
tools:ignore="InconsistentLayout" />
4969

50-
<include layout="@layout/mtrl_picker_header_toggle"/>
70+
<!-- Disable InconsistentLayout check. This ID is used in an <include>
71+
in the portrait layout , which the Lint check doesn't detect. -->
72+
<TextView
73+
android:id="@+id/mtrl_picker_header_selection_text"
74+
style="?attr/materialCalendarHeaderSelection"
75+
android:layout_width="0dp"
76+
android:layout_height="0dp"
77+
app:layout_constrainedHeight="true"
78+
app:layout_constraintBottom_toBottomOf="parent"
79+
app:layout_constraintEnd_toEndOf="parent"
80+
app:layout_constraintStart_toStartOf="parent"
81+
app:layout_constraintTop_toBottomOf="@+id/mtrl_picker_title_text"
82+
app:lineHeight="@dimen/mtrl_calendar_header_selection_line_height"
83+
tools:ignore="InconsistentLayout" />
84+
85+
</androidx.constraintlayout.widget.ConstraintLayout>
86+
87+
<include layout="@layout/mtrl_picker_header_toggle" />
5188

5289
</LinearLayout>
5390

5491
<View
5592
style="?attr/materialCalendarHeaderDivider"
5693
android:layout_width="@dimen/mtrl_calendar_header_divider_thickness"
5794
android:layout_height="match_parent"
58-
android:layout_gravity="end"/>
95+
android:layout_gravity="end" />
5996

6097
</merge>

‎lib/java/com/google/android/material/datepicker/res/values-land/styles.xml‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
<item name="android:textAppearance">?attr/textAppearanceHeadline6</item>
2222
<item name="android:maxLines">1</item>
2323
<item name="autoSizeMaxTextSize">20sp</item>
24+
<item name="autoSizeTextType">none</item>
2425
</style>
2526

2627
<style name="Widget.MaterialComponents.MaterialCalendar.HeaderSelection" parent="Widget.AppCompat.TextView">
@@ -31,6 +32,23 @@
3132
<item name="android:textColor">?attr/colorOnPrimary</item>
3233
<item name="android:maxLines">@integer/mtrl_calendar_selection_text_lines</item>
3334
<item name="android:ellipsize">end</item>
35+
<item name="autoSizeTextType">uniform</item>
36+
<item name="autoSizeMaxTextSize">20sp</item>
37+
<item name="android:paddingTop">16dp</item>
38+
</style>
39+
40+
<style name="Widget.Material3.MaterialCalendar.HeaderSelection" parent="Widget.MaterialComponents.MaterialCalendar.HeaderSelection">
41+
<item name="android:textAppearance">@macro/m3_comp_date_picker_modal_header_headline_type</item>
42+
<item name="android:textColor">@macro/m3_comp_date_picker_modal_header_headline_color</item>
43+
<item name="autoSizeMaxTextSize">32sp</item>
44+
<item name="android:paddingTop">0dp</item>
45+
</style>
46+
47+
<style name="Widget.Material3.MaterialCalendar.HeaderSelection.Fullscreen">
48+
<item name="android:textAppearance">@macro/m3_comp_date_picker_modal_range_selection_header_headline_type</item>
49+
<item name="android:maxLines">1</item>
50+
<item name="autoSizeMaxTextSize">20sp</item>
51+
<item name="autoSizeTextType">none</item>
3452
</style>
3553

3654
<style name="Widget.MaterialComponents.MaterialCalendar.HeaderToggleButton" parent="Base.Widget.MaterialComponents.MaterialCalendar.HeaderToggleButton">

0 commit comments

Comments
 (0)