Add StandardToggleChip (#1283)

google · May 16, 2023 · 1e80d3e · 1e80d3e
1 parent a9d870c
commit 1e80d3e
Show file tree

Hide file tree

Showing 19 changed files with 649 additions and 0 deletions.
diff --git a/base-ui/api/current.api b/base-ui/api/current.api
@@ -70,6 +70,18 @@ package com.google.android.horologist.base.ui.components {
     method @androidx.compose.runtime.Composable public static void StandardIcon(androidx.compose.ui.graphics.vector.ImageVector imageVector, String? contentDescription, optional androidx.compose.ui.Modifier modifier, optional com.google.android.horologist.base.ui.components.IconRtlMode rtlMode);
   }
 
+  public final class StandardToggleChipKt {
+    method @androidx.compose.runtime.Composable @com.google.android.horologist.annotations.ExperimentalHorologistApi public static void StandardToggleChip(boolean checked, kotlin.jvm.functions.Function1<? super java.lang.Boolean,kotlin.Unit> onCheckedChange, String label, com.google.android.horologist.base.ui.components.StandardToggleChipToggleControl toggleControl, optional androidx.compose.ui.Modifier modifier, optional androidx.compose.ui.graphics.vector.ImageVector? icon, optional String? secondaryLabel, optional androidx.wear.compose.material.ToggleChipColors colors, optional boolean enabled, optional androidx.compose.foundation.interaction.MutableInteractionSource interactionSource);
+  }
+
+  public enum StandardToggleChipToggleControl {
+    method public static com.google.android.horologist.base.ui.components.StandardToggleChipToggleControl valueOf(String name) throws java.lang.IllegalArgumentException;
+    method public static com.google.android.horologist.base.ui.components.StandardToggleChipToggleControl[] values();
+    enum_constant public static final com.google.android.horologist.base.ui.components.StandardToggleChipToggleControl Checkbox;
+    enum_constant public static final com.google.android.horologist.base.ui.components.StandardToggleChipToggleControl Radio;
+    enum_constant public static final com.google.android.horologist.base.ui.components.StandardToggleChipToggleControl Switch;
+  }
+
   public final class TitleKt {
     method @androidx.compose.runtime.Composable @com.google.android.horologist.annotations.ExperimentalHorologistApi public static void Title(@StringRes int textId, optional androidx.compose.ui.Modifier modifier);
     method @androidx.compose.runtime.Composable @com.google.android.horologist.annotations.ExperimentalHorologistApi public static void Title(String text, optional androidx.compose.ui.Modifier modifier);

diff --git a/...ava/com/google/android/horologist/base/ui/components/StandardToggleChipOverflowPreview.kt b/...ava/com/google/android/horologist/base/ui/components/StandardToggleChipOverflowPreview.kt
@@ -0,0 +1,86 @@
+/*
+ * 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.google.android.horologist.base.ui.components
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Image
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.tooling.preview.Preview
+
+@Preview(
+    name = "With long text",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipOverflowPreviewWithLongText() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label very very very very very very very very very very very very very very very very very long text",
+        toggleControl = StandardToggleChipToggleControl.Switch
+    )
+}
+
+@Preview(
+    name = "With icon and long text",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipOverflowPreviewWithIconAndLongText() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label very very very very very very very very very very very very very very very very very long text",
+        toggleControl = StandardToggleChipToggleControl.Switch,
+        icon = Icons.Default.Image
+    )
+}
+
+@Preview(
+    name = "With secondary label and long text",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipOverflowPreviewWithSecondaryLabelAndLongText() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label very very very very very very very very long text",
+        secondaryLabel = "Secondary label very very very very very very very very very long text",
+        toggleControl = StandardToggleChipToggleControl.Switch
+    )
+}
+
+@Preview(
+    name = "With icon, secondary label and long text",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipOverflowPreviewWithIconAndSecondaryLabelAndLongText() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label very very very very very very very very long text",
+        secondaryLabel = "Secondary label very very very very very very very very very long text",
+        toggleControl = StandardToggleChipToggleControl.Switch,
+        icon = Icons.Default.Image
+    )
+}
diff --git a/...ava/com/google/android/horologist/base/ui/components/StandardToggleChipVariantsPreview.kt b/...ava/com/google/android/horologist/base/ui/components/StandardToggleChipVariantsPreview.kt
@@ -0,0 +1,128 @@
+/*
+ * 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.google.android.horologist.base.ui.components
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Image
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.tooling.preview.Preview
+
+@Preview(
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipSwitchPreview() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label",
+        toggleControl = StandardToggleChipToggleControl.Switch
+    )
+}
+
+@Preview(
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipRadioPreview() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label",
+        toggleControl = StandardToggleChipToggleControl.Radio
+    )
+}
+
+@Preview(
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipCheckboxPreview() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label",
+        toggleControl = StandardToggleChipToggleControl.Checkbox
+    )
+}
+
+@Preview(
+    name = "With secondary label",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipWithSecondaryLabel() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label",
+        toggleControl = StandardToggleChipToggleControl.Switch,
+        secondaryLabel = "Secondary label"
+    )
+}
+
+@Preview(
+    name = "With icon",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipPreviewWithIcon() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label",
+        toggleControl = StandardToggleChipToggleControl.Switch,
+        icon = Icons.Default.Image
+    )
+}
+
+@Preview(
+    name = "With secondary label and icon",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipPreviewWithSecondaryLabelAndIcon() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label",
+        toggleControl = StandardToggleChipToggleControl.Switch,
+        secondaryLabel = "Secondary label"
+    )
+}
+
+@Preview(
+    name = "Disabled",
+    backgroundColor = 0xff000000,
+    showBackground = true
+)
+@Composable
+fun StandardToggleChipPreviewDisabled() {
+    StandardToggleChip(
+        checked = true,
+        onCheckedChange = { },
+        label = "Primary label",
+        toggleControl = StandardToggleChipToggleControl.Switch,
+        enabled = false
+    )
+}
diff --git a/base-ui/src/main/java/com/google/android/horologist/base/ui/components/StandardToggleChip.kt b/base-ui/src/main/java/com/google/android/horologist/base/ui/components/StandardToggleChip.kt
@@ -0,0 +1,135 @@
+/*
+ * 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.google.android.horologist.base.ui.components
+
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.BoxScope
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.RowScope
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.wear.compose.material.ChipDefaults
+import androidx.wear.compose.material.Icon
+import androidx.wear.compose.material.Text
+import androidx.wear.compose.material.ToggleChip
+import androidx.wear.compose.material.ToggleChipColors
+import androidx.wear.compose.material.ToggleChipDefaults
+import com.google.android.horologist.annotations.ExperimentalHorologistApi
+import com.google.android.horologist.base.ui.R
+import com.google.android.horologist.base.ui.util.DECORATIVE_ELEMENT_CONTENT_DESCRIPTION
+
+/**
+ * This composable fulfils the redlines of the following components:
+ * - Toggle chips
+ */
+@ExperimentalHorologistApi
+@Composable
+public fun StandardToggleChip(
+    checked: Boolean,
+    onCheckedChange: (Boolean) -> Unit,
+    label: String,
+    toggleControl: StandardToggleChipToggleControl,
+    modifier: Modifier = Modifier,
+    icon: ImageVector? = null,
+    secondaryLabel: String? = null,
+    colors: ToggleChipColors = ToggleChipDefaults.toggleChipColors(),
+    enabled: Boolean = true,
+    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }
+) {
+    val hasSecondaryLabel = secondaryLabel != null
+    val hasIcon = icon != null
+
+    val labelParam: (@Composable RowScope.() -> Unit) =
+        {
+            Text(
+                text = label,
+                modifier = Modifier.fillMaxWidth(),
+                textAlign = if (hasSecondaryLabel || hasIcon) TextAlign.Left else TextAlign.Center,
+                overflow = TextOverflow.Ellipsis,
+                maxLines = if (hasSecondaryLabel) 1 else 2
+            )
+        }
+
+    val secondaryLabelParam: (@Composable RowScope.() -> Unit)? =
+        secondaryLabel?.let {
+            {
+                Text(
+                    text = secondaryLabel,
+                    overflow = TextOverflow.Ellipsis,
+                    maxLines = 1
+                )
+            }
+        }
+
+    val toggleControlParam: (@Composable () -> Unit) = {
+        Icon(
+            imageVector = when (toggleControl) {
+                StandardToggleChipToggleControl.Switch -> ToggleChipDefaults.switchIcon(checked)
+                StandardToggleChipToggleControl.Radio -> ToggleChipDefaults.radioIcon(checked)
+                StandardToggleChipToggleControl.Checkbox -> ToggleChipDefaults.checkboxIcon(checked)
+            },
+            contentDescription = stringResource(
+                if (checked) {
+                    R.string.horologist_standard_toggle_chip_on_content_description
+                } else {
+                    R.string.horologist_standard_toggle_chip_off_content_description
+                }
+            )
+        )
+    }
+
+    val iconParam: (@Composable BoxScope.() -> Unit)? =
+        icon?.let {
+            {
+                Row {
+                    Icon(
+                        imageVector = icon,
+                        contentDescription = DECORATIVE_ELEMENT_CONTENT_DESCRIPTION,
+                        modifier = Modifier
+                            .size(ChipDefaults.IconSize)
+                            .clip(CircleShape)
+                    )
+                }
+            }
+        }
+
+    ToggleChip(
+        checked = checked,
+        onCheckedChange = onCheckedChange,
+        label = labelParam,
+        toggleControl = toggleControlParam,
+        modifier = modifier,
+        appIcon = iconParam,
+        secondaryLabel = secondaryLabelParam,
+        colors = colors,
+        enabled = enabled,
+        interactionSource = interactionSource
+    )
+}
+
+public enum class StandardToggleChipToggleControl {
+    Switch, Radio, Checkbox
+}
diff --git a/base-ui/src/main/res/values/strings.xml b/base-ui/src/main/res/values/strings.xml
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright 2022 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.
+  -->
+
+<resources>
+    <string description="Content description of the StandardToggleChip. It lets the user know if the toggle is checked or not. [CHAR_LIMIT=NONE]" name="horologist_standard_toggle_chip_on_content_description">On</string>
+    <string description="Content description of the StandardToggleChip. It lets the user know if the toggle is checked or not. [CHAR_LIMIT=NONE]" name="horologist_standard_toggle_chip_off_content_description">Off</string>
+</resources>