Skip to content

Commit 5bcda8a

Browse files
paulfthomashunterstich
paulfthomas
authored and
hunterstich
committed
[Slider] Add vertical support
- added "orientation" attr allowing for vertical support - updated tests and doc - added demo PiperOrigin-RevId: 695856298
1 parent 7f8d63b commit 5bcda8a

File tree

8 files changed

+374
-108
lines changed

8 files changed

+374
-108
lines changed

‎catalog/java/io/material/catalog/slider/SliderFragment.java

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,13 @@ public Fragment createFragment() {
9191
return new SliderCornerDemoFragment();
9292
}
9393
});
94+
additionalDemos.add(
95+
new Demo(R.string.cat_slider_demo_vertical_title) {
96+
@Override
97+
public Fragment createFragment() {
98+
return new SliderVerticalDemoFragment();
99+
}
100+
});
94101
return additionalDemos;
95102
}
96103

‎catalog/java/io/material/catalog/slider/SliderVerticalDemoFragment.java

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
/*
2+
* Copyright 2024 The Android Open Source Project
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* https://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
package io.material.catalog.slider;
18+
19+
import io.material.catalog.R;
20+
21+
import static com.google.android.material.slider.SliderOrientation.HORIZONTAL;
22+
import static com.google.android.material.slider.SliderOrientation.VERTICAL;
23+
24+
import android.os.Bundle;
25+
import android.view.LayoutInflater;
26+
import android.view.View;
27+
import android.view.ViewGroup;
28+
import androidx.annotation.NonNull;
29+
import androidx.annotation.Nullable;
30+
import com.google.android.material.materialswitch.MaterialSwitch;
31+
import com.google.android.material.slider.Slider;
32+
import io.material.catalog.feature.DemoFragment;
33+
34+
/**
35+
* Fragment to display a few basic uses of the vertical {@link Slider} widget for the Catalog app.
36+
*/
37+
public class SliderVerticalDemoFragment extends DemoFragment {
38+
39+
@Nullable
40+
@Override
41+
public View onCreateDemoView(
42+
@NonNull LayoutInflater layoutInflater,
43+
@Nullable ViewGroup viewGroup,
44+
@Nullable Bundle bundle) {
45+
46+
View view =
47+
layoutInflater.inflate(
48+
R.layout.cat_slider_demo_vertical, viewGroup, false /* attachToRoot */);
49+
50+
Slider slider = view.findViewById(R.id.slider_vertical);
51+
MaterialSwitch switchButton = view.findViewById(R.id.switch_button);
52+
switchButton.setOnCheckedChangeListener(
53+
(buttonView, isChecked) -> slider.setOrientation(isChecked ? VERTICAL : HORIZONTAL));
54+
55+
return view;
56+
}
57+
}

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

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
<?xml version="1.0" encoding="utf-8"?><!--
2+
Copyright 2024 The Android Open Source Project
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
-->
16+
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
17+
xmlns:app="http://schemas.android.com/apk/res-auto"
18+
android:layout_width="match_parent"
19+
android:layout_height="match_parent"
20+
android:padding="16dp">
21+
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:trackIconActive="@drawable/baseline_music_note_24"
38+
app:trackIconActiveColor="@color/m3_slider_active_tick_marks_color"
39+
app:trackIconActiveSize="20dp"
40+
app:trackIconInactive="@drawable/baseline_music_off_24"
41+
app:trackIconInactiveColor="@color/m3_slider_inactive_tick_marks_color"
42+
app:trackIconInactiveSize="20dp" />
43+
44+
<com.google.android.material.materialswitch.MaterialSwitch
45+
android:id="@+id/switch_button"
46+
android:layout_width="wrap_content"
47+
android:layout_height="wrap_content"
48+
android:layout_marginBottom="128dp"
49+
android:checked="true"
50+
android:text="@string/cat_slider_vertical"
51+
app:layout_constraintBottom_toBottomOf="parent"
52+
app:layout_constraintEnd_toEndOf="parent"
53+
app:layout_constraintStart_toStartOf="parent" />
54+
</androidx.constraintlayout.widget.ConstraintLayout>

‎catalog/java/io/material/catalog/slider/res/values/strings.xml

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
<string name="cat_slider_demo_scroll_container_title" description="Title for the Slider inside scrolling container demo [CHAR LIMIT=NONE]">Slider in scrolling container demo</string>
2222
<string name="cat_slider_demo_label_behavior_title" description="Title for the Slider with different label behaviors demo [CHAR LIMIT=NONE]">Slider label behavior demo</string>
2323
<string name="cat_slider_demo_corner_title" description="Title for the Slider with different corner sizes demo [CHAR LIMIT=NONE]">Slider custom corners demo</string>
24+
<string name="cat_slider_demo_vertical_title" description="Title for the vertical Slider demo [CHAR LIMIT=NONE]">Slider vertical demo</string>
2425

2526
<string name="cat_slider_description" description="Body text describing the Slider widget within the design system [CHAR LIMIT=NONE]">
2627
Sliders let users select from a range of values by moving the slider thumb.
@@ -30,7 +31,8 @@
3031
Discrete sliders allow users to select a specific value from a range.
3132
</string>
3233

33-
<string name="cat_slider_enabled" description="">Enabled</string>
34+
<string name="cat_slider_enabled" description="The label for a switch controlling enabled state[CHAR LIMIT=NONE]">Enabled</string>
35+
<string name="cat_slider_vertical" description="The label for a switch controlling vertical orientation [CHAR LIMIT=NONE]">Vertical</string>
3436
<string name="cat_slider_set" description="The label for a set button [CHAR LIMIT=NONE]">Set</string>
3537
<string name="cat_slider_title_1" description="The title for the first demonstration slider [CHAR LIMIT=NONE]">This one goes to eleven</string>
3638
<string name="cat_slider_title_2" description="The title for a demonstration slider [CHAR LIMIT=NONE]">From 100 to 1000</string>

‎docs/components/Slider.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -294,6 +294,7 @@ slider also has tick marks.
294294

295295
| Element | Attribute | Related method(s) | Default value |
296296
|--------------------------------------------|------------------------------|--------------------------------------------------------------------------------------|--------------------------------------|
297+
| **Orientation** | `android:orientation` | `setOrientation`<br/>`isVertical` | `horizontal` |
297298
| **Min value** | `android:valueFrom` | `setValueFrom`<br/>`getValueFrom` | N/A |
298299
| **Max value** | `android:valueTo` | `setValueTo`<br/>`getValueTo` | N/A |
299300
| **Step size (discrete)** | `android:stepSize` | `setStepSize`<br/>`getStepSize` | N/A |
@@ -321,6 +322,10 @@ thing.
321322
**Note:** `app:trackStopIndicatorSize` takes precedence over
322323
`app:tickRadiusActive` and `app:tickRadiusInactive`.
323324

325+
**Note:** `vertical` orientation still uses `height` in the same way as for
326+
`horizontal` orientation. In this context, `height` can be seen as track
327+
thickness.
328+
324329
#### Thumb attributes
325330

326331
| Element | Attribute | Related method(s) | Default value |

0 commit comments

Comments
 (0)