Merge branch 'recolour-bubbles'

Stephen Paul Weber created

* recolour-bubbles:
  Fix shadow, add tails, fix monochrome
  Match theme colours
  Less bubbly
  Remove unused 9patch
  add the newly created color entries to the bubble Drawable
  add XML entries for sent/received bubbles
  remove hardcoded bubble color
  link all the old 9patch refereces to the new Drawables
  Tweak the chat page for the new bubbles
  forgot to commit the new bubble Shape Drawables
  link all message bubbles from all themes to the same XML drawable
  use the new msg bubble XML instead of the 9patch PNGs

Change summary

src/cheogram/res/values/themes.xml                                   | 39 
src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java  | 12 
src/main/res/drawable-hdpi/message_bubble_received_dark.9.png        |  0 
src/main/res/drawable-hdpi/message_bubble_received_grey.9.png        |  0 
src/main/res/drawable-hdpi/message_bubble_received_warning.9.png     |  0 
src/main/res/drawable-hdpi/message_bubble_received_white.9.png       |  0 
src/main/res/drawable-hdpi/message_bubble_sent.9.png                 |  0 
src/main/res/drawable-hdpi/message_bubble_sent_grey.9.png            |  0 
src/main/res/drawable-mdpi/message_bubble_received.9.png             |  0 
src/main/res/drawable-mdpi/message_bubble_received_dark.9.png        |  0 
src/main/res/drawable-mdpi/message_bubble_received_grey.9.png        |  0 
src/main/res/drawable-mdpi/message_bubble_received_obsidian.9.png    |  0 
src/main/res/drawable-mdpi/message_bubble_received_warning.9.png     |  0 
src/main/res/drawable-mdpi/message_bubble_received_white.9.png       |  0 
src/main/res/drawable-mdpi/message_bubble_sent.9.png                 |  0 
src/main/res/drawable-mdpi/message_bubble_sent_grey.9.png            |  0 
src/main/res/drawable-xhdpi/message_bubble_received.9.png            |  0 
src/main/res/drawable-xhdpi/message_bubble_received_dark.9.png       |  0 
src/main/res/drawable-xhdpi/message_bubble_received_grey.9.png       |  0 
src/main/res/drawable-xhdpi/message_bubble_received_obsidian.9.png   |  0 
src/main/res/drawable-xhdpi/message_bubble_received_warning.9.png    |  0 
src/main/res/drawable-xhdpi/message_bubble_received_white.9.png      |  0 
src/main/res/drawable-xhdpi/message_bubble_sent.9.png                |  0 
src/main/res/drawable-xhdpi/message_bubble_sent_grey.9.png           |  0 
src/main/res/drawable-xxhdpi/message_bubble_received.9.png           |  0 
src/main/res/drawable-xxhdpi/message_bubble_received_dark.9.png      |  0 
src/main/res/drawable-xxhdpi/message_bubble_received_grey.9.png      |  0 
src/main/res/drawable-xxhdpi/message_bubble_received_obsidian.9.png  |  0 
src/main/res/drawable-xxhdpi/message_bubble_received_warning.9.png   |  0 
src/main/res/drawable-xxhdpi/message_bubble_received_white.9.png     |  0 
src/main/res/drawable-xxhdpi/message_bubble_sent.9.png               |  0 
src/main/res/drawable-xxhdpi/message_bubble_sent_grey.9.png          |  0 
src/main/res/drawable-xxxhdpi/message_bubble_received.9.png          |  0 
src/main/res/drawable-xxxhdpi/message_bubble_received_dark.9.png     |  0 
src/main/res/drawable-xxxhdpi/message_bubble_received_grey.9.png     |  0 
src/main/res/drawable-xxxhdpi/message_bubble_received_obsidian.9.png |  0 
src/main/res/drawable-xxxhdpi/message_bubble_received_warning.9.png  |  0 
src/main/res/drawable-xxxhdpi/message_bubble_received_white.9.png    |  0 
src/main/res/drawable-xxxhdpi/message_bubble_sent.9.png              |  0 
src/main/res/drawable-xxxhdpi/message_bubble_sent_grey.9.png         |  0 
src/main/res/drawable/ic_message_bubble_received.xml                 | 17 
src/main/res/drawable/message_bubble_received.xml                    | 52 
src/main/res/drawable/message_bubble_sent.xml                        | 52 
src/main/res/layout/message_received.xml                             | 48 
src/main/res/layout/message_sent.xml                                 | 14 
src/main/res/values/attrs.xml                                        | 11 
src/main/res/values/themes.xml                                       |  8 
47 files changed, 193 insertions(+), 60 deletions(-)

Detailed changes

src/cheogram/res/values/themes.xml 🔗

@@ -7,6 +7,12 @@
         <item name="colorAccent">#1E0036</item>
         <item name="popupOverlayStyle">@style/ThemeOverlay.AppCompat.Light</item>
 
+        <item name="message_bubble_received_bg">?colorPrimary</item>
+        <item name="message_bubble_sent_bg">?color_background_primary</item>
+        <item name="message_bubble_shadow_light">#00CCCCCC</item>
+        <item name="message_bubble_shadow_dark">#FFCCCCCC</item>
+        <item name="message_bubble_shadow_dark_top">#DDCCCCCC</item>
+
         <item name="color_background_primary">@color/grey50</item>
         <item name="color_background_secondary">@color/grey200</item>
         <item name="color_background_tertiary">@color/grey300</item>
@@ -62,11 +68,8 @@
         <item name="ic_make_audio_call" type="reference">@drawable/ic_call_black54_24dp</item>
         <item name="ic_make_video_call" type="reference">@drawable/ic_videocam_black54_24dp</item>
 
-        <item name="message_bubble_received_monochrome" type="reference">
-            @drawable/message_bubble_received_white
-        </item>
         <item name="message_bubble_sent" type="reference">@drawable/message_bubble_sent</item>
-        <item name="message_bubble_received_green" type="reference">
+        <item name="message_bubble_received" type="reference">
             @drawable/message_bubble_received
         </item>
 
@@ -155,6 +158,12 @@
         <item name="popupOverlayStyle">@style/ThemeOverlay.AppCompat.Dark</item>
         <item name="android:navigationBarColor" tools:targetApi="21">@color/black</item>
 
+        <item name="message_bubble_received_bg">?colorPrimary</item>
+        <item name="message_bubble_sent_bg">?color_background_primary</item>
+        <item name="message_bubble_shadow_light">#00424242</item>
+        <item name="message_bubble_shadow_dark">#FF424242</item>
+        <item name="message_bubble_shadow_dark_top">#DD424242</item>
+
         <item name="color_background_primary">@color/grey800</item>
         <item name="color_background_secondary">@color/grey900</item>
         <item name="color_background_tertiary">@color/grey700</item>
@@ -218,14 +227,6 @@
         <item name="ic_attach_photo" type="reference">@drawable/ic_attach_photo_white</item>
         <item name="ic_attach_record" type="reference">@drawable/ic_attach_record_white</item>
 
-        <item name="message_bubble_received_monochrome" type="reference">
-            @drawable/message_bubble_received_grey
-        </item>
-        <item name="message_bubble_sent" type="reference">@drawable/message_bubble_sent_grey</item>
-        <item name="message_bubble_received_green" type="reference">
-            @drawable/message_bubble_received_dark
-        </item>
-
         <item name="unread_count">@color/perpy</item>
 
         <item name="conversations_overview_background">@color/green900</item>
@@ -309,19 +310,17 @@
         <item name="colorPrimaryDark">#1E0036</item>
         <item name="colorAccent">@color/yeller</item>
 
+        <item name="message_bubble_received_bg">?colorPrimary</item>
+        <item name="message_bubble_sent_bg">?color_background_primary</item>
+        <item name="message_bubble_shadow_light">#00000000</item>
+        <item name="message_bubble_shadow_dark">#FF000000</item>
+        <item name="message_bubble_shadow_dark_top">#DD000000</item>
+
         <item name="color_background_primary">#0E0020</item>
         <item name="color_background_secondary">@color/black</item>
         <item name="color_background_tertiary">#1E0036</item>
         <item name="color_background_overlay">@color/black26</item>
 
-        <item name="message_bubble_received_monochrome" type="reference">
-            @drawable/message_bubble_received_grey
-        </item>
-        <item name="message_bubble_sent" type="reference">@drawable/message_bubble_sent_grey</item>
-        <item name="message_bubble_received_green" type="reference">
-            @drawable/message_bubble_received_obsidian
-        </item>
-
         <item name="unread_count">#1E0036</item>
     </style>
 

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

@@ -5,6 +5,7 @@ import android.app.Activity;
 import android.content.Intent;
 import android.content.SharedPreferences;
 import android.content.pm.PackageManager;
+import android.graphics.PorterDuff;
 import android.graphics.Typeface;
 import android.net.Uri;
 import android.preference.PreferenceManager;
@@ -65,6 +66,7 @@ import eu.siacs.conversations.ui.text.QuoteSpan;
 import eu.siacs.conversations.ui.util.AvatarWorkerTask;
 import eu.siacs.conversations.ui.util.MyLinkify;
 import eu.siacs.conversations.ui.util.QuoteHelper;
+import eu.siacs.conversations.ui.util.StyledAttributes;
 import eu.siacs.conversations.ui.util.ViewUtil;
 import eu.siacs.conversations.ui.widget.ClickableMovementMethod;
 import eu.siacs.conversations.utils.CryptoHelper;
@@ -850,16 +852,14 @@ public class MessageAdapter extends ArrayAdapter<Message> {
             }
 
             if (isInValidSession) {
-                int bubble;
                 if (!mUseGreenBackground) {
-                    bubble = activity.getThemeResource(R.attr.message_bubble_received_monochrome, R.drawable.message_bubble_received_white);
-                } else {
-                    bubble = activity.getThemeResource(R.attr.message_bubble_received_green, R.drawable.message_bubble_received);
+                    viewHolder.message_box.getBackground().setColorFilter(
+                        StyledAttributes.getColor(activity, mUseGreenBackground ? R.attr.message_bubble_received_bg : R.attr.color_background_primary),
+                        PorterDuff.Mode.SRC_ATOP
+                    );
                 }
-                viewHolder.message_box.setBackgroundResource(bubble);
                 viewHolder.encryption.setVisibility(View.GONE);
             } else {
-                viewHolder.message_box.setBackgroundResource(R.drawable.message_bubble_received_warning);
                 viewHolder.encryption.setVisibility(View.VISIBLE);
                 if (omemoEncryption && !message.isTrusted()) {
                     viewHolder.encryption.setText(R.string.not_trusted);

src/main/res/drawable/ic_message_bubble_received.xml 🔗

@@ -0,0 +1,17 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="36dp"
+    android:height="26dp"
+    android:viewportWidth="36"
+    android:viewportHeight="26">
+  <path
+      android:pathData="M7.987,2.003C11.772,3.826 11.988,4.693 12.168,9.999l7.818,-7.996z"
+      android:fillColor="#7401cf"
+      android:fillType="nonZero"
+      android:strokeColor="#00000000"/>
+  <path
+      android:pathData="M14,2L30,2A2,2 0,0 1,32 4L32,20A2,2 0,0 1,30 22L14,22A2,2 0,0 1,12 20L12,4A2,2 0,0 1,14 2z"
+      android:fillColor="#7401cf"
+      android:fillType="nonZero"
+      android:strokeColor="#00000000"/>
+</vector>

src/main/res/drawable/message_bubble_received.xml 🔗

@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:left="15dp" android:top="1dp">
+        <shape android:shape="rectangle">
+            <corners
+                android:radius="0dp"
+                android:bottomLeftRadius="2dp"
+                android:bottomRightRadius="2dp"
+                android:topLeftRadius="0dp"
+                android:topRightRadius="2dp" />
+            <padding
+                android:bottom="0dp"
+                android:left="5dp"
+                android:right="5dp"
+                android:top="0dp" />
+            <size android:width="10dp" android:height="10dp" />
+            <solid android:color="?message_bubble_received_bg" />
+        </shape>
+    </item>
+    <item android:bottom="2dp" android:gravity="top|left" android:width="10dp" android:height="10dp" android:top="1dp">
+        <vector
+           android:width="24dp"
+           android:height="24dp"
+           android:viewportWidth="24.0"
+           android:viewportHeight="24.0">
+           <path
+                android:pathData="M24,0 V 24 L0,0 z"
+                android:strokeColor="?message_bubble_received_bg"
+                android:fillColor="?message_bubble_received_bg"/>
+        </vector>
+    </item>
+    <item android:gravity="top|left" android:top="-0.5dp" android:left="1dp" android:right="-2dp">
+        <shape android:shape="rectangle">
+            <corners
+                android:radius="0dp"
+                android:bottomLeftRadius="0dp"
+                android:bottomRightRadius="0dp"
+                android:topLeftRadius="0dp"
+                android:topRightRadius="2dp" />
+            <padding
+                android:bottom="0dp"
+                android:left="0dp"
+                android:right="0dp"
+                android:top="0dp" />
+            <size android:height="1dp" />
+            <gradient
+                android:startColor="?message_bubble_shadow_dark_top"
+                android:endColor="?message_bubble_shadow_light"
+                android:angle="90"/>
+        </shape>
+    </item>
+</layer-list>

src/main/res/drawable/message_bubble_sent.xml 🔗

@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:right="15dp" android:bottom="2dp">
+        <shape android:shape="rectangle">
+            <corners
+                android:radius="0dp"
+                android:bottomLeftRadius="2dp"
+                android:bottomRightRadius="0dp"
+                android:topLeftRadius="2dp"
+                android:topRightRadius="2dp" />
+            <padding
+                android:bottom="0dp"
+                android:left="5dp"
+                android:right="5dp"
+                android:top="0dp" />
+            <size android:width="10dp" android:height="10dp" />
+            <solid android:color="?message_bubble_sent_bg" />
+        </shape>
+    </item>
+    <item android:bottom="2dp" android:gravity="bottom|right" android:width="10dp" android:height="10dp">
+        <vector
+           android:width="24dp"
+           android:height="24dp"
+           android:viewportWidth="24.0"
+           android:viewportHeight="24.0">
+           <path
+                android:pathData="M0,24 V 0 L24,24 z"
+                android:strokeColor="?message_bubble_sent_bg"
+                android:fillColor="?message_bubble_sent_bg"/>
+        </vector>
+    </item>
+    <item android:gravity="left|bottom" android:bottom="-0.5dp" android:left="-3dp" android:right="1dp">
+        <shape android:shape="rectangle">
+            <corners
+                android:radius="0dp"
+                android:bottomLeftRadius="2dp"
+                android:bottomRightRadius="0dp"
+                android:topLeftRadius="0dp"
+                android:topRightRadius="0dp" />
+            <padding
+                android:bottom="0dp"
+                android:left="0dp"
+                android:right="0dp"
+                android:top="0dp" />
+            <size android:height="2dp" />
+            <gradient
+                android:startColor="?message_bubble_shadow_light"
+                android:endColor="?message_bubble_shadow_dark"
+                android:angle="90"/>
+        </shape>
+    </item>
+</layer-list>

src/main/res/layout/message_received.xml 🔗

@@ -1,13 +1,14 @@
 <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
-                xmlns:app="http://schemas.android.com/apk/res-auto"
-                android:layout_width="fill_parent"
-                android:layout_height="wrap_content"
-                android:orientation="vertical"
-                android:paddingBottom="3dp"
-                android:paddingLeft="8dp"
-                android:paddingRight="8dp"
-                android:paddingTop="3dp">
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="fill_parent"
+    android:layout_height="wrap_content"
+    android:orientation="vertical"
+    android:clipToPadding="false"
+    android:paddingBottom="3dp"
+    android:paddingLeft="8dp"
+    android:paddingRight="8dp"
+    android:paddingTop="3dp">
 
     <com.makeramen.roundedimageview.RoundedImageView
         android:id="@+id/message_photo"
@@ -23,12 +24,15 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentBottom="true"
+        android:layout_marginLeft="5dp"
+        android:paddingLeft="20dp"
+        android:paddingTop="5dp"
+        android:paddingBottom="5dp"
         android:layout_toRightOf="@+id/message_photo"
-        android:background="@drawable/message_bubble_received"
-        android:minHeight="53dp"
-        android:layout_marginTop="-2dp"
-        android:layout_marginRight="-4dp"
-        android:longClickable="true">
+        android:elevation="3dp"
+        android:background="?attr/message_bubble_received"
+        android:longClickable="true"
+        android:minHeight="53dp">
 
         <LinearLayout
             android:layout_width="wrap_content"
@@ -39,7 +43,7 @@
 
             <include
                 android:id="@+id/message_content"
-                layout="@layout/message_content"/>
+                layout="@layout/message_content" />
 
             <LinearLayout
                 android:layout_width="wrap_content"
@@ -50,24 +54,24 @@
 
                 <TextView
                     android:id="@+id/message_subject"
-                    android:visibility="gone"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_gravity="center_vertical"
-                    android:gravity="center_vertical"
                     android:layout_marginRight="4sp"
                     android:accessibilityTraversalAfter="@id/message_photo"
                     android:accessibilityTraversalBefore="@id/message_time"
-                    android:textAppearance="@style/TextAppearance.Conversations.Caption.OnDark.Bold"/>
+                    android:gravity="center_vertical"
+                    android:textAppearance="@style/TextAppearance.Conversations.Caption.OnDark.Bold"
+                    android:visibility="gone" />
 
                 <TextView
                     android:id="@+id/message_encryption"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_gravity="center_vertical"
-                    android:gravity="center_vertical"
                     android:layout_marginRight="4sp"
-                    android:textAppearance="@style/TextAppearance.Conversations.Caption.OnDark.Bold"/>
+                    android:gravity="center_vertical"
+                    android:textAppearance="@style/TextAppearance.Conversations.Caption.OnDark.Bold" />
 
                 <ImageView
                     android:id="@+id/security_indicator"
@@ -94,11 +98,11 @@
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_gravity="center_vertical"
-                    android:gravity="center_vertical"
-                    android:text="@string/sending"
                     android:accessibilityTraversalAfter="@id/message_photo"
                     android:accessibilityTraversalBefore="@id/message_content"
-                    android:textAppearance="@style/TextAppearance.Conversations.Caption"/>
+                    android:gravity="center_vertical"
+                    android:text="@string/sending"
+                    android:textAppearance="@style/TextAppearance.Conversations.Caption" />
             </LinearLayout>
         </LinearLayout>
     </LinearLayout>

src/main/res/layout/message_sent.xml 🔗

@@ -4,6 +4,7 @@
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:orientation="vertical"
+    android:clipToPadding="false"
     android:paddingLeft="8dp"
     android:paddingTop="3dp"
     android:paddingRight="8dp"
@@ -38,9 +39,12 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_alignParentBottom="true"
-        android:layout_marginLeft="-4dp"
+        android:layout_marginRight="0dp"
+        android:paddingRight="20dp"
         android:layout_toLeftOf="@+id/message_photo_box"
-        android:background="?attr/message_bubble_sent"
+        android:translationY="-2dp"
+        android:elevation="3dp"
+        android:background="@drawable/message_bubble_sent"
         android:longClickable="true"
         android:minHeight="53dp">
 
@@ -64,15 +68,15 @@
 
                 <TextView
                     android:id="@+id/message_subject"
-                    android:visibility="gone"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_gravity="center_vertical"
-                    android:gravity="center_vertical"
                     android:layout_marginRight="4sp"
                     android:accessibilityTraversalAfter="@id/message_photo"
                     android:accessibilityTraversalBefore="@id/message_time"
-                    android:textAppearance="@style/TextAppearance.Conversations.Caption.OnDark.Bold"/>
+                    android:gravity="center_vertical"
+                    android:textAppearance="@style/TextAppearance.Conversations.Caption.OnDark.Bold"
+                    android:visibility="gone" />
 
                 <TextView
                     android:id="@+id/message_time"

src/main/res/values/attrs.xml 🔗

@@ -51,9 +51,14 @@
 
     <attr name="ic_cloud_download" format="reference" />
 
-    <attr name="message_bubble_received_monochrome" format="reference" />
     <attr name="message_bubble_sent" format="reference" />
-    <attr name="message_bubble_received_green" format="reference" />
+    <attr name="message_bubble_received" format="reference" />
+
+    <attr name="message_bubble_received_bg"  format="color" />
+    <attr name="message_bubble_sent_bg"  format="color" />
+    <attr name="message_bubble_shadow_light" format="color" />
+    <attr name="message_bubble_shadow_dark" format="color" />
+    <attr name="message_bubble_shadow_dark_top" format="color" />
 
     <attr name="unread_count" format="reference|color" />
 
@@ -128,4 +133,4 @@
 
     <attr name="popupOverlayStyle" format="reference" />
 
-</resources>
+</resources>

src/main/res/values/themes.xml 🔗

@@ -63,7 +63,7 @@
         <item name="ic_make_video_call" type="reference">@drawable/ic_videocam_black54_24dp</item>
 
         <item name="message_bubble_received_monochrome" type="reference">
-            @drawable/message_bubble_received_white
+            @drawable/message_bubble_received
         </item>
         <item name="message_bubble_sent" type="reference">@drawable/message_bubble_sent</item>
         <item name="message_bubble_received_green" type="reference">
@@ -219,11 +219,11 @@
         <item name="ic_attach_record" type="reference">@drawable/ic_attach_record_white</item>
 
         <item name="message_bubble_received_monochrome" type="reference">
-            @drawable/message_bubble_received_grey
+            @drawable/message_bubble_received
         </item>
-        <item name="message_bubble_sent" type="reference">@drawable/message_bubble_sent_grey</item>
+        <item name="message_bubble_sent" type="reference">@drawable/message_bubble_sent</item>
         <item name="message_bubble_received_green" type="reference">
-            @drawable/message_bubble_received_dark
+            @drawable/message_bubble_received
         </item>
 
         <item name="unread_count">@color/green900_desaturated</item>