Skip to content

Commit

Permalink
Merge pull request #559 from Orange-OpenSource/530-component-odstextt…
Browse files Browse the repository at this point in the history
…ogglebuttonsrow

530 - Component Odstexttogglebuttonsrow
  • Loading branch information
florentmaitre authored Aug 11, 2023
2 parents 44fef8a + 269a438 commit 3cee7ef
Show file tree
Hide file tree
Showing 50 changed files with 488 additions and 87 deletions.
2 changes: 1 addition & 1 deletion app/build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,12 @@ plugins {
id("com.android.application")
id("com.google.gms.google-services")
id("kotlin-android")
id("kotlin-kapt")
id("kotlin-parcelize")
id("com.google.firebase.appdistribution")
id("com.google.firebase.crashlytics")
id("firebase")
id("dagger.hilt.android.plugin")
id("kotlin-kapt") // This must be the last statement in the plugins {} to avoid "options not recognized" warning
}

android {
Expand Down
2 changes: 1 addition & 1 deletion app/src/main/java/com/orange/ods/app/ui/MainScreen.kt
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,8 @@ import com.orange.ods.app.ui.search.SearchScreen
import com.orange.ods.app.ui.utilities.extension.isDarkModeEnabled
import com.orange.ods.app.ui.utilities.extension.isOrange
import com.orange.ods.compose.theme.OdsTheme
import com.orange.ods.extension.orElse
import com.orange.ods.theme.OdsThemeConfigurationContract
import com.orange.ods.utilities.extension.orElse
import com.orange.ods.xml.theme.OdsXml
import com.orange.ods.xml.utilities.extension.xml

Expand Down
4 changes: 2 additions & 2 deletions app/src/main/java/com/orange/ods/app/ui/about/AboutScreen.kt
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,8 @@ import com.orange.ods.app.ui.utilities.extension.versionCode
import com.orange.ods.compose.component.list.OdsListItem
import com.orange.ods.compose.text.OdsTextCaption
import com.orange.ods.compose.text.OdsTextH4
import com.orange.ods.utilities.extension.ifNotNull
import com.orange.ods.utilities.extension.orElse
import com.orange.ods.extension.ifNotNull
import com.orange.ods.extension.orElse

@Composable
fun AboutScreen(onAboutItemClick: (Long) -> Unit) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,8 @@ sealed class Component(
Variant.ButtonsDefault,
Variant.ButtonsOutlined,
Variant.ButtonsText,
Variant.ButtonsFunctional
Variant.ButtonsFunctional,
Variant.ButtonsTextToggleGroup
),
demoScreen = { variant, _ -> if (variant != null) ComponentButtons(variant = variant) }
)
Expand Down Expand Up @@ -293,6 +294,7 @@ sealed class Variant(
object ButtonsDefault : Variant(R.string.component_buttons_high_emphasis, "${OdsComposable.OdsButton.name} with ${OdsButtonStyle.Default.name}")
object ButtonsOutlined : Variant(R.string.component_buttons_medium_emphasis, OdsComposable.OdsOutlinedButton.name)
object ButtonsText : Variant(R.string.component_buttons_low_emphasis, OdsComposable.OdsTextButton.name)
object ButtonsTextToggleGroup : Variant(R.string.component_button_text_toggle_group, OdsComposable.OdsTextToggleButtonsRow.name)
object ButtonsFunctional : Variant(R.string.component_buttons_functional, "${OdsComposable.OdsButton.name} with a functional style")

object ButtonsIcon : Variant(R.string.component_buttons_icon, OdsComposable.OdsIconButton.name)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ import com.orange.ods.app.R
import com.orange.ods.app.ui.LocalMainTopAppBarManager
import com.orange.ods.app.ui.utilities.DrawableManager
import com.orange.ods.compose.component.card.OdsSmallCard
import com.orange.ods.utilities.extension.orElse
import com.orange.ods.extension.orElse

@Composable
fun ComponentsScreen(onComponentClick: (Long) -> Unit) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ import com.orange.ods.compose.component.banner.OdsBannerButton
import com.orange.ods.compose.component.banner.OdsBannerImage
import com.orange.ods.compose.component.list.OdsListItem
import com.orange.ods.compose.component.list.OdsSwitchTrailing
import com.orange.ods.utilities.extension.ifNotNull
import com.orange.ods.extension.ifNotNull

@OptIn(ExperimentalMaterialApi::class)
@Composable
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,23 +21,31 @@ import com.orange.ods.compose.component.button.OdsTextButtonStyle

@Composable
fun rememberButtonCustomizationState(
toggleCount: MutableState<Int> = rememberSaveable { mutableStateOf(ButtonCustomizationState.MinToggleCount) },
buttonStyle: MutableState<OdsButtonStyle> = rememberSaveable { mutableStateOf(OdsButtonStyle.Default) },
textButtonStyle: MutableState<OdsTextButtonStyle> = rememberSaveable { mutableStateOf(OdsTextButtonStyle.Default) },
leadingIcon: MutableState<Boolean> = rememberSaveable { mutableStateOf(false) },
fullScreenWidth: MutableState<Boolean> = rememberSaveable { mutableStateOf(false) },
sameItemsWeight: MutableState<Boolean> = rememberSaveable { mutableStateOf(false) },
enabled: MutableState<Boolean> = rememberSaveable { mutableStateOf(true) }
) =
remember(buttonStyle, textButtonStyle, leadingIcon, fullScreenWidth, enabled) {
ButtonCustomizationState(buttonStyle, textButtonStyle, leadingIcon, fullScreenWidth, enabled)
remember(buttonStyle, textButtonStyle, leadingIcon, fullScreenWidth, sameItemsWeight, enabled, toggleCount) {
ButtonCustomizationState(toggleCount, buttonStyle, textButtonStyle, leadingIcon, fullScreenWidth, sameItemsWeight, enabled)
}

class ButtonCustomizationState(
val toggleCount: MutableState<Int>,
val buttonStyle: MutableState<OdsButtonStyle>,
val textButtonStyle: MutableState<OdsTextButtonStyle>,
val leadingIcon: MutableState<Boolean>,
val fullScreenWidth: MutableState<Boolean>,
val sameItemsWeight: MutableState<Boolean>,
val enabled: MutableState<Boolean>
) {
companion object {
const val MinToggleCount = 2
const val MaxToggleCount = 3
}

val hasLeadingIcon
get() = leadingIcon.value
Expand All @@ -47,4 +55,7 @@ class ButtonCustomizationState(

val hasFullScreenWidth
get() = fullScreenWidth.value

val hasSameItemsWeight
get() = sameItemsWeight.value
}
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ import com.orange.ods.compose.OdsComposable
import com.orange.ods.compose.component.button.OdsButton
import com.orange.ods.compose.component.button.OdsButtonStyle
import com.orange.ods.compose.theme.OdsDisplaySurface
import com.orange.ods.utilities.extension.fullName
import com.orange.ods.extension.fullName

@Composable
fun ButtonsContained(customizationState: ButtonCustomizationState) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ import com.orange.ods.compose.OdsComposable
import com.orange.ods.compose.component.button.OdsTextButton
import com.orange.ods.compose.component.button.OdsTextButtonStyle
import com.orange.ods.compose.theme.OdsDisplaySurface
import com.orange.ods.utilities.extension.fullName
import com.orange.ods.extension.fullName

@Composable
fun ButtonsText(customizationState: ButtonCustomizationState) {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
/*
*
* Copyright 2021 Orange
*
* Use of this source code is governed by an MIT-style
* license that can be found in the LICENSE file or at
* https://opensource.org/licenses/MIT.
* /
*/

package com.orange.ods.app.ui.components.buttons

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.dimensionResource
import com.orange.ods.app.domain.recipes.LocalRecipes
import com.orange.ods.app.ui.utilities.composable.CodeImplementationColumn
import com.orange.ods.app.ui.utilities.composable.FunctionCallCode
import com.orange.ods.compose.OdsComposable
import com.orange.ods.compose.annotation.ExperimentalOdsApi
import com.orange.ods.compose.component.button.OdsTextToggleButtonsRow
import com.orange.ods.compose.component.button.OdsTextToggleButtonsRowItem
import com.orange.ods.compose.theme.OdsDisplaySurface

@Composable
fun ButtonsTextToggleButtonsRow(customizationState: ButtonCustomizationState) {
val textToggleButtons =
LocalRecipes.current.first().ingredients.take(ButtonCustomizationState.MaxToggleCount).map { ingredient ->
OdsTextToggleButtonsRowItem(ingredient.food.name, customizationState.isEnabled)
}

var selectedIndex by rememberSaveable { mutableStateOf(0) }

with(customizationState) {
Column(
modifier = Modifier
.verticalScroll(rememberScrollState())
.padding(vertical = dimensionResource(id = com.orange.ods.R.dimen.screen_vertical_margin))
) {
ToggleButtonsRow(
textToggleButtons = textToggleButtons,
selectedIndex = selectedIndex,
onSelectedIndexChange = { index -> selectedIndex = index },
toggleCount = toggleCount.value,
sameItemsWeight = hasSameItemsWeight,
)

Spacer(modifier = Modifier.padding(top = dimensionResource(com.orange.ods.R.dimen.spacing_s)))

InvertedBackgroundColumn {
ToggleButtonsRow(
textToggleButtons = textToggleButtons,
selectedIndex = selectedIndex,
onSelectedIndexChange = { index -> selectedIndex = index },
toggleCount = toggleCount.value,
sameItemsWeight = hasSameItemsWeight,
displaySurface = displaySurface
)
}

CodeImplementationColumn(
modifier = Modifier.padding(horizontal = dimensionResource(id = com.orange.ods.R.dimen.screen_horizontal_margin))
) {
FunctionCallCode(
name = OdsComposable.OdsTextToggleButtonsRow.name,
exhaustiveParameters = false,
parameters = {
list("textToggleButtons") {
textToggleButtons.take(toggleCount.value).forEach { item ->
classInstance(OdsTextToggleButtonsRowItem::class.java) {
text(item.text)
enabled(customizationState.isEnabled)
}
}
}
stringRepresentation("selectedIndex", selectedIndex)
stringRepresentation("sameItemsWeight", hasSameItemsWeight)
}
)
}
}
}
}

@OptIn(ExperimentalOdsApi::class)
@Composable
private fun ToggleButtonsRow(
textToggleButtons: List<OdsTextToggleButtonsRowItem>,
selectedIndex: Int,
onSelectedIndexChange: (Int) -> Unit,
toggleCount: Int,
sameItemsWeight: Boolean,
displaySurface: OdsDisplaySurface = OdsDisplaySurface.Default
) {
Row(
modifier = Modifier
.fillMaxWidth()
.padding(top = dimensionResource(com.orange.ods.R.dimen.spacing_m))
.padding(horizontal = dimensionResource(com.orange.ods.R.dimen.screen_horizontal_margin)),
horizontalArrangement = Arrangement.Center
) {
OdsTextToggleButtonsRow(
textToggleButtons = textToggleButtons.take(toggleCount),
selectedIndex = selectedIndex,
onSelectedIndexChange = onSelectedIndexChange,
sameItemsWeight = sameItemsWeight,
displaySurface = displaySurface
)
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import androidx.compose.ui.res.dimensionResource
import androidx.compose.ui.res.stringResource
import com.orange.ods.app.R
import com.orange.ods.app.ui.components.Variant
import com.orange.ods.app.ui.components.utilities.ComponentCountRow
import com.orange.ods.app.ui.components.utilities.ComponentCustomizationBottomSheetScaffold
import com.orange.ods.app.ui.utilities.composable.Subtitle
import com.orange.ods.compose.component.button.OdsButtonStyle
Expand Down Expand Up @@ -58,35 +59,59 @@ fun ComponentButtons(variant: Variant) {
ComponentCustomizationBottomSheetScaffold(
bottomSheetScaffoldState = rememberBottomSheetScaffoldState(),
bottomSheetContent = {
if (variant == Variant.ButtonsFunctional) {
Subtitle(textRes = R.string.component_button_style_functional, horizontalPadding = true)
OdsChoiceChipsFlowRow(
selectedChip = buttonStyle,
modifier = Modifier.padding(horizontal = dimensionResource(id = com.orange.ods.R.dimen.screen_horizontal_margin)),
outlinedChips = true
) {
OdsChoiceChip(textRes = R.string.component_button_style_functional_positive, value = OdsButtonStyle.FunctionalPositive)
OdsChoiceChip(textRes = R.string.component_button_style_functional_negative, value = OdsButtonStyle.FunctionalNegative)
when (variant) {
Variant.ButtonsFunctional -> {
Subtitle(textRes = R.string.component_button_style_functional, horizontalPadding = true)
OdsChoiceChipsFlowRow(
selectedChip = buttonStyle,
modifier = Modifier.padding(horizontal = dimensionResource(id = com.orange.ods.R.dimen.screen_horizontal_margin)),
outlinedChips = true
) {
OdsChoiceChip(textRes = R.string.component_button_style_functional_positive, value = OdsButtonStyle.FunctionalPositive)
OdsChoiceChip(textRes = R.string.component_button_style_functional_negative, value = OdsButtonStyle.FunctionalNegative)
}
}
} else if (variant == Variant.ButtonsText) {
Subtitle(textRes = R.string.component_style, horizontalPadding = true)
OdsChoiceChipsFlowRow(
selectedChip = textButtonStyle,
modifier = Modifier.padding(horizontal = dimensionResource(id = com.orange.ods.R.dimen.screen_horizontal_margin)),
outlinedChips = true
) {
OdsChoiceChip(textRes = R.string.component_button_style_primary, value = OdsTextButtonStyle.Primary)
OdsChoiceChip(textRes = R.string.component_button_style_default, value = OdsTextButtonStyle.Default)
Variant.ButtonsText -> {
Subtitle(textRes = R.string.component_style, horizontalPadding = true)
OdsChoiceChipsFlowRow(
selectedChip = textButtonStyle,
modifier = Modifier.padding(horizontal = dimensionResource(id = com.orange.ods.R.dimen.screen_horizontal_margin)),
outlinedChips = true
) {
OdsChoiceChip(textRes = R.string.component_button_style_primary, value = OdsTextButtonStyle.Primary)
OdsChoiceChip(textRes = R.string.component_button_style_default, value = OdsTextButtonStyle.Default)
}
}
Variant.ButtonsTextToggleGroup -> {
ComponentCountRow(
modifier = Modifier.padding(start = dimensionResource(id = com.orange.ods.R.dimen.screen_horizontal_margin)),
title = stringResource(id = R.string.component_button_icon_toggle_count),
count = toggleCount,
minusIconContentDescription = stringResource(id = R.string.component_button_icon_toggle_remove),
plusIconContentDescription = stringResource(id = R.string.component_button_icon_toggle_add),
minCount = ButtonCustomizationState.MinToggleCount,
maxCount = ButtonCustomizationState.MaxToggleCount
)

OdsListItem(
text = stringResource(id = R.string.component_buttons_text_toggle_group_same_weight),
trailing = OdsSwitchTrailing(checked = sameItemsWeight)
)
}
else -> {}
}
OdsListItem(
text = stringResource(id = R.string.component_element_icon),
trailing = OdsSwitchTrailing(checked = leadingIcon)
)
OdsListItem(
text = stringResource(id = R.string.component_button_full_screen_width),
trailing = OdsSwitchTrailing(checked = fullScreenWidth)
)

if (variant != Variant.ButtonsTextToggleGroup) {
OdsListItem(
text = stringResource(id = R.string.component_element_icon),
trailing = OdsSwitchTrailing(checked = leadingIcon)
)
OdsListItem(
text = stringResource(id = R.string.component_button_full_screen_width),
trailing = OdsSwitchTrailing(checked = fullScreenWidth)
)
}

OdsListItem(
text = stringResource(id = R.string.component_state_enabled),
trailing = OdsSwitchTrailing(checked = enabled)
Expand All @@ -97,6 +122,7 @@ fun ComponentButtons(variant: Variant) {
Variant.ButtonsPrimary, Variant.ButtonsDefault, Variant.ButtonsFunctional -> ButtonsContained(customizationState)
Variant.ButtonsOutlined -> ButtonsOutlined(customizationState)
Variant.ButtonsText -> ButtonsText(customizationState)
Variant.ButtonsTextToggleGroup -> ButtonsTextToggleButtonsRow(customizationState)
else -> {}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ fun ButtonsIconToggleGroup(customizationState: ButtonIconCustomizationState) {
}
}
}
stringRepresentation("selectedButtonIndex", selectedIndex)
stringRepresentation("selectedIndex", selectedIndex)
}
)
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ import com.orange.ods.compose.component.list.OdsListItemIconType
import com.orange.ods.compose.component.list.OdsListItemTrailing
import com.orange.ods.compose.component.list.OdsSwitchTrailing
import com.orange.ods.compose.component.list.iconType
import com.orange.ods.utilities.extension.orElse
import com.orange.ods.extension.orElse

@OptIn(ExperimentalMaterialApi::class)
@Composable
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@ import com.orange.ods.compose.component.list.OdsListItem
import com.orange.ods.compose.component.list.OdsSwitchTrailing
import com.orange.ods.compose.component.tab.OdsTab
import com.orange.ods.compose.component.tab.OdsTabRow
import com.orange.ods.utilities.composable.Keyboard
import com.orange.ods.utilities.composable.keyboardAsState
import com.orange.ods.compose.utilities.composable.Keyboard
import com.orange.ods.compose.utilities.composable.keyboardAsState
import kotlinx.coroutines.launch

@OptIn(ExperimentalMaterialApi::class)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -47,9 +47,9 @@ import com.orange.ods.compose.component.list.OdsListItem
import com.orange.ods.compose.component.list.OdsListItemIcon
import com.orange.ods.compose.component.list.OdsListItemIconType
import com.orange.ods.compose.component.list.iconType
import com.orange.ods.extension.orElse
import com.orange.ods.theme.guideline.GuidelineColor
import com.orange.ods.theme.guideline.toHexString
import com.orange.ods.utilities.extension.orElse

@Composable
fun SearchScreen(
Expand Down
Loading

0 comments on commit 3cee7ef

Please sign in to comment.