From fa5acb49cae990f1ca31f23b460c30165820a492 Mon Sep 17 00:00:00 2001
From: SpiritCroc <dev@spiritcroc.de>
Date: Mon, 21 Dec 2020 18:29:48 +0100
Subject: [PATCH] Align reactions better with message bubbles

Change-Id: I128a23009b1636ce10619e17fccc507fc39028d4
---
 .../timeline/item/AbsBaseMessageItem.kt       |  1 +
 .../detail/timeline/item/AbsMessageItem.kt    | 40 ++++++++++++++-----
 2 files changed, 32 insertions(+), 9 deletions(-)

diff --git a/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsBaseMessageItem.kt b/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsBaseMessageItem.kt
index 29aca2c4d5..99dd884a02 100644
--- a/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsBaseMessageItem.kt
+++ b/vector/src/main/java/im/vector/app/features/home/room/detail/timeline/item/AbsBaseMessageItem.kt
@@ -123,6 +123,7 @@ abstract class AbsBaseMessageItem<H : AbsBaseMessageItem.Holder> : BaseEventItem
 
     abstract class Holder(@IdRes stubId: Int) : BaseEventItem.BaseHolder(stubId) {
         val reactionsContainer by bind<ViewGroup>(R.id.reactionsContainer)
+        val informationBottom by bind<ViewGroup>(R.id.informationBottom)
         val e2EDecorationView by bind<ImageView>(R.id.messageE2EDecoration)
     }
 
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 414a2195c7..7558c2cecf 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
@@ -326,8 +326,11 @@ abstract class AbsMessageItem<H : AbsMessageItem.Holder> : AbsBaseMessageItem<H>
             BubbleThemeUtils.BUBBLE_STYLE_BOTH,
             BubbleThemeUtils.BUBBLE_STYLE_BOTH_HIDDEN,
             BubbleThemeUtils.BUBBLE_STYLE_START_HIDDEN -> {
+                // Padding for bubble content: long for side with tail, short for other sides
                 val longPadding: Int
                 val shortPadding: Int
+                // Padding for other views that align with the bubble (should be roughly the bubble tail width
+                var alignPadding: Int
                 if (BubbleThemeUtils.drawsActualBubbles(bubbleStyle)) {
                     if (attributes.informationData.showInformation) {
                         bubbleView.setBackgroundResource(if (reverseBubble) R.drawable.msg_bubble_outgoing else R.drawable.msg_bubble_incoming)
@@ -343,9 +346,11 @@ abstract class AbsMessageItem<H : AbsMessageItem.Holder> : AbsBaseMessageItem<H>
                     bubbleView.backgroundTintList = tintColor
                     longPadding = 20
                     shortPadding = 8
+                    alignPadding = 12
                 } else {
                     longPadding = 10
                     shortPadding = 0//if (attributes.informationData.showInformation && !hideSenderInformation()) { 8 } else { 0 }
+                    alignPadding = 0
                 }
                 val density = bubbleView.resources.displayMetrics.density
                 if (reverseBubble) {
@@ -360,20 +365,36 @@ abstract class AbsMessageItem<H : AbsMessageItem.Holder> : AbsBaseMessageItem<H>
                 (bubbleView.layoutParams as RelativeLayout.LayoutParams).topMargin = round(8*density).toInt()
                 (bubbleView.layoutParams as RelativeLayout.LayoutParams).bottomMargin = round(8*density).toInt()
                  */
-                // TODO padding?
+                val shortPaddingDp = round(shortPadding * density).toInt()
+                val longPaddingDp = round(longPadding * density).toInt()
+                val alignPaddingDp = round(alignPadding * density).toInt()
                 if (reverseBubble) {
                     bubbleView.setPaddingRelative(
-                            round(shortPadding * density).toInt(),
-                            round(shortPadding * density).toInt(),
-                            round(longPadding * density).toInt(),
-                            round(shortPadding * density).toInt()
+                            shortPaddingDp,
+                            shortPaddingDp,
+                            longPaddingDp,
+                            shortPaddingDp
+                    )
+                    // Align reactions container to bubble
+                    holder.informationBottom.setPaddingRelative(
+                            0,
+                            0,
+                            alignPaddingDp,
+                            0
                     )
                 } else {
                     bubbleView.setPaddingRelative(
-                            round(longPadding * density).toInt(),
-                            round(shortPadding * density).toInt(),
-                            round(shortPadding * density).toInt(),
-                            round(shortPadding * density).toInt()
+                            longPaddingDp,
+                            shortPaddingDp,
+                            shortPaddingDp,
+                            shortPaddingDp
+                    )
+                    // Align reactions container to bubble
+                    holder.informationBottom.setPaddingRelative(
+                            alignPaddingDp,
+                            0,
+                            0,
+                            0
                     )
                 }
 
@@ -451,6 +472,7 @@ abstract class AbsMessageItem<H : AbsMessageItem.Holder> : AbsBaseMessageItem<H>
                 (bubbleView.layoutParams as RelativeLayout.LayoutParams).bottomMargin = 0
                  */
                 bubbleView.setPadding(0, 0, 0, 0)
+                holder.informationBottom.setPadding(0, 0, 0, 0)
             }
         }