Skip to content

Commit 63e1ec9

Browse files
committed
[Slider] a11y fixes
- demos are scrollable - fix issue where increment is reversed when Slider is vertical PiperOrigin-RevId: 703087896
1 parent 03d2c69 commit 63e1ec9

File tree

3 files changed

+114
-101
lines changed

3 files changed

+114
-101
lines changed

catalog/java/io/material/catalog/slider/res/layout/cat_slider_demo_icon.xml

Lines changed: 65 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -13,70 +13,75 @@
1313
See the License for the specific language governing permissions and
1414
limitations under the License.
1515
-->
16-
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
16+
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
1717
xmlns:app="http://schemas.android.com/apk/res-auto"
1818
android:layout_width="match_parent"
19-
android:layout_height="match_parent"
20-
android:paddingTop="16dp"
21-
android:paddingLeft="16dp"
22-
android:paddingRight="16dp"
23-
android:orientation="vertical">
19+
android:layout_height="match_parent">
2420

25-
<com.google.android.material.slider.Slider
26-
android:id="@+id/slider_icon_start"
21+
<LinearLayout
2722
android:layout_width="match_parent"
2823
android:layout_height="wrap_content"
29-
android:layout_marginTop="32dp"
30-
android:layout_gravity="center"
31-
android:value="8.09"
32-
android:valueFrom="0.0"
33-
android:valueTo="11.0"
34-
app:thumbHeight="48dp"
35-
app:trackCornerSize="12dp"
36-
app:trackHeight="40dp"
37-
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
38-
app:trackIconActiveStart="@drawable/baseline_music_note_24"
39-
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
40-
app:trackIconInactiveStart="@drawable/baseline_music_off_24"
41-
app:trackIconSize="20dp" />
24+
android:paddingTop="16dp"
25+
android:paddingLeft="16dp"
26+
android:paddingRight="16dp"
27+
android:orientation="vertical">
4228

43-
<com.google.android.material.slider.Slider
44-
android:id="@+id/slider_icon_end"
45-
android:layout_width="match_parent"
46-
android:layout_height="wrap_content"
47-
android:layout_marginTop="32dp"
48-
android:layout_gravity="center"
49-
android:value="8.09"
50-
android:valueFrom="0.0"
51-
android:valueTo="11.0"
52-
app:thumbHeight="48dp"
53-
app:trackCornerSize="12dp"
54-
app:trackHeight="40dp"
55-
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
56-
app:trackIconActiveEnd="@drawable/baseline_music_note_24"
57-
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
58-
app:trackIconInactiveEnd="@drawable/baseline_music_off_24"
59-
app:trackIconSize="20dp"
60-
app:trackStopIndicatorSize="0dp" />
29+
<com.google.android.material.slider.Slider
30+
android:id="@+id/slider_icon_start"
31+
android:layout_width="match_parent"
32+
android:layout_height="wrap_content"
33+
android:layout_marginTop="32dp"
34+
android:layout_gravity="center"
35+
android:value="8.00"
36+
android:valueFrom="0.0"
37+
android:valueTo="11.0"
38+
app:thumbHeight="48dp"
39+
app:trackCornerSize="12dp"
40+
app:trackHeight="40dp"
41+
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
42+
app:trackIconActiveStart="@drawable/baseline_music_note_24"
43+
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
44+
app:trackIconInactiveStart="@drawable/baseline_music_off_24"
45+
app:trackIconSize="20dp" />
6146

62-
<com.google.android.material.slider.Slider
63-
android:id="@+id/slider_icon_start_end"
64-
android:layout_width="match_parent"
65-
android:layout_height="wrap_content"
66-
android:layout_marginTop="32dp"
67-
android:layout_gravity="center"
68-
android:value="8.09"
69-
android:valueFrom="0.0"
70-
android:valueTo="11.0"
71-
app:thumbHeight="48dp"
72-
app:trackCornerSize="12dp"
73-
app:trackHeight="40dp"
74-
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
75-
app:trackIconActiveEnd="@drawable/baseline_music_note_24"
76-
app:trackIconActiveStart="@drawable/baseline_music_note_24"
77-
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
78-
app:trackIconInactiveEnd="@drawable/baseline_music_off_24"
79-
app:trackIconInactiveStart="@drawable/baseline_music_off_24"
80-
app:trackIconSize="20dp"
81-
app:trackStopIndicatorSize="0dp" />
82-
</LinearLayout>
47+
<com.google.android.material.slider.Slider
48+
android:id="@+id/slider_icon_end"
49+
android:layout_width="match_parent"
50+
android:layout_height="wrap_content"
51+
android:layout_marginTop="32dp"
52+
android:layout_gravity="center"
53+
android:value="8.00"
54+
android:valueFrom="0.0"
55+
android:valueTo="11.0"
56+
app:thumbHeight="48dp"
57+
app:trackCornerSize="12dp"
58+
app:trackHeight="40dp"
59+
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
60+
app:trackIconActiveEnd="@drawable/baseline_music_note_24"
61+
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
62+
app:trackIconInactiveEnd="@drawable/baseline_music_off_24"
63+
app:trackIconSize="20dp"
64+
app:trackStopIndicatorSize="0dp" />
65+
66+
<com.google.android.material.slider.Slider
67+
android:id="@+id/slider_icon_start_end"
68+
android:layout_width="match_parent"
69+
android:layout_height="wrap_content"
70+
android:layout_marginTop="32dp"
71+
android:layout_gravity="center"
72+
android:value="8.00"
73+
android:valueFrom="0.0"
74+
android:valueTo="11.0"
75+
app:thumbHeight="48dp"
76+
app:trackCornerSize="12dp"
77+
app:trackHeight="40dp"
78+
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
79+
app:trackIconActiveEnd="@drawable/baseline_music_note_24"
80+
app:trackIconActiveStart="@drawable/baseline_music_note_24"
81+
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
82+
app:trackIconInactiveEnd="@drawable/baseline_music_off_24"
83+
app:trackIconInactiveStart="@drawable/baseline_music_off_24"
84+
app:trackIconSize="20dp"
85+
app:trackStopIndicatorSize="0dp" />
86+
</LinearLayout>
87+
</ScrollView>

catalog/java/io/material/catalog/slider/res/layout/cat_slider_demo_vertical.xml

Lines changed: 35 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -13,41 +13,42 @@
1313
See the License for the specific language governing permissions and
1414
limitations under the License.
1515
-->
16-
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
16+
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
1717
xmlns:app="http://schemas.android.com/apk/res-auto"
1818
android:layout_width="match_parent"
19-
android:layout_height="match_parent"
20-
android:padding="16dp">
19+
android:layout_height="match_parent">
2120

22-
<com.google.android.material.slider.Slider
23-
android:id="@+id/slider_vertical"
24-
android:layout_width="wrap_content"
25-
android:layout_height="350dp"
26-
android:layout_marginTop="64dp"
27-
android:orientation="vertical"
28-
android:value="8.09"
29-
android:valueFrom="0.0"
30-
android:valueTo="11.0"
31-
app:layout_constraintEnd_toEndOf="parent"
32-
app:layout_constraintStart_toStartOf="parent"
33-
app:layout_constraintTop_toTopOf="parent"
34-
app:thumbHeight="48dp"
35-
app:trackCornerSize="12dp"
36-
app:trackHeight="40dp"
37-
app:trackIconSize="20dp"
38-
app:trackIconActiveStart="@drawable/baseline_music_note_24"
39-
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
40-
app:trackIconInactiveStart="@drawable/baseline_music_off_24"
41-
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color" />
42-
43-
<com.google.android.material.materialswitch.MaterialSwitch
44-
android:id="@+id/switch_button"
45-
android:layout_width="wrap_content"
21+
<LinearLayout
22+
android:layout_width="match_parent"
4623
android:layout_height="wrap_content"
47-
android:layout_marginBottom="128dp"
48-
android:checked="true"
49-
android:text="@string/cat_slider_vertical"
50-
app:layout_constraintBottom_toBottomOf="parent"
51-
app:layout_constraintEnd_toEndOf="parent"
52-
app:layout_constraintStart_toStartOf="parent" />
53-
</androidx.constraintlayout.widget.ConstraintLayout>
24+
android:padding="16dp"
25+
android:gravity="center_horizontal"
26+
android:orientation="vertical">
27+
28+
<com.google.android.material.slider.Slider
29+
android:id="@+id/slider_vertical"
30+
android:layout_width="wrap_content"
31+
android:layout_height="350dp"
32+
android:layout_marginTop="64dp"
33+
android:orientation="vertical"
34+
android:value="8.00"
35+
android:valueFrom="0.0"
36+
android:valueTo="11.0"
37+
app:thumbHeight="48dp"
38+
app:trackCornerSize="12dp"
39+
app:trackHeight="40dp"
40+
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
41+
app:trackIconActiveStart="@drawable/baseline_music_note_24"
42+
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
43+
app:trackIconInactiveStart="@drawable/baseline_music_off_24"
44+
app:trackIconSize="20dp" />
45+
46+
<com.google.android.material.materialswitch.MaterialSwitch
47+
android:id="@+id/switch_button"
48+
android:layout_width="wrap_content"
49+
android:layout_height="wrap_content"
50+
android:layout_marginTop="32dp"
51+
android:checked="true"
52+
android:text="@string/cat_slider_vertical" />
53+
</LinearLayout>
54+
</ScrollView>

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

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3304,17 +3304,24 @@ private void positionLabel(TooltipDrawable label, float value) {
33043304
}
33053305

33063306
private void calculateLabelBounds(TooltipDrawable label, float value) {
3307-
int left =
3308-
trackSidePadding
3309-
+ (int) (normalizeValue(value) * trackWidth)
3310-
- label.getIntrinsicWidth() / 2;
3311-
int right = left + label.getIntrinsicWidth();
3307+
int left;
3308+
int right;
33123309
int bottom;
33133310
int top;
33143311
if (isVertical() && !isRtl()) {
3312+
left =
3313+
trackSidePadding
3314+
+ (int) (normalizeValue(value) * trackWidth)
3315+
- label.getIntrinsicHeight() / 2;
3316+
right = left + label.getIntrinsicHeight();
33153317
top = calculateTrackCenter() + (labelPadding + thumbHeight / 2);
3316-
bottom = top + label.getIntrinsicHeight();
3318+
bottom = top + label.getIntrinsicWidth();
33173319
} else {
3320+
left =
3321+
trackSidePadding
3322+
+ (int) (normalizeValue(value) * trackWidth)
3323+
- label.getIntrinsicWidth() / 2;
3324+
right = left + label.getIntrinsicWidth();
33183325
bottom = calculateTrackCenter() - (labelPadding + thumbHeight / 2);
33193326
top = bottom - label.getIntrinsicHeight();
33203327
}
@@ -3911,7 +3918,7 @@ protected boolean onPerformActionForVirtualView(
39113918
}
39123919

39133920
// Swap the increment if we're in RTL.
3914-
if (slider.isRtl() || slider.isVertical()) {
3921+
if (slider.isRtl()) {
39153922
increment = -increment;
39163923
}
39173924

0 commit comments

Comments
 (0)