Reactions visual improvements

Stephen Paul Weber created 1 year ago

Change summary

src/main/java/eu/siacs/conversations/ui/BindingAdapters.java        | 31 
src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java |  5 
src/main/res/layout/item_message_received.xml                       |  6 
src/main/res/layout/item_message_sent.xml                           |  6 
4 files changed, 31 insertions(+), 17 deletions(-)

Detailed changes

src/main/java/eu/siacs/conversations/ui/BindingAdapters.java

@@ -1,6 +1,8 @@
 package eu.siacs.conversations.ui;
 
 import android.view.View;
+import android.view.ViewGroup;
+import android.util.TypedValue;
 
 import com.google.android.material.chip.Chip;
 import com.google.android.material.chip.ChipGroup;
@@ -41,6 +43,9 @@ public class BindingAdapters {
             final Consumer<Collection<String>> onModifiedReactions,
             final Runnable addReaction) {
         final var context = chipGroup.getContext();
+        final var size = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 35, context.getResources().getDisplayMetrics());
+        final var corner = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 35, context.getResources().getDisplayMetrics());
+        final var layoutParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, size);
         final List<Map.Entry<String, Integer>> reactions = aggregated.reactions;
         if (reactions == null || reactions.isEmpty()) {
             chipGroup.setVisibility(View.GONE);
@@ -51,9 +56,13 @@ public class BindingAdapters {
                 final var emoji = reaction.getKey();
                 final var count = reaction.getValue();
                 final Chip chip = new Chip(chipGroup.getContext());
-                chip.setEnsureMinTouchTargetSize(false);
+                //chip.setEnsureMinTouchTargetSize(false);
+                chip.setChipMinHeight(size-32.0f);
+                chip.ensureAccessibleTouchTarget(size);
                 chip.setChipStartPadding(0.0f);
                 chip.setChipEndPadding(0.0f);
+                chip.setChipCornerRadius(corner);
+                chip.setLayoutParams(layoutParams);
                 if (count == 1) {
                     chip.setText(emoji);
                 } else {
@@ -91,22 +100,26 @@ public class BindingAdapters {
                         });
                 chipGroup.addView(chip);
             }
-            if (onReceived) {
+            if (addReaction != null) {
                 final Chip chip = new Chip(chipGroup.getContext());
+                chip.setChipMinHeight(size-32.0f);
+                chip.ensureAccessibleTouchTarget(size);
+                chip.setLayoutParams(layoutParams);
+                chip.setChipCornerRadius(corner);
                 chip.setChipIconResource(R.drawable.ic_add_reaction_24dp);
-                chip.setChipStrokeColor(
-                        MaterialColors.getColorStateListOrNull(
-                                chipGroup.getContext(),
-                                com.google.android.material.R.attr.colorTertiary));
+                //chip.setChipStrokeColor(
+                //        MaterialColors.getColorStateListOrNull(
+                //                chipGroup.getContext(),
+                //                com.google.android.material.R.attr.colorTertiary));
                 chip.setChipBackgroundColor(
                         MaterialColors.getColorStateListOrNull(
                                 chipGroup.getContext(),
-                                com.google.android.material.R.attr.colorTertiaryContainer));
+                                com.google.android.material.R.attr.colorSurfaceContainerLow));
                 chip.setChipIconTint(
                         MaterialColors.getColorStateListOrNull(
                                 chipGroup.getContext(),
-                                com.google.android.material.R.attr.colorOnTertiaryContainer));
-                chip.setEnsureMinTouchTargetSize(false);
+                                com.google.android.material.R.attr.colorOnSurface));
+                //chip.setEnsureMinTouchTargetSize(false);
                 chip.setTextEndPadding(0.0f);
                 chip.setTextStartPadding(0.0f);
                 chip.setOnClickListener(v -> addReaction.run());

src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java

@@ -1538,10 +1538,11 @@ public class MessageAdapter extends ArrayAdapter<Message> {
                     reactions -> sendReactions(message, reactions),
                     () -> addReaction(message));
         } else if (type == SENT) {
-            BindingAdapters.setReactionsOnSent(
+            BindingAdapters.setReactionsOnReceived(
                     viewHolder.reactions,
                     message.getAggregatedReactions(),
-                    reactions -> sendReactions(message, reactions));
+                    reactions -> sendReactions(message, reactions),
+                    () -> addReaction(message));
         }
 
         if (type == RECEIVED || type == SENT) {

src/main/res/layout/item_message_received.xml

@@ -128,7 +128,7 @@
             android:id="@+id/reactions_anchor"
             android:layout_width="0dp"
             android:layout_height="0dp"
-            android:layout_marginBottom="4dp"
+            android:layout_marginBottom="12dp"
             app:layout_constraintBottom_toBottomOf="@+id/message_box"
             app:layout_constraintStart_toStartOf="@+id/message_box" />
 
@@ -136,10 +136,10 @@
             android:id="@+id/reactions"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginStart="10dp"
+            android:layout_marginStart="7dp"
             android:orientation="horizontal"
             android:visibility="visible"
-            app:chipSpacingHorizontal="4dp"
+            app:chipSpacingHorizontal="2dp"
             app:layout_constraintHorizontal_bias="0.0"
             app:layout_constraintStart_toStartOf="@+id/message_box"
             app:layout_constraintTop_toBottomOf="@+id/reactions_anchor" />

src/main/res/layout/item_message_sent.xml

@@ -135,7 +135,7 @@
             android:id="@+id/reactions_anchor"
             android:layout_width="0dp"
             android:layout_height="0dp"
-            android:layout_marginBottom="4dp"
+            android:layout_marginBottom="12dp"
             app:layout_constraintBottom_toBottomOf="@+id/message_box"
             app:layout_constraintEnd_toEndOf="@+id/message_box" />
 
@@ -143,10 +143,10 @@
             android:id="@+id/reactions"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginEnd="10dp"
+            android:layout_marginEnd="7dp"
             android:orientation="horizontal"
             android:visibility="visible"
-            app:chipSpacingHorizontal="4dp"
+            app:chipSpacingHorizontal="2dp"
             app:layout_constraintEnd_toEndOf="@+id/message_box"
             app:layout_constraintHorizontal_bias="0.0"
             app:layout_constraintTop_toBottomOf="@+id/reactions_anchor" />