[#254] Allow to customize radio buttons through bottom sheet

Orange-OpenSource · Sep 2, 2022 · f779ed8 · f779ed8
1 parent a2b03bc
commit f779ed8
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 39 deletions.
diff --git a/demo/src/main/java/com/orange/ods/demo/ui/components/radiobuttons/ComponentRadioButtons.kt b/demo/src/main/java/com/orange/ods/demo/ui/components/radiobuttons/ComponentRadioButtons.kt
@@ -16,55 +16,56 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.selection.selectableGroup
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.ExperimentalMaterialApi
+import androidx.compose.material.rememberBottomSheetScaffoldState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.dimensionResource
 import com.orange.ods.demo.R
+import com.orange.ods.demo.ui.components.utilities.ComponentCustomizationBottomSheetScaffold
 import com.orange.ods.demo.ui.utilities.composable.RadioButtonListItem
-import com.orange.ods.demo.ui.utilities.composable.Title
+import com.orange.ods.demo.ui.utilities.composable.SwitchListItem
 
 @ExperimentalMaterialApi
 @Composable
 fun ComponentRadioButtons() {
-    Column(
-        modifier = Modifier
-            .verticalScroll(rememberScrollState())
-            .padding(bottom = dimensionResource(id = R.dimen.spacing_m))
-    ) {
-        Title(textRes = R.string.component_radio_buttons_enabled, withHorizontalPadding = true)
-        RadioButtons(enabled = true)
+    val disabled = rememberSaveable { mutableStateOf(false) }
 
-        Title(textRes = R.string.component_radio_buttons_disabled, withHorizontalPadding = true)
-        RadioButtons(enabled = false)
-    }
-}
-
-@ExperimentalMaterialApi
-@Composable
-private fun RadioButtons(enabled: Boolean) {
-    val selectedRadio = remember { mutableStateOf(R.string.component_element_item1) }
-    Column(modifier = Modifier.selectableGroup()) {
-        RadioButtonListItem(
-            labelRes = R.string.component_element_item1,
-            selectedRadio = selectedRadio,
-            currentRadio = R.string.component_element_item1,
-            enabled = enabled
-        )
+    ComponentCustomizationBottomSheetScaffold(
+        bottomSheetScaffoldState = rememberBottomSheetScaffoldState(),
+        bottomSheetContent = {
+            SwitchListItem(labelRes = R.string.component_state_disabled, checked = disabled)
+        }) {
+        Column(
+            modifier = Modifier
+                .verticalScroll(rememberScrollState())
+                .padding(bottom = dimensionResource(id = R.dimen.spacing_m))
+        ) {
+            val selectedRadio = remember { mutableStateOf(R.string.component_element_item1) }
+            Column(modifier = Modifier.selectableGroup()) {
+                RadioButtonListItem(
+                    labelRes = R.string.component_element_item1,
+                    selectedRadio = selectedRadio,
+                    currentRadio = R.string.component_element_item1,
+                    enabled = !disabled.value
+                )
 
-        RadioButtonListItem(
-            labelRes = R.string.component_element_item2,
-            selectedRadio = selectedRadio,
-            currentRadio = R.string.component_element_item2,
-            enabled = enabled
-        )
+                RadioButtonListItem(
+                    labelRes = R.string.component_element_item2,
+                    selectedRadio = selectedRadio,
+                    currentRadio = R.string.component_element_item2,
+                    enabled = !disabled.value
+                )
 
-        RadioButtonListItem(
-            labelRes = R.string.component_element_item3,
-            selectedRadio = selectedRadio,
-            currentRadio = R.string.component_element_item3,
-            enabled = enabled
-        )
+                RadioButtonListItem(
+                    labelRes = R.string.component_element_item3,
+                    selectedRadio = selectedRadio,
+                    currentRadio = R.string.component_element_item3,
+                    enabled = !disabled.value
+                )
+            }
+        }
     }
 }
diff --git a/demo/src/main/res/values/strings.xml b/demo/src/main/res/values/strings.xml
@@ -134,8 +134,6 @@
     <!-- Component Radio Buttons -->
     <string name="component_radio_buttons">Radio Buttons</string>
     <string name="component_radio_buttons_description">Radio buttons enable users to choose one item from a set of mutually exclusive, related choices.</string>
-    <string name="component_radio_buttons_enabled">Enabled radio buttons</string>
-    <string name="component_radio_buttons_disabled">Disabled radio buttons</string>
 
     <!-- Component Switches -->
     <string name="component_switches">Switches</string>
@@ -205,7 +203,6 @@
     <string name="component_text_field_keyboard_action">Keyboard action</string>
     <string name="component_text_field_keyboard_capitalization">Capitalization</string>
 
-
     <!-- Component Tabs -->
     <string name="component_tabs">Tabs</string>
     <string name="component_tabs_description">A tab bar appears at the top of the screen and provides an easy way for users to switch between a number of different views.</string>