Skip to content

Commit b32512a

Browse files
pekingmepaulfthomas
authored andcommitted
[ProgressIndicator] Added demos for wave effects.
PiperOrigin-RevId: 620297129
1 parent b61ab85 commit b32512a

File tree

4 files changed

+226
-6
lines changed

4 files changed

+226
-6
lines changed

catalog/java/io/material/catalog/progressindicator/ProgressIndicatorFragment.java

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,11 +67,20 @@ public Fragment createFragment() {
6767
});
6868
additionalDemos.add(
6969
new Demo(R.string.cat_progress_indicator_demo_standalone_title) {
70+
@Nullable
7071
@Override
7172
public Fragment createFragment() {
7273
return new ProgressIndicatorStandaloneDemoFragment();
7374
}
7475
});
76+
additionalDemos.add(
77+
new Demo(R.string.cat_progress_indicator_wave_demo_title) {
78+
@Nullable
79+
@Override
80+
public Fragment createFragment() {
81+
return new ProgressIndicatorWaveDemoFragment();
82+
}
83+
});
7584
return additionalDemos;
7685
}
7786

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
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+
* 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+
package io.material.catalog.progressindicator;
17+
18+
import io.material.catalog.R;
19+
20+
import android.view.View;
21+
import androidx.annotation.LayoutRes;
22+
import androidx.annotation.NonNull;
23+
import com.google.android.material.materialswitch.MaterialSwitch;
24+
import com.google.android.material.progressindicator.CircularProgressIndicator;
25+
import com.google.android.material.progressindicator.LinearProgressIndicator;
26+
import com.google.android.material.slider.Slider;
27+
28+
/**
29+
* This is the fragment to demo wave effects in {@link LinearProgressIndicator} and {@link
30+
* CircularProgressIndicator}.
31+
*/
32+
public class ProgressIndicatorWaveDemoFragment extends ProgressIndicatorDemoFragment {
33+
34+
@NonNull private LinearProgressIndicator linearIndicator;
35+
@NonNull private CircularProgressIndicator circularIndicator;
36+
37+
@Override
38+
public void initDemoContents(@NonNull View view) {
39+
linearIndicator = view.findViewById(R.id.linear_indicator);
40+
circularIndicator = view.findViewById(R.id.circular_indicator);
41+
}
42+
43+
@Override
44+
public void initDemoControls(@NonNull View view) {
45+
Slider progressSlider = view.findViewById(R.id.progress_slider);
46+
MaterialSwitch determinateSwitch = view.findViewById(R.id.determinate_mode_switch);
47+
48+
progressSlider.addOnChangeListener(
49+
(slider, value, fromUser) -> {
50+
if (!linearIndicator.isIndeterminate()) {
51+
linearIndicator.setProgressCompat((int) value, true);
52+
}
53+
if (!circularIndicator.isIndeterminate()) {
54+
circularIndicator.setProgressCompat((int) value, true);
55+
}
56+
});
57+
determinateSwitch.setOnCheckedChangeListener(
58+
(v, isChecked) -> {
59+
if (isChecked) {
60+
float progress = progressSlider.getValue();
61+
linearIndicator.setProgressCompat((int) progress, true);
62+
circularIndicator.setProgressCompat((int) progress, true);
63+
} else {
64+
linearIndicator.setProgressCompat(0, false);
65+
circularIndicator.setProgressCompat(0, false);
66+
linearIndicator.setIndeterminate(true);
67+
circularIndicator.setIndeterminate(true);
68+
}
69+
});
70+
71+
float pixelsInDp = view.getResources().getDisplayMetrics().density;
72+
73+
Slider amplitudeSlider = view.findViewById(R.id.amplitude_slider);
74+
amplitudeSlider.addOnChangeListener(
75+
(slider, value, fromUser) -> {
76+
int newAmplitude = (int) (value * pixelsInDp);
77+
if (linearIndicator.getAmplitude() != newAmplitude) {
78+
linearIndicator.setAmplitude(newAmplitude);
79+
}
80+
if (circularIndicator.getAmplitude() != newAmplitude) {
81+
circularIndicator.setAmplitude((int) (value * pixelsInDp));
82+
}
83+
});
84+
Slider waveLengthSlider = view.findViewById(R.id.wavelength_slider);
85+
waveLengthSlider.addOnChangeListener(
86+
(slider, value, fromUser) -> {
87+
int newWaveLength = (int) (value * pixelsInDp);
88+
if (linearIndicator.getWavelength() != newWaveLength) {
89+
linearIndicator.setWavelength(newWaveLength);
90+
}
91+
if (circularIndicator.getWavelength() != newWaveLength) {
92+
circularIndicator.setWavelength(newWaveLength);
93+
}
94+
});
95+
96+
Slider circularSizeSlider = view.findViewById(R.id.circularSizeSlider);
97+
circularSizeSlider.addOnChangeListener(
98+
(slider, value, fromUser) -> {
99+
int newCornerRadius = (int) (value * pixelsInDp);
100+
if (circularIndicator.getIndicatorSize() != newCornerRadius) {
101+
circularIndicator.setIndicatorSize(newCornerRadius);
102+
}
103+
});
104+
}
105+
106+
@Override
107+
@LayoutRes
108+
public int getProgressIndicatorContentLayout() {
109+
return R.layout.cat_progress_indicator_main_content;
110+
}
111+
112+
@Override
113+
@LayoutRes
114+
public int getProgressIndicatorDemoControlLayout() {
115+
return R.layout.cat_progress_indicator_wave_controls;
116+
}
117+
}
Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
~ Copyright (C) 2024 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+
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
18+
android:layout_width="match_parent"
19+
android:layout_height="wrap_content"
20+
android:clipChildren="false"
21+
android:clipToPadding="false"
22+
android:orientation="vertical"
23+
android:padding="16dp"
24+
android:showDividers="middle"
25+
android:divider="@drawable/layout_divider">
26+
27+
<com.google.android.material.materialswitch.MaterialSwitch
28+
android:id="@+id/determinate_mode_switch"
29+
android:layout_width="match_parent"
30+
android:layout_height="wrap_content"
31+
android:checked="true"
32+
android:text="@string/cat_progress_indicator_set_to_determinate_mode"/>
33+
<TextView
34+
android:layout_width="wrap_content"
35+
android:layout_height="wrap_content"
36+
android:text="@string/cat_progress_indicator_determinate_progress"/>
37+
<com.google.android.material.slider.Slider
38+
android:id="@+id/progress_slider"
39+
android:layout_width="match_parent"
40+
android:layout_height="wrap_content"
41+
android:value="50"
42+
android:valueFrom="0"
43+
android:valueTo="100"
44+
android:stepSize="1"/>
45+
46+
<TextView
47+
android:layout_width="wrap_content"
48+
android:layout_height="wrap_content"
49+
android:text="@string/cat_progress_indicator_wave_amplitude"/>
50+
<com.google.android.material.slider.Slider
51+
android:layout_width="match_parent"
52+
android:layout_height="wrap_content"
53+
android:id="@+id/amplitude_slider"
54+
android:valueFrom="0"
55+
android:valueTo="30"
56+
android:stepSize="1"/>
57+
58+
<TextView
59+
android:layout_width="wrap_content"
60+
android:layout_height="wrap_content"
61+
android:text="@string/cat_progress_indicator_wave_length"/>
62+
<com.google.android.material.slider.Slider
63+
android:layout_width="match_parent"
64+
android:layout_height="wrap_content"
65+
android:id="@+id/wavelength_slider"
66+
android:valueFrom="0"
67+
android:valueTo="100"
68+
android:stepSize="1"/>
69+
70+
<TextView
71+
android:layout_width="wrap_content"
72+
android:layout_height="wrap_content"
73+
android:text="@string/cat_progress_indicator_circular_indicator_size"/>
74+
<com.google.android.material.slider.Slider
75+
android:id="@+id/circularSizeSlider"
76+
android:layout_width="match_parent"
77+
android:layout_height="wrap_content"
78+
android:value="40"
79+
android:valueFrom="20"
80+
android:valueTo="200"
81+
android:stepSize="5"/>
82+
</LinearLayout>

catalog/java/io/material/catalog/progressindicator/res/values/strings.xml

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,10 @@
3131
description="Title of demo for other components using progress indicator standalone drawables [CHAR LIMIT=NONE]">
3232
Standalone Drawable Progress Indicator Demo
3333
</string>
34+
<string name="cat_progress_indicator_wave_demo_title"
35+
description="Title of demo for applying wave effects on progress indicators [CHAR LIMIT=NONE]">
36+
Wavy Progress Indicator Demo
37+
</string>
3438
<string name="cat_progress_indicator_description"
3539
description="Body text describing the MaterialProgressIndicator widget within the design system [CHAR LIMIT=NONE]">
3640
ProgressIndicator shows the progress of an undergoing process.
@@ -41,27 +45,27 @@
4145

4246
<string name="cat_progress_indicator_track_thickness"
4347
description="Text label above a slider for adjusting indicators' track thickness [CHAR LIMIT=NONE]">
44-
Track Thickness (1-15) dp
48+
Track Thickness (1 - 15) dp
4549
</string>
4650
<string name="cat_progress_indicator_corner_size"
4751
description="Text label above a slider for adjusting indicators' corner size [CHAR LIMIT=NONE]">
48-
Corner Size (0-5) dp
52+
Corner Size (0 - 5) dp
4953
</string>
5054
<string name="cat_progress_indicator_gap_size"
5155
description="Text label above a slider for adjusting indicators' gap size [CHAR LIMIT=NONE]">
52-
Gap Size (0-10) dp
56+
Gap Size (0 - 10) dp
5357
</string>
5458
<string name="cat_progress_indicator_reverse_direction"
5559
description="Switch label for reversing indicators' direction [CHAR LIMIT=NONE]">
5660
Inverse Direction
5761
</string>
5862
<string name="cat_progress_indicator_linear_stop_indicator_size"
5963
description="Text label above a slider for adjusting stop indicator size in linear progress indicator [CHAR LIMIT=NONE]">
60-
Linear Stop Indicator Size (0-10) dp
64+
Linear Stop Indicator Size (0 - 10) dp
6165
</string>
6266
<string name="cat_progress_indicator_circular_indicator_size"
6367
description="Text label above a slider for adjusting circular indicator's size [CHAR LIMIT=NONE]">
64-
Circular Indicator Size (20-200) dp
68+
Circular Indicator Size (20 - 200) dp
6569
</string>
6670
<string name="cat_progress_indicator_hide_behavior"
6771
description="Hint label of a dropdown to select hide behavior [CHAR LIMIT=NONE]">
@@ -85,12 +89,20 @@
8589
</string>
8690
<string name="cat_progress_indicator_determinate_progress"
8791
description="Text label above a slider for changing indicators' progress [CHAR LIMIT=NONE]">
88-
Progress (0-100)
92+
Progress (0 - 100)
8993
</string>
9094
<string name="cat_progress_indicator_set_to_determinate_mode"
9195
description="Set the displayed progress indicators to the determinate mode. [CHAR LIMIT=NONE]">
9296
Determinate Mode
9397
</string>
98+
<string name="cat_progress_indicator_wave_amplitude"
99+
description="Text label above a slider for changing indicators' amplitude [CHAR LIMIT=NONE]">
100+
Amplitude (0 - 30) dp
101+
</string>
102+
<string name="cat_progress_indicator_wave_length"
103+
description="Text label above a slider for changing indicators' wavelength [CHAR LIMIT=NONE]">
104+
Wave length (0 - 100) dp
105+
</string>
94106

95107
<!-- Descriptions of various examples of progress indicators -->
96108

0 commit comments

Comments
 (0)