683 - [Bug]: ODS - component - Image item (tile)

app/src/main/java/com/orange/ods/app/ui/components/Component.kt

@@ -26,7 +26,7 @@ import com.orange.ods.app.ui.components.chips.Chip
 import com.orange.ods.app.ui.components.chips.ChipFilter
 import com.orange.ods.app.ui.components.dialogs.ComponentDialog
 import com.orange.ods.app.ui.components.floatingactionbuttons.ComponentFloatingActionButton
-import com.orange.ods.app.ui.components.imagetile.ComponentImageTile
+import com.orange.ods.app.ui.components.imageitem.ComponentImageItem
 import com.orange.ods.app.ui.components.listitem.ComponentListItem
 import com.orange.ods.app.ui.components.menus.ComponentMenu
 import com.orange.ods.app.ui.components.navigationdrawers.ComponentModalDrawers
@@ -169,13 +169,13 @@ sealed class Component(
         demoScreen = { _, _ -> ComponentFloatingActionButton() }
     )
 
-    object ImageTile : Component(
-        R.string.component_image_tile,
-        R.drawable.il_image_tile,
+    object ImageItem : Component(
+        R.string.component_image_item,
+        R.drawable.il_image_item,
         null,
-        R.string.component_image_tile_description,
-        composableName = OdsComposable.OdsImageTile.name,
-        demoScreen = { _, _ -> ComponentImageTile() }
+        R.string.component_image_item_description,
+        composableName = OdsComposable.OdsImageItem.name,
+        demoScreen = { _, _ -> ComponentImageItem() }
     )
 
     object ListItem : Component(

app/src/main/java/com/orange/ods/app/ui/components/imagetile/ComponentImageTile.kt → app/src/main/java/com/orange/ods/app/ui/components/imageitem/ComponentImageItem.kt

@@ -8,7 +8,7 @@
  * /
  */
 
-package com.orange.ods.app.ui.components.imagetile
+package com.orange.ods.app.ui.components.imageitem
 
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
@@ -43,24 +43,24 @@ import com.orange.ods.compose.OdsComposable
 import com.orange.ods.compose.component.button.OdsIconButtonIcon
 import com.orange.ods.compose.component.chip.OdsChoiceChip
 import com.orange.ods.compose.component.chip.OdsChoiceChipsFlowRow
-import com.orange.ods.compose.component.imagetile.OdsImageTile
-import com.orange.ods.compose.component.imagetile.OdsImageTileIconToggleButton
-import com.orange.ods.compose.component.imagetile.OdsImageTileImage
-import com.orange.ods.compose.component.imagetile.OdsImageTileLegendAreaDisplayType
+import com.orange.ods.compose.component.imageitem.OdsImageItem
+import com.orange.ods.compose.component.imageitem.OdsImageItemIconToggleButton
+import com.orange.ods.compose.component.imageitem.OdsImageItemImage
+import com.orange.ods.compose.component.imageitem.OdsImageItemLegendAreaDisplayType
 import com.orange.ods.compose.component.list.OdsListItem
 import com.orange.ods.compose.component.list.OdsListItemTrailingSwitch
 
 @OptIn(ExperimentalMaterialApi::class)
 @Composable
-fun ComponentImageTile() {
+fun ComponentImageItem() {
     val context = LocalContext.current
-    val imageTileCustomizationState = rememberImageTileCustomizationState()
+    val imageItemCustomizationState = rememberImageItemCustomizationState()
     var iconChecked by rememberSaveable { mutableStateOf(false) }
     val recipes = LocalRecipes.current
     val recipe = rememberSaveable { recipes.random() }
 
-    with(imageTileCustomizationState) {
-        if (type.value == OdsImageTileLegendAreaDisplayType.None) {
+    with(imageItemCustomizationState) {
+        if (type.value == OdsImageItemLegendAreaDisplayType.None) {
             iconDisplayed.value = false
         }
         if (!hasIcon) {
@@ -69,21 +69,21 @@ fun ComponentImageTile() {
         ComponentCustomizationBottomSheetScaffold(
             bottomSheetScaffoldState = rememberBottomSheetScaffoldState(),
             bottomSheetContent = {
-                Subtitle(textRes = R.string.component_image_tile_legend_area_display_type, horizontalPadding = true)
+                Subtitle(textRes = R.string.component_image_item_legend_area_display_type, horizontalPadding = true)
                 OdsChoiceChipsFlowRow(
                     value = type.value,
                     onValueChange = { value -> type.value = value },
                     modifier = Modifier.padding(horizontal = dimensionResource(id = com.orange.ods.R.dimen.spacing_m)),
                     chips = listOf(
                         OdsChoiceChip(
-                            text = stringResource(R.string.component_image_tile_legend_area_display_type_overlay),
-                            value = OdsImageTileLegendAreaDisplayType.Overlay
+                            text = stringResource(R.string.component_image_item_legend_area_display_type_overlay),
+                            value = OdsImageItemLegendAreaDisplayType.Overlay
                         ),
                         OdsChoiceChip(
-                            text = stringResource(R.string.component_image_tile_legend_area_display_type_below),
-                            value = OdsImageTileLegendAreaDisplayType.Below
+                            text = stringResource(R.string.component_image_item_legend_area_display_type_below),
+                            value = OdsImageItemLegendAreaDisplayType.Below
                         ),
-                        OdsChoiceChip(text = stringResource(R.string.component_element_none), value = OdsImageTileLegendAreaDisplayType.None),
+                        OdsChoiceChip(text = stringResource(R.string.component_element_none), value = OdsImageItemLegendAreaDisplayType.None),
                     )
                 )
                 OdsListItem(
@@ -103,16 +103,16 @@ fun ComponentImageTile() {
             ) {
                 val imageSize = 200.dp
                 val height = when (type.value) {
-                    OdsImageTileLegendAreaDisplayType.Below -> imageSize + dimensionResource(id = com.orange.ods.R.dimen.image_tile_legend_area_height)
-                    OdsImageTileLegendAreaDisplayType.Overlay,
-                    OdsImageTileLegendAreaDisplayType.None -> imageSize
+                    OdsImageItemLegendAreaDisplayType.Below -> imageSize + dimensionResource(id = com.orange.ods.R.dimen.image_item_legend_area_height)
+                    OdsImageItemLegendAreaDisplayType.Overlay,
+                    OdsImageItemLegendAreaDisplayType.None -> imageSize
                 }
-                OdsImageTile(
+                OdsImageItem(
                     modifier = Modifier
                         .width(imageSize)
                         .height(height),
-                    onClick = { clickOnElement(context, context.getString(R.string.component_image_tile)) },
-                    image = OdsImageTileImage(
+                    onClick = { clickOnElement(context, context.getString(R.string.component_image_item)) },
+                    image = OdsImageItemImage(
                         rememberAsyncImagePainter(
                             model = recipe.imageUrl,
                             placeholder = painterResource(id = R.drawable.placeholder),
@@ -122,7 +122,7 @@ fun ComponentImageTile() {
                     title = if (hasText) recipe.title else null,
                     legendAreaDisplayType = type.value,
                     icon = if (hasIcon) {
-                        OdsImageTileIconToggleButton(
+                        OdsImageItemIconToggleButton(
                             uncheckedIcon = OdsIconButtonIcon(
                                 painterResource(id = R.drawable.ic_heart_outlined),
                                 stringResource(id = R.string.component_button_icon_toggle_favorite_add_icon_desc)
@@ -142,17 +142,17 @@ fun ComponentImageTile() {
                     modifier = Modifier.padding(end = dimensionResource(id = com.orange.ods.R.dimen.spacing_m))
                 ) {
                     FunctionCallCode(
-                        name = OdsComposable.OdsImageTile.name,
+                        name = OdsComposable.OdsImageItem.name,
                         exhaustiveParameters = false,
                         parameters = {
                             enum("legendAreaDisplayType", type.value)
                             if (hasText) title(recipe.title)
-                            classInstance<OdsImageTileImage>("image") {
+                            classInstance<OdsImageItemImage>("image") {
                                 painter()
                                 contentDescription("")
                             }
                             if (hasIcon) {
-                                classInstance<OdsImageTileIconToggleButton>("icon") {
+                                classInstance<OdsImageItemIconToggleButton>("icon") {
                                     checked(iconChecked)
                                     lambda("onCheckedChange")
                                     classInstance<OdsIconButtonIcon>("uncheckedIcon") {

app/src/main/java/com/orange/ods/app/ui/components/imagetile/ImageTileCustomizationState.kt → app/src/main/java/com/orange/ods/app/ui/components/imageitem/ImageItemCustomizationState.kt

@@ -8,31 +8,31 @@
  * /
  */
 
-package com.orange.ods.app.ui.components.imagetile
+package com.orange.ods.app.ui.components.imageitem
 
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.saveable.rememberSaveable
-import com.orange.ods.compose.component.imagetile.OdsImageTileLegendAreaDisplayType
+import com.orange.ods.compose.component.imageitem.OdsImageItemLegendAreaDisplayType
 
 @Composable
-fun rememberImageTileCustomizationState(
-    type: MutableState<OdsImageTileLegendAreaDisplayType> = rememberSaveable { mutableStateOf(OdsImageTileLegendAreaDisplayType.Overlay) },
+fun rememberImageItemCustomizationState(
+    type: MutableState<OdsImageItemLegendAreaDisplayType> = rememberSaveable { mutableStateOf(OdsImageItemLegendAreaDisplayType.Overlay) },
     iconDisplayed: MutableState<Boolean> = rememberSaveable { mutableStateOf(false) }
 ) =
     remember(type, iconDisplayed) {
-        ImageTileCustomizationState(type, iconDisplayed)
+        ImageItemCustomizationState(type, iconDisplayed)
     }
 
-class ImageTileCustomizationState(
-    val type: MutableState<OdsImageTileLegendAreaDisplayType>,
+class ImageItemCustomizationState(
+    val type: MutableState<OdsImageItemLegendAreaDisplayType>,
     val iconDisplayed: MutableState<Boolean>
 ) {
     val hasIcon
         get() = iconDisplayed.value
 
     val hasText
-        get() = type.value != OdsImageTileLegendAreaDisplayType.None
+        get() = type.value != OdsImageItemLegendAreaDisplayType.None
 }

app/src/main/java/com/orange/ods/app/ui/utilities/DrawableManager.kt

@@ -41,7 +41,7 @@ object DrawableManager {
         R.drawable.il_chips_small_generic to R.drawable.il_chips_small,
         R.drawable.il_dialogs_generic to R.drawable.il_dialogs,
         R.drawable.il_fab_generic to R.drawable.il_fab,
-        R.drawable.il_image_tile_generic to R.drawable.il_image_tile,
+        R.drawable.il_image_item_generic to R.drawable.il_image_item,
         R.drawable.il_list_item_generic to R.drawable.il_list_item,
         R.drawable.il_lists_generic to R.drawable.il_lists,
         R.drawable.il_menus_generic to R.drawable.il_menus,

app/src/main/res/values/strings.xml

@@ -173,7 +173,7 @@
     <string name="component_button_icon_toggle_remove">Remove toggle</string>
     <string name="component_button_icon_toggle_add">Add toggle</string>
 
-    <!-- Components Cards -->
+    <!-- Component Cards -->
     <string name="component_cards">Cards</string>
     <string name="component_card_vertical_image_first">Vertical image first card</string>
     <string name="component_card_vertical_header_first">Vertical header first card</string>
@@ -223,15 +223,15 @@
     <string name="component_floating_action_button_size_mini">Mini</string>
     <string name="component_floating_action_button_full_screen_width">Full screen width</string>
 
-    <!-- Component Image Tile -->
-    <string name="component_image_tile">Image tile</string>
-    <string name="component_image_tile_description">An image tile contains primary information which is usually an image. It can also contain secondary information such as a title or an action.</string>
-    <string name="component_image_tile_sizes">Image tile sizes</string>
-    <string name="component_image_tile_small">Small image</string>
-    <string name="component_image_tile_large">Large image</string>
-    <string name="component_image_tile_legend_area_display_type">Legend area display type</string>
-    <string name="component_image_tile_legend_area_display_type_overlay">Overlay</string>
-    <string name="component_image_tile_legend_area_display_type_below">Below</string>
+    <!-- Component Image item -->
+    <string name="component_image_item">Image item</string>
+    <string name="component_image_item_description">An image item contains primary information which is usually an image. It can also contain secondary information such as a title or an action.</string>
+    <string name="component_image_item_sizes">Image item sizes</string>
+    <string name="component_image_item_small">Small image</string>
+    <string name="component_image_item_large">Large image</string>
+    <string name="component_image_item_legend_area_display_type">Legend area display type</string>
+    <string name="component_image_item_legend_area_display_type_overlay">Overlay</string>
+    <string name="component_image_item_legend_area_display_type_below">Below</string>
 
     <!-- Component List item -->
     <string name="component_list_item">List item</string>
@@ -264,8 +264,8 @@
     <string name="component_menu_divider">Divider example</string>
     <string name="component_menu_show_ingredients">Show ingredients</string>
 
-    <!-- Component Navigation Drawers -->
-    <string name="component_modal_drawers">Navigation Drawers</string>
+    <!-- Component Navigation drawers -->
+    <string name="component_modal_drawers">Navigation drawers</string>
     <string name="component_modal_drawers_description">The navigation drawer slides in from the left when the nav icon is tapped. The content should be concerned with identity and/or navigation.</string>
     <string name="component_modal_drawer_side">Side navigation drawer</string>
     <string name="component_modal_drawer_content">>>> Swipe to open drawer >>></string>
@@ -277,8 +277,8 @@
     <string name="component_modal_drawer_content_example">Content example</string>
     <string name="component_modal_drawer_list_example">Section list example</string>
 
-    <!-- Component Radio Buttons -->
-    <string name="component_radio_buttons">Radio Buttons</string>
+    <!-- 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>
 
     <!-- Component Switches -->
@@ -302,8 +302,8 @@
     <string name="component_slider_value_displayed">Display value</string>
     <string name="component_slider_stepped">Stepped</string>
 
-    <!-- Component Progress Indicators -->
-    <string name="component_progress">Progress Indicators</string>
+    <!-- Component Progress indicators -->
+    <string name="component_progress">Progress indicators</string>
     <string name="component_progress_description">Progress bar and activity indicator are used when a process is taking place to illustrate progress and to reassure users that something is happening, and if possible, how long it will take.</string>
     <string name="component_progress_linear">Linear</string>
     <string name="component_progress_determinate">Determinate</string>
@@ -312,7 +312,7 @@
     <string name="component_progress_circular">Circular</string>
     <string name="component_progress_label">Downloading …</string>
 
-    <!-- Components Sheets -->
+    <!-- Component Sheets -->
     <string name="component_sheets_bottom">Sheets: bottom</string>
     <string name="component_sheet_bottom_description">Bottom sheets are surfaces anchored to the bottom of the screen that present users supplemental content.</string>
     <string name="component_sheet_bottom_customize">Customize the bottom sheet</string>

changelog.md

@@ -11,6 +11,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - \[App\] Display `OdsBottomNavigation` XML code implementation ([#671](https://github.com/Orange-OpenSource/ods-android/issues/671))
 
+### Changed
+
+- \[Lib\] Rename `OdsImageTile` to `OdsImageItem` ([#683](https://github.com/Orange-OpenSource/ods-android/issues/683))
+
+### Fixed
+
+- \[Lib\] Fix back button color in `OdsLargeTopAppBar` ([#685](https://github.com/Orange-OpenSource/ods-android/issues/685))
+
 ## [0.17.0](https://github.com/Orange-OpenSource/ods-android/compare/0.16.0...0.17.0) - 2023-11-06
 
 ### Added
@@ -32,7 +40,6 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - \[Lib\] Fix a bug where chip was not properly selected in `OdsChoiceChipsFlowRow` ([#650](https://github.com/Orange-OpenSource/ods-android/issues/650))
 - \[Lib\] Change text color of `OdsTextToggleButtonsRow` selected button for accessibility reason ([#559](https://github.com/Orange-OpenSource/ods-android/issues/559))
 - \[Lib\] Fix vertical padding of buttons in `OdsTextToggleButtonsRow` ([#559](https://github.com/Orange-OpenSource/ods-android/issues/559))
-- \[Lib\] Fix back button color in `OdsLargeTopAppBar` ([#685](https://github.com/Orange-OpenSource/ods-android/issues/685))
 
 ## [0.16.0](https://github.com/Orange-OpenSource/ods-android/compare/0.15.1...0.16.0) - 2023-10-10
 

docs/_data/data_menu.yml

@@ -31,8 +31,8 @@ toc2:
         url: /components/Dialogs_docs
       - page: Floating action buttons
         url: /components/FloatingActionButtons_docs
-      - page: Image tile
-        url: /components/ImageTile_docs
+      - page: Image item
+        url: /components/ImageItem_docs
       - page: List items
         url: /components/ListItems_docs
       - page: Menus