Skip to content

Commit 71f014f

Browse files
hunterstichhunterstich
committed
[Snackbar] Added optional close icon
PiperOrigin-RevId: 845256053
1 parent d5934ee commit 71f014f

File tree

19 files changed

+343
-22
lines changed

19 files changed

+343
-22
lines changed

‎catalog/java/io/material/catalog/snackbar/SnackbarMainDemoFragment.java‎

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
import io.material.catalog.R;
2020

2121
import android.content.Context;
22+
import android.graphics.Color;
2223
import android.os.Bundle;
2324
import android.view.ContextThemeWrapper;
2425
import android.view.LayoutInflater;
@@ -89,6 +90,7 @@ public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceStat
8990
Snackbar.LENGTH_SHORT)
9091
.setAction(R.string.cat_snackbar_action_title, a -> {})
9192
.setTextMaxLines(5)
93+
.setCloseIconVisible(true)
9294
.show();
9395
});
9496

@@ -103,12 +105,39 @@ public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceStat
103105
Context c =
104106
new ContextThemeWrapper(
105107
v.getContext(), R.style.ThemeOverlay_Catalog_SnackbarWithCustomShape);
106-
Snackbar.make(
108+
Snackbar snackbar = Snackbar.make(
107109
c,
108110
coordinatorLayout,
109111
getString(R.string.cat_snackbar_custom_shape_message),
110112
Snackbar.LENGTH_SHORT)
111113
.setAction("Done", a -> {})
114+
.setCloseIconVisible(/* visible= */ true)
115+
.setCloseIconResource(R.drawable.ic_cancel_24)
116+
.setCloseIconTint(Color.GREEN);
117+
// Setting the close icon to visible removes the snackbar layout's end padding. To
118+
// customize this, get the snackbar's view and set the end padding to a value
119+
// that fits nicely with the custom shape and icon.
120+
View snackbarLayout = snackbar.getView();
121+
snackbarLayout.setPaddingRelative(
122+
snackbarLayout.getPaddingStart(),
123+
snackbarLayout.getPaddingTop(),
124+
getResources().getDimensionPixelSize(
125+
R.dimen.cat_snackbar_custom_shape_end_padding),
126+
snackbarLayout.getPaddingBottom()
127+
);
128+
snackbar.show();
129+
});
130+
131+
// Snackbar with close icon
132+
view.findViewById(R.id.with_close_button)
133+
.setOnClickListener(
134+
v -> {
135+
Snackbar.make(
136+
coordinatorLayout,
137+
R.string.cat_snackbar_with_close_message,
138+
Snackbar.LENGTH_INDEFINITE)
139+
.setAction(R.string.cat_snackbar_action_title, a -> {})
140+
.setCloseIconVisible(true)
112141
.show();
113142
});
114143
}

‎catalog/java/io/material/catalog/snackbar/res/drawable/ic_cancel_24.xml‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
3+
<!--
4+
Copyright 2025 The Android Open Source Project
5+
6+
Licensed under the Apache License, Version 2.0 (the "License");
7+
you may not use this file except in compliance with the License.
8+
You may obtain a copy of the License at
9+
10+
http://www.apache.org/licenses/LICENSE-2.0
11+
12+
Unless required by applicable law or agreed to in writing, software
13+
distributed under the License is distributed on an "AS IS" BASIS,
14+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15+
See the License for the specific language governing permissions and
16+
limitations under the License.
17+
-->
18+
19+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
20+
android:width="24dp"
21+
android:height="24dp"
22+
android:viewportWidth="960"
23+
android:viewportHeight="960">
24+
<path
25+
android:fillColor="@android:color/white"
26+
android:pathData="M480,554L582.22,656.22Q597.22,671.22 618.93,671.22Q640.65,671.22 656.22,655.74Q671.78,640.27 671.78,618.74Q671.78,597.22 656.22,581.65L554,480L656.22,377.78Q671.22,362.78 671.5,341.07Q671.78,319.35 656.31,303.78Q640.83,288.22 619.31,288.22Q597.78,288.22 582.22,303.78L480,406L377.78,303.78Q362.78,288.78 341.35,288.5Q319.91,288.22 304.35,303.69Q288.78,319.17 288.78,340.69Q288.78,362.22 304.35,377.78L406,480L303.78,582.22Q288.78,597.22 288.78,618.65Q288.78,640.09 304.26,655.65Q319.73,671.22 341.26,671.22Q362.78,671.22 378.35,655.65L480,554ZM480,919.91Q388.66,919.91 308.13,885.61Q227.59,851.31 168.14,791.86Q108.69,732.41 74.39,651.87Q40.09,571.34 40.09,480Q40.09,388.41 74.45,307.93Q108.81,227.45 168.45,167.85Q228.1,108.25 308.44,74.17Q388.78,40.09 480,40.09Q571.58,40.09 652.08,74.16Q732.57,108.23 792.17,167.83Q851.77,227.43 885.84,307.95Q919.91,388.47 919.91,480.08Q919.91,571.7 885.83,651.8Q851.75,731.9 792.15,791.55Q732.55,851.19 652.07,885.55Q571.59,919.91 480,919.91ZM479.87,796.96Q613.12,796.96 705.04,705.17Q796.96,613.38 796.96,480.13Q796.96,346.88 705.17,254.96Q613.38,163.04 480.13,163.04Q346.88,163.04 254.96,254.83Q163.04,346.62 163.04,479.87Q163.04,613.12 254.83,705.04Q346.62,796.96 479.87,796.96ZM480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Q480,480 480,480Z"/>
27+
</vector>

‎catalog/java/io/material/catalog/snackbar/res/layout/cat_snackbar_main_demo_fragment.xml‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,11 @@
5252
android:layout_width="wrap_content"
5353
android:layout_height="wrap_content"
5454
android:text="@string/cat_snackbar_custom_shape_button"/>
55+
<Button
56+
android:id="@+id/with_close_button"
57+
android:layout_width="wrap_content"
58+
android:layout_height="wrap_content"
59+
android:text="@string/cat_snackbar_with_close_button"/>
5560
</LinearLayout>
5661

5762
</androidx.coordinatorlayout.widget.CoordinatorLayout>

‎catalog/java/io/material/catalog/snackbar/res/values/dimens.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 2025 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+
<resources>
19+
<dimen name="cat_snackbar_custom_shape_end_padding">12dp</dimen>
20+
</resources>

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

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,13 @@
5959
Custom shape snackbar
6060
</string>
6161
<string name="cat_snackbar_custom_shape_message" description="The message of the snackbar with a custom background shape. [CHAR LIMIT=NONE]">
62-
This is a snackbar with a custom shape
62+
This is a snackbar with a custom shape with a customized close icon
63+
</string>
64+
65+
<string name="cat_snackbar_with_close_button" description="The label of the button that launches a snackbar with a custom background shape. [CHAR LIMIT=NONE]">
66+
Snackbar with close icon
67+
</string>
68+
<string name="cat_snackbar_with_close_message" description="The message of the snackbar with a custom background shape. [CHAR LIMIT=NONE]">
69+
This is a snackbar with a close icon.
6370
</string>
6471
</resources>

‎catalog/java/io/material/catalog/snackbar/res/values/styles.xml‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,12 @@
1616
-->
1717

1818
<resources>
19-
<style name="ThemeOverlay.Catalog.SnackbarWithCustomShape" parent="Theme.Catalog">
19+
<style name="ThemeOverlay.Catalog.SnackbarWithCustomShape" parent="">
2020
<item name="snackbarStyle">@style/Widget.Catalog.Snackbar.PillShape</item>
2121
</style>
2222
<style name="Widget.Catalog.Snackbar.PillShape" parent="Widget.Material3.Snackbar">
2323
<item name="shapeAppearance">@style/ShapeAppearance.Material3.Corner.Full</item>
24+
<item name="android:paddingStart">24dp</item>
25+
<item name="android:paddingEnd">12dp</item>
2426
</style>
2527
</resources>

‎docs/components/Snackbar.md‎

Lines changed: 26 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -71,13 +71,22 @@ Element | Attribute | Related method(s) | Defau
7171
**Text color alpha** | `app:actionTextColorAlpha` | N/A | `1.0f`
7272
**Text Color** | `android:textColor` | `setTextActionColor` | `?attr/colorPrimaryInverse`
7373

74+
### Close attributes
75+
76+
Element | Attribute | Related method(s) | Default value
77+
-------------------------- |----------------|------------------------| -------------
78+
**Close button style** | N/A | N/A | `?attr/snackbarCloseButtonStyle`
79+
**Icon tint** | `app:iconTint` | `setCloseIconTint` | `?attr/colorOnSurfaceInverse`
80+
**Icon** | `app:icon` | `setCloseIconResource` | `@drawable/mtrl_close_24px`
81+
7482
### Styles
7583

76-
Element | Theme attribute | Default value
77-
----------------------- | ----------------------------- | -----------------
78-
**Default style** | `?attr/snackbarStyle` | `@style/Widget.Material3.Snackbar`
79-
**Action button style** | `?attr/snackbarButtonStyle` | `@style/Widget.Material3.Button.TextButton.Snackbar`
80-
**Text label style** | `?attr/snackbarTextViewStyle` | `@style/Widget.Material3.Snackbar.TextView`
84+
Element | Theme attribute | Default value
85+
------------------------- |----------------------------------| -----------------
86+
**Default style** | `?attr/snackbarStyle` | `@style/Widget.Material3.Snackbar`
87+
**Action button style** | `?attr/snackbarButtonStyle` | `@style/Widget.Material3.Button.TextButton.Snackbar`
88+
**Text label style** | `?attr/snackbarTextViewStyle` | `@style/Widget.Material3.Snackbar.TextView`
89+
**Close button style** | `?attr/snackbarCloseButtonStyle` | `@style/Widget.Material3.Button.IconButton.Close.Snackbar`
8190

8291
For the full list, see
8392
[styles](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/snackbar/res/values/styles.xml)
@@ -196,6 +205,18 @@ Snackbar.make(contextView, R.string.text_label, Snackbar.LENGTH_LONG)
196205
.show()
197206
```
198207

208+
### Adding a close button
209+
210+
To add a close button to the end of the snackbar, use the `setCloseIconVisible`
211+
method on the object returned from `make`. Snackbars are automatically dismissed
212+
when the close button is clicked.
213+
214+
```kt
215+
Snackbar.make(contextView, R.string.text_label, Snackbar.LENGTH_INDEFINITE)
216+
.setCloseIconVisible(true)
217+
.show()
218+
```
219+
199220
## Customizing snackbar
200221

201222
### Theming snackbar

‎lib/java/com/google/android/material/button/res/drawable/mtrl_close_24px.xml‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
Copyright 2025 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+
https://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+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
19+
android:width="24dp"
20+
android:height="24dp"
21+
android:viewportWidth="24.0"
22+
android:viewportHeight="24.0"
23+
android:tint="?attr/colorControlNormal">
24+
<path
25+
android:fillColor="@android:color/white"
26+
android:pathData="M19,6.41L17.59,5 12,10.59 6.41,5 5,6.41 10.59,12 5,17.59 6.41,19 12,13.41 17.59,19 19,17.59 13.41,12z"/>
27+
</vector>

‎lib/java/com/google/android/material/button/res/values/strings.xml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,4 +20,5 @@
2020
<string name="mtrl_button_collapsed_content_description" description="An announcement for the collapsed menu state of the trailing button in split button [CHAR LIMIT=NONE]">Collapsed</string>
2121
<!-- Content description for the overflow button. -->
2222
<string name="mtrl_button_overflow_icon_content_description" description="Content description for the overflow button of the button group. [CHAR LIMIT=NONE]">Overflow menu</string>
23+
<string name="mtrl_button_snackbar_close_content_description" description="Content description for the close button of the Snackbar. [CHAR LIMIT=NONE]">Close</string>
2324
</resources>

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

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -729,6 +729,15 @@
729729
<item name="materialThemeOverlay">@style/ThemeOverlay.Material3.Button.TextButton.Snackbar</item>
730730
</style>
731731

732+
<style name="Widget.Material3.Button.IconButton.Close.Snackbar" parent="Widget.Material3.Button.IconButton">
733+
<item name="android:minWidth">@dimen/mtrl_min_touch_target_size</item>
734+
<item name="android:paddingStart">12dp</item>
735+
<item name="android:paddingEnd">12dp</item>
736+
<item name="android:contentDescription">@string/mtrl_button_snackbar_close_content_description</item>
737+
<item name="icon">@drawable/mtrl_close_24px</item>
738+
<item name="iconTint">?attr/colorOnSurfaceInverse</item>
739+
</style>
740+
732741
<!-- M3 outlined button style. -->
733742
<style name="Widget.Material3.Button.OutlinedButton" parent="Widget.Material3.Button.TextButton">
734743
<item name="android:paddingLeft">@dimen/m3_btn_padding_left</item>
@@ -949,6 +958,14 @@
949958
<item name="android:textColor">?attr/colorPrimary</item>
950959
</style>
951960

961+
<style name="Widget.MaterialComponents.Button.TextButton.Icon.Close.Snackbar" parent="Widget.Material3.Button.TextButton.Icon">
962+
<item name="android:alpha">@dimen/material_emphasis_high_type</item>
963+
<item name="android:minWidth">@dimen/mtrl_min_touch_target_size</item>
964+
<item name="android:contentDescription">@string/mtrl_button_snackbar_close_content_description</item>
965+
<item name="icon">@drawable/mtrl_close_24px</item>
966+
<item name="iconTint">?attr/colorSurface</item>
967+
</style>
968+
952969
<style name="Widget.MaterialComponents.Button.OutlinedButton" parent="Widget.MaterialComponents.Button.TextButton">
953970
<item name="android:paddingLeft">@dimen/mtrl_btn_padding_left</item>
954971
<item name="android:paddingRight">@dimen/mtrl_btn_padding_right</item>

0 commit comments

Comments
 (0)