Skip to content

Commit

Permalink
[#529] Modify odsbutton
Browse files Browse the repository at this point in the history
  • Loading branch information
@dolinetouko @florentmaitre
dolinetouko authored and florentmaitre committed Jun 29, 2023
1 parent e38fcb1 commit 7bc2ff6
Show file tree
Hide file tree
Showing 14 changed files with 304 additions and 112 deletions.
24 changes: 8 additions & 16 deletions app/src/main/java/com/orange/ods/app/ui/components/buttons/ButtonsText.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,7 @@

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

import android.app.ActionBar
import android.view.ViewGroup
import android.widget.RelativeLayout
import androidx.appcompat.content.res.AppCompatResources
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
Expand Down Expand Up @@ -46,18 +45,13 @@ fun ButtonsText(customizationState: ButtonCustomizationState) {
.verticalScroll(rememberScrollState())
.padding(vertical = dimensionResource(id = R.dimen.screen_vertical_margin))
) {
val modifier = Modifier
.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin))
.padding(top = dimensionResource(R.dimen.spacing_m))
.let { if (hasFullScreenWidth) it.fillMaxWidth() else it }
Title(
textRes = if (textButtonStyle.value == OdsTextButtonStyle.Default) R.string.component_button_style_default else R.string.component_button_style_primary,
horizontalPadding = true
)

TextButton(
style = textButtonStyle.value,
modifier = modifier,
leadingIcon = hasLeadingIcon,
enabled = isEnabled,
fullScreenWidth = hasFullScreenWidth
Expand All @@ -68,7 +62,6 @@ fun ButtonsText(customizationState: ButtonCustomizationState) {
InvertedBackgroundColumn {
TextButton(
style = textButtonStyle.value,
modifier = modifier,
leadingIcon = hasLeadingIcon,
enabled = isEnabled,
fullScreenWidth = hasFullScreenWidth,
Expand Down Expand Up @@ -98,7 +91,6 @@ fun ButtonsText(customizationState: ButtonCustomizationState) {
@Composable
private fun TextButton(
style: OdsTextButtonStyle,
modifier: Modifier,
leadingIcon: Boolean,
enabled: Boolean,
fullScreenWidth: Boolean,
Expand All @@ -108,7 +100,7 @@ private fun TextButton(
val text = stringResource(if (enabled) R.string.component_state_enabled else R.string.component_state_disabled)
val iconId = R.drawable.ic_coffee

Box(modifier = modifier) {
Box(modifier = Modifier.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin), vertical = dimensionResource(R.dimen.spacing_m))) {
UiFramework<OdsTextButtonBinding>(
compose = {
OdsTextButton(
Expand All @@ -122,12 +114,12 @@ private fun TextButton(
)
}, xml = {
this.text = text
textbutton.style = style
textbutton.icon = if (leadingIcon) AppCompatResources.getDrawable(context, iconId) else null
textbutton.isEnabled = enabled
val width = if (fullScreenWidth) ActionBar.LayoutParams.MATCH_PARENT else ActionBar.LayoutParams.WRAP_CONTENT
textbutton.layoutParams = ViewGroup.LayoutParams(width, ActionBar.LayoutParams.WRAP_CONTENT)
textbutton.displaySurface = displaySurface
this.icon = if (leadingIcon) AppCompatResources.getDrawable(context, iconId) else null
this.enabled = enabled
this.style = style
this.displaySurface = displaySurface
val width = if (fullScreenWidth) RelativeLayout.LayoutParams.MATCH_PARENT else RelativeLayout.LayoutParams.WRAP_CONTENT
odsTextbutton.layoutParams = RelativeLayout.LayoutParams(width, RelativeLayout.LayoutParams.WRAP_CONTENT)
}
)
}
Expand Down
19 changes: 7 additions & 12 deletions app/src/main/java/com/orange/ods/app/ui/components/buttons/icons/ButtonsIcon.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,16 +46,11 @@ fun ButtonsIcon(customizationState: ButtonIconCustomizationState) {
.verticalScroll(rememberScrollState())
.padding(vertical = dimensionResource(id = R.dimen.screen_vertical_margin))
) {
val modifier = Modifier
.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin))
.padding(top = dimensionResource(R.dimen.spacing_m))

Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.Center
) {
IconButton(
modifier = modifier,
enabled = isEnabled
)
}
Expand All @@ -64,7 +59,6 @@ fun ButtonsIcon(customizationState: ButtonIconCustomizationState) {

InvertedBackgroundColumn(horizontalAlignment = Alignment.CenterHorizontally) {
IconButton(
modifier = modifier,
enabled = isEnabled,
displaySurface = displaySurface
)
Expand All @@ -89,27 +83,28 @@ fun ButtonsIcon(customizationState: ButtonIconCustomizationState) {

@Composable
private fun IconButton(
modifier: Modifier,
enabled: Boolean,
displaySurface: OdsDisplaySurface = OdsDisplaySurface.Default
) {
val context = LocalContext.current
val iconId = R.drawable.ic_search
val contentDescription = stringResource(id = R.string.component_button_icon_search_desc)

Box(modifier = modifier) {
Box(modifier = Modifier.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin), vertical = dimensionResource(R.dimen.spacing_m))) {
UiFramework<OdsIconButtonBinding>(
compose = {
OdsIconButton(
onClick = { clickOnElement(context, context.getString(R.string.component_button_icon)) },
painter = painterResource(id = R.drawable.ic_search),
contentDescription = stringResource(id = R.string.component_button_icon_search_desc),
contentDescription = contentDescription,
enabled = enabled,
displaySurface = displaySurface
)
}, xml = {
iconbutton.icon = AppCompatResources.getDrawable(context, iconId)
iconbutton.isEnabled = enabled
iconbutton.displaySurface = displaySurface
icon = AppCompatResources.getDrawable(context, iconId)
this.enabled = enabled
this.displaySurface = displaySurface
iconContentDescription = contentDescription
}
)
}
Expand Down
24 changes: 10 additions & 14 deletions app/src/main/java/com/orange/ods/app/ui/components/buttons/icons/ButtonsIconToggle.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,16 +50,12 @@ fun ButtonsIconToggle(customizationState: ButtonIconCustomizationState) {
.verticalScroll(rememberScrollState())
.padding(vertical = dimensionResource(id = R.dimen.screen_vertical_margin))
) {
val modifier = Modifier
.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin))
.padding(top = dimensionResource(R.dimen.spacing_m))
Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.Center
) {
IconToggleButton(
checked = buttonCheckedState.value,
modifier = modifier,
onCheckedChange = { checked -> buttonCheckedState.value = checked },
enabled = isEnabled
)
Expand All @@ -71,7 +67,6 @@ fun ButtonsIconToggle(customizationState: ButtonIconCustomizationState) {
IconToggleButton(
checked = buttonCheckedState.value,
onCheckedChange = { checked -> buttonCheckedState.value = checked },
modifier = modifier,
enabled = isEnabled,
displaySurface = displaySurface
)
Expand Down Expand Up @@ -100,33 +95,34 @@ fun ButtonsIconToggle(customizationState: ButtonIconCustomizationState) {
private fun IconToggleButton(
checked: Boolean,
onCheckedChange: (Boolean) -> Unit,
modifier: Modifier,
enabled: Boolean,
displaySurface: OdsDisplaySurface = OdsDisplaySurface.Default
) {
val context = LocalContext.current
val uncheckedPainterId = R.drawable.ic_heart_outlined
val checkedPainterId = R.drawable.ic_heart
val iconContentDescription = stringResource(id = R.string.component_button_icon_toggle_favorite_icon_desc)

Box(modifier = modifier) {
Box(modifier = Modifier.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin), vertical = dimensionResource(R.dimen.spacing_m))) {
UiFramework<OdsIconToogleButtonBinding>(
compose = {
OdsIconToggleButton(
checked = checked,
uncheckedPainter = painterResource(id = uncheckedPainterId),
checkedPainter = painterResource(id = checkedPainterId),
iconContentDescription = stringResource(id = R.string.component_button_icon_toggle_favorite_icon_desc),
iconContentDescription = iconContentDescription,
onCheckedChange = onCheckedChange,
enabled = enabled,
displaySurface = displaySurface
)
}, xml = {
icontogglebutton.checked = checked
icontogglebutton.checkedPainter = AppCompatResources.getDrawable(context, checkedPainterId)
icontogglebutton.uncheckedPainter = AppCompatResources.getDrawable(context, uncheckedPainterId)
icontogglebutton.isEnabled = enabled
icontogglebutton.displaySurface = displaySurface
icontogglebutton.onCheckedChange = onCheckedChange
this.checked = checked
checkedPainter = AppCompatResources.getDrawable(context, checkedPainterId)
uncheckedPainter = AppCompatResources.getDrawable(context, uncheckedPainterId)
iconDescription = iconContentDescription
this.enabled = enabled
this.displaySurface = displaySurface
odsIconToggleButton.onCheckedChange = onCheckedChange
}
)
}
Expand Down
38 changes: 15 additions & 23 deletions app/src/main/java/com/orange/ods/app/ui/components/buttons/icons/ButtonsIconToggleGroup.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@
package com.orange.ods.app.ui.components.buttons.icons

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
Expand Down Expand Up @@ -54,13 +53,10 @@ fun ButtonsIconToggleGroup(customizationState: ButtonIconCustomizationState) {
.verticalScroll(rememberScrollState())
.padding(vertical = dimensionResource(id = R.dimen.screen_vertical_margin))
) {
val modifier = Modifier
.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin))

ToggleButtonsRow(
iconToggleButtons = iconToggleButtons,
selectedIndex = selectedIndex,
modifier = modifier,
onSelectedIndexChange = { index -> selectedIndex = index },
toggleCount = toggleCount.value
)
Expand All @@ -72,7 +68,6 @@ fun ButtonsIconToggleGroup(customizationState: ButtonIconCustomizationState) {
iconToggleButtons = iconToggleButtons,
selectedIndex = selectedIndex,
onSelectedIndexChange = { index -> selectedIndex = index },
modifier = modifier,
toggleCount = toggleCount.value,
displaySurface = displaySurface
)
Expand Down Expand Up @@ -108,7 +103,6 @@ private fun ToggleButtonsRow(
selectedIndex: Int,
onSelectedIndexChange: (Int) -> Unit,
toggleCount: Int,
modifier: Modifier,
displaySurface: OdsDisplaySurface = OdsDisplaySurface.Default
) {
Row(
Expand All @@ -118,22 +112,20 @@ private fun ToggleButtonsRow(
.padding(horizontal = dimensionResource(R.dimen.screen_horizontal_margin)),
horizontalArrangement = Arrangement.Center
) {
Box(modifier = modifier) {
UiFramework<OdsIconToggleButtonsGroupBinding>(
compose = {
OdsIconToggleButtonsRow(
iconToggleButtons = iconToggleButtons.take(toggleCount),
selectedIndex = selectedIndex,
onSelectedIndexChange = onSelectedIndexChange,
displaySurface = displaySurface
)
}, xml = {
icontogglebuttonsrow.iconToggleButtons = iconToggleButtons.take(toggleCount)
icontogglebuttonsrow.selectedIndex = selectedIndex
icontogglebuttonsrow.onSelectedIndexChange = onSelectedIndexChange
icontogglebuttonsrow.displaySurface = displaySurface
}
)
}
UiFramework<OdsIconToggleButtonsGroupBinding>(
compose = {
OdsIconToggleButtonsRow(
iconToggleButtons = iconToggleButtons.take(toggleCount),
selectedIndex = selectedIndex,
onSelectedIndexChange = onSelectedIndexChange,
displaySurface = displaySurface
)
}, xml = {
this.odsIconToggleButtonsRow.iconToggleButtons = iconToggleButtons.take(toggleCount)
this.selectedIndex = selectedIndex
this.displaySurface = displaySurface
this.odsIconToggleButtonsRow.onSelectedIndexChange = onSelectedIndexChange
}
)
}
}
47 changes: 41 additions & 6 deletions app/src/main/res/layout/ods_icon_button.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,18 +7,53 @@
~ * https://opensource.org/licenses/MIT.
~ */
-->
<layout xmlns:android="http://schemas.android.com/apk/res/android">
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<data>

<variable
name="icon"
type="android.graphics.drawable.Drawable" />

<variable
name="iconContentDescription"
type="String" />

<variable
name="enabled"
type="Boolean" />

<variable
name="displaySurface"
type="com.orange.ods.compose.theme.OdsDisplaySurface" />

</data>

<com.orange.ods.xml.component.button.OdsIconButton
android:id="@+id/iconbutton"
android:layout_height="match_parent"
android:layout_width="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<com.orange.ods.xml.component.button.OdsIconButton
android:id="@+id/ods_icon_button"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:leadingIcon="@{icon}"
app:enabled="@{enabled}"
app:iconContentDescription="@{iconContentDescription}"
app:displaySurface="@{displaySurface}" />

<!-- Invisible OdsIconButton used for tests -->
<com.orange.ods.xml.component.button.OdsIconButton
android:id="@+id/ods_icon_button_test"
android:visibility="invisible"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:leadingIcon="@drawable/ic_add"
app:iconContentDescription="Button"
app:enabled="true"
app:displaySurface="standard" />

</com.orange.ods.xml.component.button.OdsIconButton>
</RelativeLayout>

</layout>
36 changes: 30 additions & 6 deletions app/src/main/res/layout/ods_icon_toggle_buttons_group.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,17 +7,41 @@
~ * https://opensource.org/licenses/MIT.
~ */
-->
<layout xmlns:android="http://schemas.android.com/apk/res/android">
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<data>

<variable
name="selectedIndex"
type="Integer" />

<variable
name="displaySurface"
type="com.orange.ods.compose.theme.OdsDisplaySurface" />

</data>

<com.orange.ods.xml.component.button.OdsIconToggleButtonsRow
android:id="@+id/icontogglebuttonsrow"
android:layout_height="match_parent"
android:layout_width="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<com.orange.ods.xml.component.button.OdsIconToggleButtonsRow
android:id="@+id/ods_icon_toggle_buttons_row"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:selectedIndex="@{selectedIndex}"
app:displaySurface="@{displaySurface}" />

<!-- Invisible OdsIconToggleButtonsRow used for tests -->
<com.orange.ods.xml.component.button.OdsIconToggleButtonsRow
android:id="@+id/ods_icon_toggle_buttons_row_test"
android:visibility="invisible"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:selectedIndex="0"
app:displaySurface="standard" />

</com.orange.ods.xml.component.button.OdsIconToggleButtonsRow>
</RelativeLayout>

</layout>
Loading

0 comments on commit 7bc2ff6

Please sign in to comment.