[#683] Rename OdsImageTile to OdsImageItem

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

@@ -222,15 +222,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>

changelog.md

@@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - \[Lib\] Review and update technical documentation ([#638](https://github.com/Orange-OpenSource/ods-android/issues/638))
 - \[Lib\] Update `OdsListItem` API ([#650](https://github.com/Orange-OpenSource/ods-android/issues/650))
 - \[Lib\] Update `OdsSnackbarHost` API ([#674](https://github.com/Orange-OpenSource/ods-android/issues/674))
+- \[Lib\] Rename `OdsImageTile` to `OdsImageItem` ([#683](https://github.com/Orange-OpenSource/ods-android/issues/683))
 
 ### Fixed
 

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

docs/components/ImageTile.md → docs/components/ImageItem.md

@@ -1,6 +1,6 @@
 ---
 layout: detail
-title: Image Tile
+title: Image item
 description:
 ---
 
@@ -10,37 +10,37 @@ description:
 * [Accessibility](#accessibility)
 * [Implementation](#implementation)
     * [Jetpack Compose](#jetpack-compose)
-        * [OdsImageTile API](#odsimagetile-api)
+        * [OdsImageItem API](#odsimageitem-api)
 
 ---
 
 ## Specifications references
 
-- [Design System Manager - Image Tile](https://system.design.orange.com/0c1af118d/p/49434d-image-item)
+- [Design System Manager - Image item](https://system.design.orange.com/0c1af118d/p/49434d-image-item)
 - [Material Design - Image lists](https://m2.material.io/components/image-lists)
 
 ## Accessibility
 
 Please follow [accessibility criteria for development](https://a11y-guidelines.orange.com/en/mobile/android/development/).
 
-An image in an `OdsImageTile` should always be associated to a content description. This is the reason why the `OdsImageTileImage` forces the developer to fill a content description parameter.
+An image in an `OdsImageItem` should always be associated to a content description. This is the reason why the `OdsImageItemImage` forces the developer to fill a content description parameter.
 
 ## Implementation
 
 #### Jetpack Compose
 
-You can use the `OdsImageTile` composable like this:
+You can use the `OdsImageItem` composable like this:
 
 ```kotlin
-OdsImageTile(
-    image = OdsImageTileImage(
+OdsImageItem(
+    image = OdsImageItemImage(
         painterResource(id = R.drawable.placeholder),
         "Picture content description"
     ),
     modifier = modifier,
-    captionDisplayType = OdsImageTileCaptionDisplayType.Overlay,
-    title = "Component Image Tile",
-    icon = OdsImageTileIconToggleButton(
+    captionDisplayType = OdsImageItemCaptionDisplayType.Overlay,
+    title = "Component Image item",
+    icon = OdsImageItemIconToggleButton(
         uncheckedIcon = OdsIconButtonIcon(
             painterResource(id = R.drawable.ic_heart_outlined),
             "Add to favourites"
@@ -56,14 +56,14 @@ OdsImageTile(
 )
 ```
 
-##### OdsImageTile API
+##### OdsImageItem API
 
 Parameter | Default value | Description
 -- | -- | --
-`image: OdsImageTileImage` | | Image displayed into the tile
-`legendAreaDisplayType: OdsImageTileLegendAreaDisplayType` | | Controls how the title and the icon are displayed relatively to the image. If set to `OdsImageTileLegendAreaDisplayType.None`, no legend area will be displayed.
-`modifier: Modifier` | `Modifier` | `Modifier` applied to the image tile
-`title: String?` | `null` | Title displayed into the tile. It is linked to the image and displayed according to the `legendAreaDisplayType` value.
-`icon: OdsImageTileIconToggleButton` | `null` | Clickable icon displayed next to the `title`
-`onClick: (() -> Unit)?` | `null` | Callback invoked on tile click
+`image: OdsImageItemImage` | | Image displayed into the item
+`legendAreaDisplayType: OdsImageItemLegendAreaDisplayType` | | Controls how the title and the icon are displayed relatively to the image. If set to `OdsImageItemLegendAreaDisplayType.None`, no legend area will be displayed.
+`modifier: Modifier` | `Modifier` | `Modifier` applied to the image item
+`title: String?` | `null` | Title displayed into the image item. It is linked to the image and displayed according to the `legendAreaDisplayType` value.
+`icon: OdsImageItemIconToggleButton` | `null` | Clickable icon displayed next to the `title`
+`onClick: (() -> Unit)?` | `null` | Callback invoked on image item click
 {:.table}

docs/components/ImageItem_docs.md

@@ -0,0 +1,4 @@
+---
+layout: main
+content_page: ImageItem.md
+---