From 464ac3bce22224c224263cda93063ddda5ba8ced Mon Sep 17 00:00:00 2001
From: Benoit Marty <benoit@matrix.org>
Date: Thu, 30 Dec 2021 16:36:36 +0100
Subject: [PATCH] Fix blink effect when opening the attachment popup, and
 improve clickability of the buttons

---
 .../ui-styles/src/main/res/values/dimens.xml  |  5 ++
 ...composer_layout_constraint_set_compact.xml |  8 +-
 ...omposer_layout_constraint_set_expanded.xml |  8 +-
 .../layout/view_attachment_type_selector.xml  | 75 ++++++++++---------
 .../layout/view_voice_message_recorder.xml    |  4 +-
 5 files changed, 53 insertions(+), 47 deletions(-)

diff --git a/library/ui-styles/src/main/res/values/dimens.xml b/library/ui-styles/src/main/res/values/dimens.xml
index 864f3d3d7f..9fbf8958da 100644
--- a/library/ui-styles/src/main/res/values/dimens.xml
+++ b/library/ui-styles/src/main/res/values/dimens.xml
@@ -42,4 +42,9 @@
 
     <!--  Preview Url  -->
     <dimen name="preview_url_view_corner_radius">8dp</dimen>
+
+    <!-- Composer -->
+    <dimen name="composer_min_height">56dp</dimen>
+    <dimen name="composer_attachment_size">52dp</dimen>
+    <dimen name="composer_attachment_margin">1dp</dimen>
 </resources>
\ No newline at end of file
diff --git a/vector/src/main/res/layout/composer_layout_constraint_set_compact.xml b/vector/src/main/res/layout/composer_layout_constraint_set_compact.xml
index 3378878ac6..7e926b860c 100644
--- a/vector/src/main/res/layout/composer_layout_constraint_set_compact.xml
+++ b/vector/src/main/res/layout/composer_layout_constraint_set_compact.xml
@@ -108,9 +108,9 @@
 
     <ImageButton
         android:id="@+id/attachmentButton"
-        android:layout_width="52dp"
-        android:layout_height="52dp"
-        android:layout_margin="1dp"
+        android:layout_width="@dimen/composer_attachment_size"
+        android:layout_height="@dimen/composer_attachment_size"
+        android:layout_margin="@dimen/composer_attachment_margin"
         android:background="?android:attr/selectableItemBackground"
         android:contentDescription="@string/option_send_files"
         android:src="@drawable/ic_attachment"
@@ -166,7 +166,7 @@
     <ImageButton
         android:id="@+id/sendButton"
         android:layout_width="56dp"
-        android:layout_height="56dp"
+        android:layout_height="@dimen/composer_min_height"
         android:layout_marginEnd="2dp"
         android:background="@drawable/bg_send"
         android:contentDescription="@string/send"
diff --git a/vector/src/main/res/layout/composer_layout_constraint_set_expanded.xml b/vector/src/main/res/layout/composer_layout_constraint_set_expanded.xml
index 8057957941..69f12bc782 100644
--- a/vector/src/main/res/layout/composer_layout_constraint_set_expanded.xml
+++ b/vector/src/main/res/layout/composer_layout_constraint_set_expanded.xml
@@ -121,9 +121,9 @@
 
     <ImageButton
         android:id="@+id/attachmentButton"
-        android:layout_width="52dp"
-        android:layout_height="52dp"
-        android:layout_margin="1dp"
+        android:layout_width="@dimen/composer_attachment_size"
+        android:layout_height="@dimen/composer_attachment_size"
+        android:layout_margin="@dimen/composer_attachment_margin"
         android:background="?android:attr/selectableItemBackground"
         android:contentDescription="@string/option_send_files"
         android:src="@drawable/ic_attachment"
@@ -178,7 +178,7 @@
     <ImageButton
         android:id="@+id/sendButton"
         android:layout_width="56dp"
-        android:layout_height="56dp"
+        android:layout_height="@dimen/composer_min_height"
         android:layout_marginEnd="2dp"
         android:background="@drawable/bg_send"
         android:contentDescription="@string/send"
diff --git a/vector/src/main/res/layout/view_attachment_type_selector.xml b/vector/src/main/res/layout/view_attachment_type_selector.xml
index 3724affdd2..72b95c98db 100644
--- a/vector/src/main/res/layout/view_attachment_type_selector.xml
+++ b/vector/src/main/res/layout/view_attachment_type_selector.xml
@@ -2,17 +2,15 @@
 <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
-    android:layout_height="wrap_content"
-    android:background="?android:colorBackground"
-    android:paddingTop="12dp"
-    android:paddingBottom="12dp">
+    android:layout_height="@dimen/composer_min_height"
+    android:background="?android:colorBackground">
 
     <ImageButton
         android:id="@+id/attachmentCloseButton"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginStart="12dp"
-        android:background="@drawable/circle"
+        android:layout_width="@dimen/composer_attachment_size"
+        android:layout_height="@dimen/composer_attachment_size"
+        android:layout_margin="@dimen/composer_attachment_margin"
+        android:background="@null"
         android:contentDescription="@string/action_close"
         android:src="@drawable/ic_attachment_close"
         app:layout_constraintBottom_toBottomOf="parent"
@@ -22,7 +20,7 @@
     <HorizontalScrollView
         android:layout_width="0dp"
         android:layout_height="wrap_content"
-        android:layout_marginStart="24dp"
+        android:layout_marginStart="4dp"
         android:scrollbars="none"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
@@ -32,77 +30,80 @@
         <LinearLayout
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_gravity="center_vertical"
-            android:gravity="center_vertical"
             android:orientation="horizontal">
 
             <ImageButton
                 android:id="@+id/attachmentGalleryButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
+                android:layout_width="@dimen/layout_touch_size"
+                android:layout_height="@dimen/layout_touch_size"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/attachment_type_gallery"
                 android:src="@drawable/ic_attachment_gallery" />
 
             <ImageButton
                 android:id="@+id/attachmentStickersButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="24dp"
+                android:layout_width="@dimen/layout_touch_size"
+                android:layout_height="@dimen/layout_touch_size"
+                android:layout_marginStart="2dp"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/attachment_type_sticker"
-                android:src="@drawable/ic_attachment_sticker" />
+                android:src="@drawable/ic_attachment_sticker"
+                app:tint="?colorPrimary" />
 
             <ImageButton
                 android:id="@+id/attachmentFileButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="24dp"
+                android:layout_width="@dimen/layout_touch_size"
+                android:layout_height="@dimen/layout_touch_size"
+                android:layout_marginStart="2dp"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/attachment_type_file"
-                android:src="@drawable/ic_attachment_file" />
+                android:src="@drawable/ic_attachment_file"
+                app:tint="?colorPrimary" />
 
             <ImageButton
                 android:id="@+id/attachmentPollButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="24dp"
+                android:layout_width="@dimen/layout_touch_size"
+                android:layout_height="@dimen/layout_touch_size"
+                android:layout_marginStart="2dp"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/attachment_type_poll"
-                android:src="@drawable/ic_attachment_poll" />
+                android:src="@drawable/ic_attachment_poll"
+                app:tint="?colorPrimary" />
 
             <ImageButton
                 android:id="@+id/attachmentCameraButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="24dp"
+                android:layout_width="@dimen/layout_touch_size"
+                android:layout_height="@dimen/layout_touch_size"
+                android:layout_marginStart="2dp"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/attachment_type_camera"
-                android:src="@drawable/ic_attachment_camera" />
+                android:src="@drawable/ic_attachment_camera"
+                app:tint="?colorPrimary" />
 
-            <!-- TODO. Request for new icon and remove tint color later -->
+            <!-- TODO. Request for new icon -->
             <ImageButton
                 android:id="@+id/attachmentAudioButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="24dp"
+                android:layout_width="@dimen/layout_touch_size"
+                android:layout_height="@dimen/layout_touch_size"
+                android:layout_marginStart="2dp"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/attachment_type_audio"
                 android:src="@drawable/ic_attachment_audio_white_24dp"
                 app:tint="?colorPrimary" />
 
-            <!-- TODO. Request for new icon and remove tint color later -->
+            <!-- TODO. Request for new icon -->
             <ImageButton
                 android:id="@+id/attachmentContactButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="24dp"
+                android:layout_width="@dimen/layout_touch_size"
+                android:layout_height="@dimen/layout_touch_size"
+                android:layout_marginStart="2dp"
                 android:background="?android:attr/selectableItemBackground"
                 android:contentDescription="@string/attachment_type_contact"
                 android:src="@drawable/ic_attachment_contact_white_24dp"
                 app:tint="?colorPrimary" />
 
         </LinearLayout>
+
     </HorizontalScrollView>
 
 
diff --git a/vector/src/main/res/layout/view_voice_message_recorder.xml b/vector/src/main/res/layout/view_voice_message_recorder.xml
index 53be4f07f6..9f8e58d724 100644
--- a/vector/src/main/res/layout/view_voice_message_recorder.xml
+++ b/vector/src/main/res/layout/view_voice_message_recorder.xml
@@ -34,7 +34,7 @@
     <ImageButton
         android:id="@+id/voiceMessageSendButton"
         android:layout_width="56dp"
-        android:layout_height="56dp"
+        android:layout_height="@dimen/composer_min_height"
         android:background="@drawable/bg_send"
         android:contentDescription="@string/send"
         android:scaleType="center"
@@ -232,8 +232,8 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginBottom="84dp"
-        android:visibility="gone"
         android:accessibilityLiveRegion="polite"
+        android:visibility="gone"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"