Skip to content

Commit c218b3c

Browse files
paulfthomaspekingme
paulfthomas
authored and
pekingme
committed
[NTC][Slider] Update styles
Update the Material Slider to be compliant with the latest accessibility requirements. PiperOrigin-RevId: 595740932
1 parent 98284e7 commit c218b3c

File tree

8 files changed

+121
-27
lines changed

8 files changed

+121
-27
lines changed

‎lib/java/com/google/android/material/slider/BaseSlider.java‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,8 @@
4444
import android.graphics.Paint;
4545
import android.graphics.Paint.Cap;
4646
import android.graphics.Paint.Style;
47+
import android.graphics.Path;
48+
import android.graphics.Path.Direction;
4749
import android.graphics.PorterDuff.Mode;
4850
import android.graphics.PorterDuffXfermode;
4951
import android.graphics.Rect;
@@ -334,6 +336,7 @@ abstract class BaseSlider<
334336
@NonNull private ColorStateList trackColorActive;
335337
@NonNull private ColorStateList trackColorInactive;
336338

339+
@NonNull private final Path trackPath = new Path();
337340
@NonNull private final RectF trackRect = new RectF();
338341
@NonNull private final RectF cornerRect = new RectF();
339342
@NonNull private final MaterialShapeDrawable defaultThumbDrawable = new MaterialShapeDrawable();
@@ -2187,29 +2190,26 @@ private void updateTrack(
21872190
bounds.left += leftCornerSize;
21882191
bounds.right -= rightCornerSize;
21892192

2190-
// Draw the left and right corners as round rect.
2193+
// Build track path with rounded corners.
2194+
trackPath.reset();
2195+
trackPath.addRect(bounds, Direction.CW);
2196+
addRoundedCorners(trackPath, bounds, leftCornerSize, rightCornerSize);
2197+
2198+
// Draw the track.
21912199
paint.setStyle(Style.FILL);
21922200
paint.setStrokeCap(Cap.BUTT);
2193-
drawRoundedCorners(canvas, paint, bounds, leftCornerSize, rightCornerSize);
2194-
2195-
// Draw the track overlapping the corners.
2196-
paint.setXfermode(new PorterDuffXfermode(Mode.SRC));
2197-
canvas.drawRect(bounds, paint);
2198-
paint.setXfermode(null);
2201+
paint.setAntiAlias(true);
2202+
canvas.drawPath(trackPath, paint);
21992203
}
22002204

2201-
private void drawRoundedCorners(
2202-
Canvas canvas, Paint paint, RectF bounds, float leftCornerSize, float rightCornerSize) {
2203-
canvas.save();
2204-
2205+
private void addRoundedCorners(
2206+
Path path, RectF bounds, float leftCornerSize, float rightCornerSize) {
22052207
cornerRect.set(
22062208
bounds.left - leftCornerSize, bounds.top, bounds.left + leftCornerSize, bounds.bottom);
2207-
canvas.drawRoundRect(cornerRect, leftCornerSize, leftCornerSize, paint);
2209+
path.addRoundRect(cornerRect, leftCornerSize, leftCornerSize, Direction.CW);
22082210
cornerRect.set(
2209-
bounds.right + rightCornerSize, bounds.top, bounds.right - rightCornerSize, bounds.bottom);
2210-
canvas.drawRoundRect(cornerRect, rightCornerSize, rightCornerSize, paint);
2211-
2212-
canvas.restore();
2211+
bounds.right - rightCornerSize, bounds.top, bounds.right + rightCornerSize, bounds.bottom);
2212+
path.addRoundRect(cornerRect, rightCornerSize, rightCornerSize, Direction.CW);
22132213
}
22142214

22152215
private void maybeDrawTicks(@NonNull Canvas canvas) {

‎lib/java/com/google/android/material/slider/res/color/m3_slider_active_track_color_legacy.xml‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
~ Copyright (C) 2023 The Android Open Source Project
4+
~
5+
~ Licensed under the Apache License, Version 2.0 (the "License");
6+
~ you may not use this file except in compliance with the License.
7+
~ You may obtain a copy of the License at
8+
~
9+
~ http://www.apache.org/licenses/LICENSE-2.0
10+
~
11+
~ Unless required by applicable law or agreed to in writing, software
12+
~ distributed under the License is distributed on an "AS IS" BASIS,
13+
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14+
~ See the License for the specific language governing permissions and
15+
~ limitations under the License.
16+
-->
17+
<selector xmlns:android="http://schemas.android.com/apk/res/android">
18+
<item android:color="@macro/m3_comp_slider_active_track_color" android:state_enabled="true"/>
19+
<item android:alpha="@dimen/m3_comp_slider_disabled_active_track_opacity" android:color="@macro/m3_comp_slider_disabled_active_track_color"/>
20+
</selector>

lib/java/com/google/android/material/slider/res/color/m3_slider_halo_color.xml renamed to lib/java/com/google/android/material/slider/res/color/m3_slider_halo_color_legacy.xml

File renamed without changes.

‎lib/java/com/google/android/material/slider/res/color/m3_slider_inactive_track_color.xml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,6 @@
1515
~ limitations under the License.
1616
-->
1717
<selector xmlns:android="http://schemas.android.com/apk/res/android">
18-
<item android:color="@macro/m3_comp_slider_inactive_track_color" android:state_enabled="true"/>
19-
<item android:alpha="@dimen/m3_comp_slider_disabled_inactive_track_opacity" android:color="@macro/m3_comp_slider_disabled_inactive_track_color"/>
18+
<item android:color="?attr/colorSecondaryContainer" android:state_enabled="true" />
19+
<item android:color="?attr/colorSurfaceVariant" />
2020
</selector>

‎lib/java/com/google/android/material/slider/res/color/m3_slider_inactive_track_color_legacy.xml‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
~ Copyright (C) 2023 The Android Open Source Project
4+
~
5+
~ Licensed under the Apache License, Version 2.0 (the "License");
6+
~ you may not use this file except in compliance with the License.
7+
~ You may obtain a copy of the License at
8+
~
9+
~ http://www.apache.org/licenses/LICENSE-2.0
10+
~
11+
~ Unless required by applicable law or agreed to in writing, software
12+
~ distributed under the License is distributed on an "AS IS" BASIS,
13+
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14+
~ See the License for the specific language governing permissions and
15+
~ limitations under the License.
16+
-->
17+
<selector xmlns:android="http://schemas.android.com/apk/res/android">
18+
<item android:color="@macro/m3_comp_slider_inactive_track_color" android:state_enabled="true"/>
19+
<item android:alpha="@dimen/m3_comp_slider_disabled_inactive_track_opacity" android:color="@macro/m3_comp_slider_disabled_inactive_track_color"/>
20+
</selector>

‎lib/java/com/google/android/material/slider/res/color/m3_slider_thumb_color_legacy.xml‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
~ Copyright (C) 2023 The Android Open Source Project
4+
~
5+
~ Licensed under the Apache License, Version 2.0 (the "License");
6+
~ you may not use this file except in compliance with the License.
7+
~ You may obtain a copy of the License at
8+
~
9+
~ http://www.apache.org/licenses/LICENSE-2.0
10+
~
11+
~ Unless required by applicable law or agreed to in writing, software
12+
~ distributed under the License is distributed on an "AS IS" BASIS,
13+
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14+
~ See the License for the specific language governing permissions and
15+
~ limitations under the License.
16+
-->
17+
<selector xmlns:android="http://schemas.android.com/apk/res/android">
18+
<!-- Disabled -->
19+
<item android:alpha="@dimen/m3_comp_slider_disabled_handle_opacity"
20+
android:color="@macro/m3_comp_slider_disabled_handle_color"
21+
android:state_enabled="false"/>
22+
23+
<!-- Normal -->
24+
<item android:color="@macro/m3_comp_slider_handle_color"/>
25+
</selector>

‎lib/java/com/google/android/material/slider/res/values/dimens.xml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
<dimen name="mtrl_slider_label_radius">13dp</dimen>
3434
<dimen name="mtrl_slider_label_padding">4dp</dimen>
3535

36-
<dimen name="m3_slider_thumb_elevation">2dp</dimen> <!-- TODO(b/246836765): Update to the new style -->
36+
<dimen name="m3_slider_thumb_elevation">2dp</dimen>
3737
<dimen name="m3_slider_inactive_track_height">@dimen/m3_comp_slider_inactive_track_height</dimen>
3838

3939
</resources>

‎lib/java/com/google/android/material/slider/res/values/styles.xml‎

Lines changed: 37 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -35,22 +35,51 @@
3535

3636
<style name="Widget.MaterialComponents.Slider" parent="Base.Widget.MaterialComponents.Slider"/>
3737

38+
<style name="Widget.Material3.Slider.Legacy" parent="Widget.MaterialComponents.Slider">
39+
<item name="haloColor">@color/m3_slider_halo_color_legacy</item>
40+
<item name="labelStyle">@style/Widget.Material3.Slider.Legacy.Label</item>
41+
<item name="thumbColor">@color/m3_slider_thumb_color_legacy</item>
42+
<item name="tickColorActive">@color/m3_slider_inactive_track_color_legacy</item>
43+
<item name="tickColorInactive">@color/m3_slider_active_track_color_legacy</item>
44+
<item name="trackColorActive">@color/m3_slider_active_track_color_legacy</item>
45+
<item name="trackColorInactive">@color/m3_slider_inactive_track_color_legacy</item>
46+
<item name="trackHeight">@dimen/m3_slider_inactive_track_height</item>
47+
<item name="thumbElevation">@dimen/m3_slider_thumb_elevation</item>
48+
<item name="trackInsideCornerSize">0dp</item>
49+
<item name="thumbWidth">@null</item>
50+
<item name="thumbHeight">@null</item>
51+
<item name="thumbTrackGapSize">0dp</item>
52+
<item name="trackStopIndicatorSize">0dp</item>
53+
</style>
54+
55+
<style name="Widget.Material3.Slider.Legacy.Label" parent="Widget.Material3.Tooltip">
56+
<item name="android:textColor">@macro/m3_comp_slider_label_label_text_color</item>
57+
<item name="backgroundTint">@macro/m3_comp_slider_label_container_color</item>
58+
</style>
59+
3860
<style name="Widget.Material3.Slider" parent="Widget.MaterialComponents.Slider">
39-
<item name="haloColor">@color/m3_slider_halo_color</item> <!-- TODO(b/246836765): Check with designer regarding the new style -->
61+
<item name="haloColor">@android:color/transparent</item>
4062
<item name="labelStyle">@style/Widget.Material3.Slider.Label</item>
4163
<item name="thumbColor">@color/m3_slider_thumb_color</item>
42-
<item name="tickColorActive">@color/m3_slider_inactive_track_color</item> <!-- TODO(b/246836765): Update to the new style -->
43-
<item name="tickColorInactive">@color/m3_slider_active_track_color</item> <!-- TODO(b/246836765): Update to the new style -->
64+
<item name="tickColorActive">@color/m3_slider_inactive_track_color</item>
65+
<item name="tickColorInactive">@color/m3_slider_active_track_color</item>
4466
<item name="trackColorActive">@color/m3_slider_active_track_color</item>
4567
<item name="trackColorInactive">@color/m3_slider_inactive_track_color</item>
46-
<item name="trackHeight">@dimen/m3_slider_inactive_track_height</item> <!-- TODO(b/246836765): Update to the new style -->
47-
<item name="thumbElevation">@dimen/m3_slider_thumb_elevation</item>
68+
<item name="trackHeight">16dp</item>
69+
<item name="thumbElevation">0dp</item>
70+
<item name="trackInsideCornerSize">2dp</item>
71+
<item name="thumbWidth">4dp</item>
72+
<item name="thumbHeight">44dp</item>
73+
<item name="thumbTrackGapSize">6dp</item>
74+
<item name="trackStopIndicatorSize">4dp</item>
4875
</style>
4976

50-
<!-- TODO(b/246836765): Update to the new style -->
5177
<style name="Widget.Material3.Slider.Label" parent="Widget.Material3.Tooltip">
52-
<item name="android:textColor">@macro/m3_comp_slider_label_label_text_color</item>
53-
<item name="backgroundTint">@macro/m3_comp_slider_label_container_color</item>
78+
<item name="android:textColor">?attr/colorOnSurfaceInverse</item>
79+
<item name="backgroundTint">?attr/colorSurfaceInverse</item>
80+
<item name="showMarker">false</item>
81+
<item name="android:padding">10dp</item>
82+
<item name="android:minHeight">32dp</item>
5483
</style>
5584

5685
</resources>

0 commit comments

Comments
 (0)