Skip to content

Commit 29ce8d3

Browse files
pekingmeimhappi
pekingme
authored and
imhappi
committed
[ButtonGroup] Added a new component ButtonGroup.
PiperOrigin-RevId: 666359073
1 parent 00e1e4b commit 29ce8d3

19 files changed

+1454
-516
lines changed

‎catalog/java/io/material/catalog/button/ButtonGroupDemoFragment.java

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
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.button;
17+
18+
import io.material.catalog.R;
19+
20+
import static android.widget.LinearLayout.HORIZONTAL;
21+
import static android.widget.LinearLayout.VERTICAL;
22+
23+
import android.os.Bundle;
24+
import android.view.LayoutInflater;
25+
import android.view.View;
26+
import android.view.ViewGroup;
27+
import android.view.ViewGroup.LayoutParams;
28+
import androidx.annotation.NonNull;
29+
import androidx.annotation.Nullable;
30+
import com.google.android.material.button.MaterialButton;
31+
import com.google.android.material.button.MaterialButtonGroup;
32+
import com.google.android.material.materialswitch.MaterialSwitch;
33+
import io.material.catalog.feature.DemoFragment;
34+
import io.material.catalog.feature.DemoUtils;
35+
import java.util.List;
36+
37+
/** A fragment that displays a button group demo for the Catalog app. */
38+
public class ButtonGroupDemoFragment extends DemoFragment {
39+
40+
private int defaultInset;
41+
42+
/** Create a Demo View with different types of {@link MaterialButtonGroup}. */
43+
@Nullable
44+
@Override
45+
public View onCreateDemoView(
46+
@NonNull LayoutInflater layoutInflater,
47+
@Nullable ViewGroup viewGroup,
48+
@Nullable Bundle bundle) {
49+
View view =
50+
layoutInflater.inflate(
51+
R.layout.cat_buttons_group_fragment, viewGroup, /* attachToRoot= */ false);
52+
List<MaterialButtonGroup> buttonGroups =
53+
DemoUtils.findViewsWithType(view, MaterialButtonGroup.class);
54+
55+
defaultInset = getResources().getDimensionPixelSize(R.dimen.mtrl_btn_inset);
56+
57+
MaterialSwitch verticalOrientationToggle = view.findViewById(R.id.orientation_switch_toggle);
58+
verticalOrientationToggle.setOnCheckedChangeListener(
59+
(buttonView, isChecked) -> {
60+
for (MaterialButtonGroup buttonGroup : buttonGroups) {
61+
int orientation = isChecked ? VERTICAL : HORIZONTAL;
62+
buttonGroup.setOrientation(orientation);
63+
for (int i = 0; i < buttonGroup.getChildCount(); ++i) {
64+
int inset = getInsetForOrientation(orientation);
65+
MaterialButton button = (MaterialButton) buttonGroup.getChildAt(i);
66+
button.setInsetBottom(inset);
67+
button.setInsetTop(inset);
68+
adjustParams(button.getLayoutParams(), orientation);
69+
}
70+
71+
buttonGroup.requestLayout();
72+
}
73+
});
74+
75+
MaterialSwitch groupEnabledToggle = view.findViewById(R.id.switch_enable);
76+
groupEnabledToggle.setOnCheckedChangeListener(
77+
(buttonView, isChecked) -> {
78+
for (MaterialButtonGroup buttonGroup : buttonGroups) {
79+
// Enable the button group if enable toggle is checked.
80+
buttonGroup.setEnabled(isChecked);
81+
}
82+
});
83+
return view;
84+
}
85+
86+
private int getInsetForOrientation(int orientation) {
87+
return orientation == VERTICAL ? 0 : defaultInset;
88+
}
89+
90+
private static void adjustParams(LayoutParams layoutParams, int orientation) {
91+
layoutParams.width =
92+
orientation == VERTICAL ? LayoutParams.MATCH_PARENT : LayoutParams.WRAP_CONTENT;
93+
}
94+
}

‎catalog/java/io/material/catalog/button/ButtonsFragment.java

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,13 @@ public Fragment createFragment() {
5757
@Override
5858
public List<Demo> getAdditionalDemos() {
5959
return Arrays.asList(
60+
new Demo(R.string.cat_buttons_group) {
61+
@Nullable
62+
@Override
63+
public Fragment createFragment() {
64+
return new ButtonGroupDemoFragment();
65+
}
66+
},
6067
new Demo(R.string.cat_buttons_toggle_group) {
6168
@Nullable
6269
@Override

‎catalog/java/io/material/catalog/button/res/layout/cat_buttons_group_fragment.xml

Lines changed: 171 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,171 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
Copyright 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+
18+
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
19+
xmlns:app="http://schemas.android.com/apk/res-auto"
20+
android:layout_width="match_parent"
21+
android:layout_height="match_parent"
22+
android:layout_gravity="center_vertical">
23+
<LinearLayout
24+
android:layout_width="match_parent"
25+
android:layout_height="wrap_content"
26+
android:paddingTop="8dp"
27+
android:paddingHorizontal="8dp"
28+
android:gravity="center_horizontal"
29+
android:orientation="vertical">
30+
<TextView
31+
android:layout_width="wrap_content"
32+
android:layout_height="wrap_content"
33+
android:paddingTop="16dp"
34+
android:paddingBottom="8dp"
35+
android:text="@string/cat_icon_only"
36+
android:textAppearance="?attr/textAppearanceSubtitle1"/>
37+
<com.google.android.material.button.MaterialButtonGroup
38+
android:layout_width="match_parent"
39+
android:layout_height="wrap_content"
40+
android:gravity="center_horizontal"
41+
android:spacing="0dp">
42+
<Button
43+
style="?attr/materialIconButtonFilledTonalStyle"
44+
android:layout_width="wrap_content"
45+
android:layout_height="wrap_content"
46+
android:contentDescription="@string/cat_icon_button_label_paint_bucket"
47+
app:icon="@drawable/ic_colors_24px"
48+
app:iconPadding="0dp"/>
49+
<Button
50+
style="?attr/materialIconButtonFilledTonalStyle"
51+
android:layout_width="wrap_content"
52+
android:layout_height="wrap_content"
53+
android:contentDescription="@string/cat_icon_button_label_plus"
54+
app:icon="@drawable/ic_fab_24px"
55+
app:iconPadding="0dp"/>
56+
<Button
57+
style="?attr/materialIconButtonFilledTonalStyle"
58+
android:layout_width="wrap_content"
59+
android:layout_height="wrap_content"
60+
android:contentDescription="@string/cat_icon_button_label_components"
61+
app:icon="@drawable/ic_components_24px"
62+
app:iconPadding="0dp"/>
63+
<Button
64+
style="?attr/materialIconButtonFilledTonalStyle"
65+
android:layout_width="wrap_content"
66+
android:layout_height="wrap_content"
67+
android:contentDescription="@string/cat_icon_button_label_accelerator"
68+
app:icon="@drawable/ic_accelerator_24px"
69+
app:iconPadding="0dp"/>
70+
<Button
71+
style="?attr/materialIconButtonFilledTonalStyle"
72+
android:layout_width="wrap_content"
73+
android:layout_height="wrap_content"
74+
android:contentDescription="@string/cat_icon_button_label_dialog"
75+
app:icon="@drawable/ic_dialogs_24px"
76+
app:iconPadding="0dp"/>
77+
</com.google.android.material.button.MaterialButtonGroup>
78+
<TextView
79+
android:layout_width="wrap_content"
80+
android:layout_height="wrap_content"
81+
android:paddingTop="16dp"
82+
android:paddingBottom="8dp"
83+
android:text="@string/cat_label_only"
84+
android:textAppearance="?attr/textAppearanceSubtitle1"/>
85+
<com.google.android.material.button.MaterialButtonGroup
86+
android:layout_width="wrap_content"
87+
android:layout_height="wrap_content"
88+
android:gravity="center_horizontal"
89+
android:spacing="8dp">
90+
<Button
91+
android:layout_width="wrap_content"
92+
android:layout_height="wrap_content"
93+
android:text="@string/cat_button_label_cheese"/>
94+
<Button
95+
android:layout_width="wrap_content"
96+
android:layout_height="wrap_content"
97+
android:text="@string/cat_button_label_tomatoes"/>
98+
<Button
99+
android:layout_width="wrap_content"
100+
android:layout_height="wrap_content"
101+
android:text="@string/cat_button_label_mushrooms"/>
102+
</com.google.android.material.button.MaterialButtonGroup>
103+
<TextView
104+
android:layout_width="wrap_content"
105+
android:layout_height="wrap_content"
106+
android:paddingTop="16dp"
107+
android:paddingBottom="8dp"
108+
android:text="@string/cat_icon_and_label_mixed"
109+
android:textAppearance="?attr/textAppearanceSubtitle1"/>
110+
<com.google.android.material.button.MaterialButtonGroup
111+
android:layout_width="wrap_content"
112+
android:layout_height="wrap_content"
113+
android:spacing="0dp">
114+
<Button
115+
style="?attr/materialIconButtonOutlinedStyle"
116+
android:layout_width="wrap_content"
117+
android:layout_height="wrap_content"
118+
android:contentDescription="@string/cat_icon_button_label_paint_bucket"
119+
app:icon="@drawable/ic_colors_24px"
120+
app:iconPadding="0dp"/>
121+
<Button
122+
style="?attr/materialIconButtonOutlinedStyle"
123+
android:layout_width="wrap_content"
124+
android:layout_height="wrap_content"
125+
android:contentDescription="@string/cat_icon_button_label_plus"
126+
app:icon="@drawable/ic_fab_24px"
127+
app:iconPadding="0dp"/>
128+
<Button
129+
style="?attr/materialIconButtonOutlinedStyle"
130+
android:layout_width="wrap_content"
131+
android:layout_height="wrap_content"
132+
android:contentDescription="@string/cat_icon_button_label_components"
133+
app:icon="@drawable/ic_components_24px"
134+
app:iconPadding="0dp"
135+
android:text="@string/cat_button_label_custom"/>
136+
<Button
137+
style="?attr/materialIconButtonOutlinedStyle"
138+
android:layout_width="wrap_content"
139+
android:layout_height="wrap_content"
140+
android:contentDescription="@string/cat_icon_button_label_accelerator"
141+
app:icon="@drawable/ic_accelerator_24px"
142+
app:iconPadding="0dp"/>
143+
<Button
144+
style="?attr/materialIconButtonOutlinedStyle"
145+
android:layout_width="wrap_content"
146+
android:layout_height="wrap_content"
147+
android:contentDescription="@string/cat_icon_button_label_dialog"
148+
app:icon="@drawable/ic_dialogs_24px"
149+
app:iconPadding="0dp"/>
150+
</com.google.android.material.button.MaterialButtonGroup>
151+
152+
<com.google.android.material.materialswitch.MaterialSwitch
153+
android:id="@+id/orientation_switch_toggle"
154+
android:paddingTop="16dp"
155+
android:layout_width="wrap_content"
156+
android:layout_height="match_parent"
157+
android:layout_gravity="center"
158+
android:checked="false"
159+
android:enabled="true"
160+
android:text="@string/cat_button_vertical_orientation" />
161+
<com.google.android.material.materialswitch.MaterialSwitch
162+
android:id="@+id/switch_enable"
163+
android:paddingTop="16dp"
164+
android:layout_width="wrap_content"
165+
android:layout_height="match_parent"
166+
android:layout_gravity="center"
167+
android:checked="true"
168+
android:enabled="true"
169+
android:text="@string/cat_button_enable" />
170+
</LinearLayout>
171+
</ScrollView>

‎catalog/java/io/material/catalog/button/res/layout/cat_buttons_toggle_group_fragment.xml

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -148,45 +148,45 @@
148148
</com.google.android.material.button.MaterialButtonToggleGroup>
149149

150150
<TextView
151-
android:layout_width="wrap_content"
152-
android:layout_height="wrap_content"
153-
android:text="@string/cat_inner_corner_size_label"/>
151+
android:layout_width="wrap_content"
152+
android:layout_height="wrap_content"
153+
android:text="@string/cat_inner_corner_size_label" />
154154

155155
<com.google.android.material.slider.Slider
156-
android:id="@+id/innerCornerSizeSlider"
157-
android:layout_width="match_parent"
158-
android:layout_height="wrap_content"
159-
android:valueFrom="0"
160-
android:valueTo="50"/>
156+
android:id="@+id/innerCornerSizeSlider"
157+
android:layout_width="match_parent"
158+
android:layout_height="wrap_content"
159+
android:valueFrom="0"
160+
android:valueTo="50" />
161161

162162
<TextView
163-
android:layout_width="wrap_content"
164-
android:layout_height="wrap_content"
165-
android:text="@string/cat_spacing_label"/>
163+
android:layout_width="wrap_content"
164+
android:layout_height="wrap_content"
165+
android:text="@string/cat_spacing_label"/>
166166

167167
<com.google.android.material.slider.Slider
168-
android:id="@+id/spacingSlider"
169-
android:layout_width="match_parent"
170-
android:layout_height="wrap_content"
171-
android:valueFrom="0"
172-
android:valueTo="20"/>
168+
android:id="@+id/spacingSlider"
169+
android:layout_width="match_parent"
170+
android:layout_height="wrap_content"
171+
android:valueFrom="0"
172+
android:valueTo="20"/>
173173

174174
<com.google.android.material.materialswitch.MaterialSwitch
175-
android:id="@+id/switch_toggle"
176-
android:paddingTop="16dp"
177-
android:layout_width="wrap_content"
178-
android:layout_height="match_parent"
179-
android:layout_gravity="center"
180-
android:checked="false"
181-
android:enabled="true"
182-
android:text="@string/cat_button_require_selection" />
175+
android:id="@+id/switch_toggle"
176+
android:paddingTop="16dp"
177+
android:layout_width="wrap_content"
178+
android:layout_height="match_parent"
179+
android:layout_gravity="center"
180+
android:checked="false"
181+
android:enabled="true"
182+
android:text="@string/cat_button_require_selection" />
183183

184184
<com.google.android.material.materialswitch.MaterialSwitch
185185
android:id="@+id/orientation_switch_toggle"
186-
android:paddingTop="16dp"
187186
android:layout_width="wrap_content"
188187
android:layout_height="match_parent"
189188
android:layout_gravity="center"
189+
android:paddingTop="16dp"
190190
android:checked="false"
191191
android:enabled="true"
192192
android:text="@string/cat_button_vertical_orientation" />

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

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
<resources>
1919

2020
<string name="cat_toc_buttons">Buttons</string>
21+
<string name="cat_buttons_group" translatable="false">Buttons Group</string>
2122
<string name="cat_buttons_toggle_group">Buttons Toggle Group</string>
2223
<string name="cat_buttons_title">Buttons</string>
2324
<string name="cat_buttons_description">
@@ -72,7 +73,9 @@
7273

7374
<string name="cat_single_select">Single-select</string>
7475
<string name="cat_multi_select">Multi-select</string>
75-
<string name="cat_icon_only">Icon only</string>
76+
<string name="cat_icon_only" description="A label for icon only buttons below. [CHAR LIMIT=NONE]">Icon only</string>
77+
<string name="cat_label_only" description="A label for lebal only buttons below. [CHAR LIMIT=NONE]">Label only</string>
78+
<string name="cat_icon_and_label_mixed" description="A label for icon and label mixed buttons below. [CHAR LIMIT=NONE]">Icon and label mixed</string>
7679
<string description="A label for a spacing slider [CHAR LIMIT=NONE]"
7780
name="cat_spacing_label">Spacing (dp)</string>
7881
<string description="A label for an inner corner size slider [CHAR LIMIT=NONE]"

0 commit comments

Comments
 (0)