From 1a35a7048d330e14a1dcfda3fda4ca5a223ef8ec Mon Sep 17 00:00:00 2001
From: Sylvain Berfini <sylvain.berfini@belledonne-communications.com>
Date: Wed, 11 Sep 2024 16:20:39 +0200
Subject: [PATCH] Improved emoji reaction picker accessibility when font size
 is increased a lot at OS level

---
 .../res/layout/chat_emoji_reaction_picker.xml | 27 +++++++++----------
 app/src/main/res/values/dimen.xml             |  2 +-
 2 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/app/src/main/res/layout/chat_emoji_reaction_picker.xml b/app/src/main/res/layout/chat_emoji_reaction_picker.xml
index cd823c49c..727219b03 100644
--- a/app/src/main/res/layout/chat_emoji_reaction_picker.xml
+++ b/app/src/main/res/layout/chat_emoji_reaction_picker.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <layout xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:app="http://schemas.android.com/apk/res-auto">
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
 
     <data>
         <import type="android.view.View" />
@@ -32,8 +33,6 @@
             android:onClick="@{() -> model.sendReaction(@string/emoji_thumbs_up)}"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginStart="16dp"
-            android:layout_marginEnd="5dp"
             android:layout_marginTop="5dp"
             android:layout_marginBottom="5dp"
             android:paddingStart="10dp"
@@ -42,11 +41,12 @@
             android:text="@string/emoji_thumbs_up"
             android:textSize="@dimen/chat_bubble_long_press_emoji_reaction_size"
             android:background="@{model.ourReactionIndex == 0 ? @drawable/shape_squircle_gray_200_background : @drawable/shape_empty, default=@drawable/shape_squircle_gray_200_background}"
-            app:layout_constraintHorizontal_chainStyle="spread_inside"
+            app:layout_constraintHorizontal_chainStyle="spread"
             app:layout_constraintTop_toTopOf="@id/emojis_background"
             app:layout_constraintBottom_toBottomOf="@id/emojis_background"
             app:layout_constraintStart_toStartOf="@id/emojis_background"
-            app:layout_constraintEnd_toStartOf="@id/love"/>
+            app:layout_constraintEnd_toStartOf="@id/love"
+            tools:ignore="SpUsage" />
 
         <androidx.appcompat.widget.AppCompatTextView
             style="@style/default_text_style"
@@ -54,7 +54,6 @@
             android:onClick="@{() -> model.sendReaction(@string/emoji_love)}"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginEnd="5dp"
             android:paddingStart="10dp"
             android:paddingEnd="10dp"
             android:paddingBottom="3dp"
@@ -64,7 +63,8 @@
             app:layout_constraintTop_toTopOf="@id/thumbs_up"
             app:layout_constraintBottom_toBottomOf="@id/thumbs_up"
             app:layout_constraintStart_toEndOf="@id/thumbs_up"
-            app:layout_constraintEnd_toStartOf="@id/laughing"/>
+            app:layout_constraintEnd_toStartOf="@id/laughing"
+            tools:ignore="SpUsage" />
 
         <androidx.appcompat.widget.AppCompatTextView
             style="@style/default_text_style"
@@ -72,7 +72,6 @@
             android:onClick="@{() -> model.sendReaction(@string/emoji_laughing)}"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginEnd="5dp"
             android:paddingStart="10dp"
             android:paddingEnd="10dp"
             android:paddingBottom="3dp"
@@ -82,7 +81,8 @@
             app:layout_constraintTop_toTopOf="@id/thumbs_up"
             app:layout_constraintBottom_toBottomOf="@id/thumbs_up"
             app:layout_constraintStart_toEndOf="@id/love"
-            app:layout_constraintEnd_toStartOf="@id/surprised"/>
+            app:layout_constraintEnd_toStartOf="@id/surprised"
+            tools:ignore="SpUsage" />
 
         <androidx.appcompat.widget.AppCompatTextView
             style="@style/default_text_style"
@@ -90,7 +90,6 @@
             android:onClick="@{() -> model.sendReaction(@string/emoji_surprised)}"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginEnd="5dp"
             android:paddingStart="10dp"
             android:paddingEnd="10dp"
             android:paddingBottom="3dp"
@@ -100,7 +99,8 @@
             app:layout_constraintTop_toTopOf="@id/thumbs_up"
             app:layout_constraintBottom_toBottomOf="@id/thumbs_up"
             app:layout_constraintStart_toEndOf="@id/laughing"
-            app:layout_constraintEnd_toStartOf="@id/tear"/>
+            app:layout_constraintEnd_toStartOf="@id/tear"
+            tools:ignore="SpUsage" />
 
         <androidx.appcompat.widget.AppCompatTextView
             style="@style/default_text_style"
@@ -108,7 +108,6 @@
             android:onClick="@{() -> model.sendReaction(@string/emoji_tear)}"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginEnd="5dp"
             android:paddingStart="10dp"
             android:paddingEnd="10dp"
             android:paddingBottom="3dp"
@@ -118,14 +117,14 @@
             app:layout_constraintTop_toTopOf="@id/thumbs_up"
             app:layout_constraintBottom_toBottomOf="@id/thumbs_up"
             app:layout_constraintStart_toEndOf="@id/surprised"
-            app:layout_constraintEnd_toStartOf="@id/plus"/>
+            app:layout_constraintEnd_toStartOf="@id/plus"
+            tools:ignore="SpUsage" />
 
         <ImageView
             android:id="@+id/plus"
             android:onClick="@{pickEmojiClickListener}"
             android:layout_width="wrap_content"
             android:layout_height="0dp"
-            android:layout_marginEnd="16dp"
             android:paddingStart="10dp"
             android:paddingEnd="10dp"
             android:paddingBottom="6dp"
diff --git a/app/src/main/res/values/dimen.xml b/app/src/main/res/values/dimen.xml
index 1cc1e80e3..e5d695ce7 100644
--- a/app/src/main/res/values/dimen.xml
+++ b/app/src/main/res/values/dimen.xml
@@ -78,7 +78,7 @@
     <dimen name="chat_bubble_top_margin">8dp</dimen>
     <dimen name="chat_bubble_grouped_bottom_margin">2dp</dimen>
     <dimen name="chat_bubble_bottom_margin">8dp</dimen>
-    <dimen name="chat_bubble_long_press_emoji_reaction_size">30sp</dimen>
+    <dimen name="chat_bubble_long_press_emoji_reaction_size">30dp</dimen>
     <dimen name="chat_bubble_grid_image_size">87dp</dimen>
     <dimen name="chat_bubble_big_image_max_size">150dp</dimen>
     <dimen name="chat_bubble_grid_file_width">152dp</dimen> <!-- 271 - 87 - 32 -->