From 056c27a270d68343ba0fe4c041fc26160f741e3d Mon Sep 17 00:00:00 2001 From: SpiritCroc Date: Sun, 1 Nov 2020 14:59:57 +0100 Subject: [PATCH] Overlay image/video items with footer Change-Id: I353ab5223b60677486d590d7c38a8186e3a8c3db --- .../detail/timeline/item/AbsMessageItem.kt | 36 +++++++++++++++++++ .../timeline/item/MessageImageVideoItem.kt | 5 +++ .../res/drawable-ldrtl/timestamp_overlay.xml | 10 ++++++ .../main/res/drawable/timestamp_overlay.xml | 10 ++++++ .../res/layout/item_timeline_event_base.xml | 6 ++-- vector/src/main/res/values/attrs_sc.xml | 3 ++ vector/src/main/res/values/colors_sc.xml | 3 ++ vector/src/main/res/values/theme_dark.xml | 2 ++ vector/src/main/res/values/theme_light.xml | 2 ++ 9 files changed, 74 insertions(+), 3 deletions(-) create mode 100644 vector/src/main/res/drawable-ldrtl/timestamp_overlay.xml create mode 100644 vector/src/main/res/drawable/timestamp_overlay.xml diff --git a/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsMessageItem.kt b/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsMessageItem.kt index ae8ec1c0b6..113da03eb9 100644 --- a/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsMessageItem.kt +++ b/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsMessageItem.kt @@ -385,6 +385,9 @@ abstract class AbsMessageItem : AbsBaseMessageItem (holder.bubbleFootView.layoutParams as RelativeLayout.LayoutParams).addRule(RelativeLayout.ALIGN_BOTTOM, R.id.viewStubContainer) (holder.bubbleFootView.layoutParams as RelativeLayout.LayoutParams).removeRule(RelativeLayout.BELOW) if (needsFooterReservation(holder)) { + // Remove style used when not having reserved space + removeFooterOverlayStyle(holder, density) + // Calculate required footer space val timeWidth: Int val timeHeight: Int @@ -416,10 +419,14 @@ abstract class AbsMessageItem : AbsBaseMessageItem footerHeight += holder.bubbleFootView.paddingTop + holder.bubbleFootView.paddingBottom } reserveFooterSpace(holder, footerWidth, footerHeight) + } else { + // We have no reserved space -> style it to ensure readability on arbitrary backgrounds + styleFooterOverlay(holder, density) } } else { (holder.bubbleFootView.layoutParams as RelativeLayout.LayoutParams).addRule(RelativeLayout.BELOW, R.id.viewStubContainer) (holder.bubbleFootView.layoutParams as RelativeLayout.LayoutParams).removeRule(RelativeLayout.ALIGN_BOTTOM) + removeFooterOverlayStyle(holder, density) } } } @@ -437,4 +444,33 @@ abstract class AbsMessageItem : AbsBaseMessageItem setFlatRtl(holder.reactionsContainer, if (reverseBubble) reverseDirection else defaultDirection, holder.eventBaseView.resources.configuration.layoutDirection) } + + private fun tintFooter(holder: H, color: Int) { + val tintList = ColorStateList(arrayOf(intArrayOf(0)), intArrayOf(color)) + holder.bubbleFooterReadReceipt.imageTintList = tintList + holder.bubbleFooterTimeView.setTextColor(tintList) + } + + private fun styleFooterOverlay(holder: H, density: Float) { + holder.bubbleFootView.setBackgroundResource(R.drawable.timestamp_overlay) + tintFooter(holder, ThemeUtils.getColor(holder.bubbleFootView.context, R.attr.timestamp_overlay_fg)) + val padding = round(2*density).toInt() + holder.bubbleFootView.setPaddingRelative( + padding, + padding, + padding + round(4*density).toInt(), // compensate from inner view padding on the other side + padding + ) + } + + private fun removeFooterOverlayStyle(holder: H, density: Float) { + holder.bubbleFootView.background = null + tintFooter(holder, ThemeUtils.getColor(holder.bubbleFootView.context, R.attr.riotx_text_secondary)) + holder.bubbleFootView.setPaddingRelative( + 0, + round(4*density).toInt(), + 0, + 0 + ) + } } diff --git a/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/MessageImageVideoItem.kt b/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/MessageImageVideoItem.kt index e1edbaa596..b32b8be474 100644 --- a/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/MessageImageVideoItem.kt +++ b/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/MessageImageVideoItem.kt @@ -112,6 +112,11 @@ abstract class MessageImageVideoItem : AbsMessageItem(R.id.messageMediaUploadProgressLayout) diff --git a/vector/src/main/res/drawable-ldrtl/timestamp_overlay.xml b/vector/src/main/res/drawable-ldrtl/timestamp_overlay.xml new file mode 100644 index 0000000000..fb6ae76ef8 --- /dev/null +++ b/vector/src/main/res/drawable-ldrtl/timestamp_overlay.xml @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/vector/src/main/res/drawable/timestamp_overlay.xml b/vector/src/main/res/drawable/timestamp_overlay.xml new file mode 100644 index 0000000000..00aa4c4c99 --- /dev/null +++ b/vector/src/main/res/drawable/timestamp_overlay.xml @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/vector/src/main/res/layout/item_timeline_event_base.xml b/vector/src/main/res/layout/item_timeline_event_base.xml index b0fdebfd21..7f7f9fc255 100644 --- a/vector/src/main/res/layout/item_timeline_event_base.xml +++ b/vector/src/main/res/layout/item_timeline_event_base.xml @@ -206,7 +206,7 @@ android:layout_marginStart="4dp" android:layout_alignEnd="@id/viewStubContainer" tools:layout_alignBottom="@id/viewStubContainer" - android:paddingTop="4dp" + tools:paddingTop="4dp" android:id="@+id/bubbleFootView"> @@ -229,7 +229,7 @@ android:paddingStart="4dp" android:paddingEnd="0dp" android:layout_gravity="bottom" - app:tint="?riotx_text_secondary" + tools:tint="?riotx_text_secondary" tools:src="@drawable/ic_processing_msg" /> diff --git a/vector/src/main/res/values/attrs_sc.xml b/vector/src/main/res/values/attrs_sc.xml index 444bc3eab4..89423e68ec 100644 --- a/vector/src/main/res/values/attrs_sc.xml +++ b/vector/src/main/res/values/attrs_sc.xml @@ -12,6 +12,9 @@ + + + diff --git a/vector/src/main/res/values/colors_sc.xml b/vector/src/main/res/values/colors_sc.xml index 790d13f277..1b8e7fe8fe 100644 --- a/vector/src/main/res/values/colors_sc.xml +++ b/vector/src/main/res/values/colors_sc.xml @@ -21,4 +21,7 @@ #ff424242 #80ffffff + + #ffffff + #80000000 diff --git a/vector/src/main/res/values/theme_dark.xml b/vector/src/main/res/values/theme_dark.xml index 1dbe6da3cc..b17f3f2d16 100644 --- a/vector/src/main/res/values/theme_dark.xml +++ b/vector/src/main/res/values/theme_dark.xml @@ -189,6 +189,8 @@ @color/riotx_positive_accent_alpha12 ?riotx_background @color/riotx_unread_room_badge_dark + @color/timestamp_overlay_fg + @color/timestamp_overlay_bg @color/riotx_header_panel_background_dark @color/riotx_header_panel_background_dark diff --git a/vector/src/main/res/values/theme_light.xml b/vector/src/main/res/values/theme_light.xml index 32000acc91..2dba4178ed 100644 --- a/vector/src/main/res/values/theme_light.xml +++ b/vector/src/main/res/values/theme_light.xml @@ -189,6 +189,8 @@ @color/riotx_positive_accent_alpha12 ?riotx_background @color/riotx_unread_room_badge_light + @color/timestamp_overlay_fg + @color/timestamp_overlay_bg @color/riotx_header_panel_background_dark