Adding badge examples (#277)

* Adding badge examples

* Apply Spotless

* Tweaks

* Moving conditional so there's always a BadgedBox

* Apply Spotless

---------

Co-authored-by: jakeroseman <[email protected]>

Author: jakeroseman

compose/snippets/src/main/java/com/example/compose/snippets/SnippetsActivity.kt

@@ -29,6 +29,7 @@ import androidx.navigation.compose.composable
 import androidx.navigation.compose.rememberNavController
 import com.example.compose.snippets.animations.AnimationExamplesScreen
 import com.example.compose.snippets.components.AppBarExamples
+import com.example.compose.snippets.components.BadgeExamples
 import com.example.compose.snippets.components.ButtonExamples
 import com.example.compose.snippets.components.CheckboxExamples
 import com.example.compose.snippets.components.ChipExamples
@@ -99,6 +100,7 @@ class SnippetsActivity : ComponentActivity() {
                                     }
                                     TopComponentsDestination.CheckboxExamples -> CheckboxExamples()
                                     TopComponentsDestination.DividerExamples -> DividerExamples()
+                                    TopComponentsDestination.BadgeExamples -> BadgeExamples()
                                 }
                             }
                         }

compose/snippets/src/main/java/com/example/compose/snippets/components/Badges.kt

@@ -0,0 +1,108 @@
+/*
+ * Copyright 2023 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package com.example.compose.snippets.components
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Mail
+import androidx.compose.material.icons.filled.ShoppingCart
+import androidx.compose.material3.Badge
+import androidx.compose.material3.BadgedBox
+import androidx.compose.material3.Button
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+
+@Preview
+@Composable
+fun BadgeExamples() {
+    Column(
+        modifier = Modifier
+            .padding(16.dp)
+            .fillMaxSize(),
+        verticalArrangement = Arrangement.spacedBy(32.dp),
+        horizontalAlignment = Alignment.CenterHorizontally,
+    ) {
+        Text("Minimal badge example", fontWeight = FontWeight.Bold)
+        BadgeExample()
+        Text("Badge number example", fontWeight = FontWeight.Bold)
+        BadgeInteractiveExample()
+    }
+}
+
+@Preview
+// [START android_compose_components_badge]
+@Composable
+fun BadgeExample() {
+    BadgedBox(
+        badge = {
+            Badge()
+        }
+    ) {
+        Icon(
+            imageVector = Icons.Filled.Mail,
+            contentDescription = "Email"
+        )
+    }
+}
+// [END android_compose_components_badge]
+
+@Preview
+// [START android_compose_components_badgeinteractive]
+@Composable
+fun BadgeInteractiveExample() {
+    var itemCount by remember { mutableStateOf(0) }
+
+    Column(
+        verticalArrangement = Arrangement.spacedBy(16.dp)
+    ) {
+        BadgedBox(
+            badge = {
+                if (itemCount > 0) {
+                    Badge(
+                        containerColor = Color.Red,
+                        contentColor = Color.White
+                    ) {
+                        Text("$itemCount")
+                    }
+                }
+            }
+        ) {
+            Icon(
+                imageVector = Icons.Filled.ShoppingCart,
+                contentDescription = "Shopping cart",
+            )
+        }
+        Button(onClick = { itemCount++ }) {
+            Text("Add item")
+        }
+    }
+}
+// [END android_compose_components_badgeinteractive]

compose/snippets/src/main/java/com/example/compose/snippets/navigation/Destination.kt

@@ -39,4 +39,5 @@ enum class TopComponentsDestination(val route: String, val title: String) {
     AppBarExamples("appBarExamples", "App bars"),
     CheckboxExamples("checkboxExamples", "Checkbox"),
     DividerExamples("dividerExamples", "Dividers"),
+    BadgeExamples("badgeExamples", "Badges"),
 }