Improved messages appearance

app/src/main/java/org/communiquons/android/comunic/client/data/conversations/ConversationMessageAdapter.java

@@ -5,16 +5,19 @@ import android.support.annotation.NonNull;
 import android.support.annotation.Nullable;
 import android.util.ArrayMap;
 import android.util.Log;
+import android.view.Gravity;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.ArrayAdapter;
 import android.widget.ImageView;
+import android.widget.LinearLayout;
 import android.widget.TextView;
 
 import org.communiquons.android.comunic.client.R;
 import org.communiquons.android.comunic.client.data.ImageLoad.ImageLoadManager;
 import org.communiquons.android.comunic.client.data.UsersInfo.UserInfo;
+import org.communiquons.android.comunic.client.data.utils.UiUtils;
 
 import java.util.ArrayList;
 
@@ -87,48 +90,57 @@ public class ConversationMessageAdapter extends ArrayAdapter<ConversationMessage
 
             Update the general layout of the message
          */
-        TextView contentView;
+        //Get the views
-        ImageView messageImageView;
+        LinearLayout containerView = convertView
+                .findViewById(R.id.fragment_conversation_message_item_container);
+        TextView contentView = convertView.
+                findViewById(R.id.fragment_conversation_message_item_content);
+        ImageView messageImageView = convertView.
+                findViewById(R.id.fragment_conversation_message_item_messageimage);
         ImageView accountImageView;
-        TextView userNameView;
+        TextView userNameView = convertView.
+                findViewById(R.id.fragment_conversation_message_item_username);
+
+        //Adapt the layout depending of user of the message
         if(message.getUser_id() == userID){
 
             //Message appears on the right
-            convertView.findViewById(R.id.fragment_conversation_message_left).
+            ((LinearLayout)convertView).setGravity(Gravity.END);
-                    setVisibility(View.GONE);
-            convertView.findViewById(R.id.fragment_conversation_message_right).
-                    setVisibility(View.VISIBLE);
 
-            contentView = convertView.
+            //Message appears in blue
-                    findViewById(R.id.fragment_conversation_message_item_content_right);
+            containerView.setBackground(getContext().
-
+                    getDrawable(R.drawable.fragment_conversation_message_currentuser_bg));
-            messageImageView = convertView.
-                    findViewById(R.id.fragment_conversation_message_item_messageimage_right);
 
+            //User account image appears on the right
             accountImageView = convertView.
-                    findViewById(R.id.fragment_conversation_message_item_accountimage_right);
+                    findViewById(R.id.fragment_conversation_message_item_right_account_image);
+            accountImageView.setVisibility(View.VISIBLE);
 
+            //Hide left image
+            convertView
+                    .findViewById(R.id.fragment_conversation_message_item_left_account_image)
+                    .setVisibility(View.GONE);
 
-            userNameView = null;
         }
         else {
 
-            //Message appears on the left
+            //Message appears on the right
-            convertView.findViewById(R.id.fragment_conversation_message_right).
+            ((LinearLayout)convertView).setGravity(Gravity.START);
-                    setVisibility(View.GONE);
-            convertView.findViewById(R.id.fragment_conversation_message_left).
-                    setVisibility(View.VISIBLE);
 
-            contentView = convertView.
+            //Message appears in blue
-                    findViewById(R.id.fragment_conversation_message_item_content);
+            containerView.setBackground(getContext().
-
+                    getDrawable(R.drawable.fragment_conversation_message_otheruser_bg));
-            messageImageView = convertView.
-                    findViewById(R.id.fragment_conversation_message_item_messageimage);
 
+            //User account image appears on the left
             accountImageView = convertView.
-                    findViewById(R.id.fragment_conversation_message_item_accountimage);
+                    findViewById(R.id.fragment_conversation_message_item_left_account_image);
+            accountImageView.setVisibility(View.VISIBLE);
+
+            //Hide right image
+            convertView
+                    .findViewById(R.id.fragment_conversation_message_item_right_account_image)
+                    .setVisibility(View.GONE);
 
-            userNameView = convertView.findViewById(R.id.fragment_conversation_message_item_username);
         }
 
         /*
@@ -146,6 +158,15 @@ public class ConversationMessageAdapter extends ArrayAdapter<ConversationMessage
         //Set the text of the message
         contentView.setText(message.getContent());
 
+        //Change the color of the text
+        if(message.getUser_id() == userID){
+            contentView.setTextColor(UiUtils.getColor(getContext(),
+                    R.color.conversation_user_messages_textColor));
+        }
+        else {
+            contentView.setTextColor(UiUtils.getColor(getContext(),
+                    R.color.conversation_otheruser_messages_textColor));
+        }
 
         /*
             Update message image
@@ -167,13 +188,16 @@ public class ConversationMessageAdapter extends ArrayAdapter<ConversationMessage
          */
         if(userNameView != null){
 
+            //Hide user name by default
+            userNameView.setVisibility(View.GONE);
+
             if(user != null){
+                if(userID != user.getId()) {
                     //Set the name of the user
                     userNameView.setText(user.getFullName());
                     userNameView.setVisibility(View.VISIBLE);
                 }
-            else
+            }
-                userNameView.setVisibility(View.GONE);
 
             if(previousMessage != null){
                 if (message.getUser_id() == previousMessage.getUser_id()){
@@ -199,13 +223,6 @@ public class ConversationMessageAdapter extends ArrayAdapter<ConversationMessage
             ImageLoadManager.load(getContext(), imageURL, accountImageView);
         }
 
-        //Hide user image if not required
-        if(previousMessage != null){
-            if (message.getUser_id() == previousMessage.getUser_id()){
-                accountImageView.setVisibility(View.INVISIBLE);
-            }
-        }
-
 
         return convertView;
     }

app/src/main/java/org/communiquons/android/comunic/client/data/utils/UiUtils.java

@@ -0,0 +1,31 @@
+package org.communiquons.android.comunic.client.data.utils;
+
+import android.content.Context;
+import android.os.Build;
+
+/**
+ * User Interface utilities
+ *
+ * @author Pierre HUBERT
+ * Created by pierre on 12/31/17.
+ */
+
+public class UiUtils {
+
+    /**
+     * Get a color from ressources
+     *
+     * @param context The context of the application
+     * @param color_id The ID of the ressource
+     * @return The ID of the color
+     */
+    public static int getColor(Context context, int color_id){
+        //Check which version of getColor to use
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
+            return context.getResources().getColor(color_id, context.getTheme());
+        }
+        else {
+            return context.getResources().getColor(color_id);
+        }
+    }
+}

app/src/main/res/layout/fragment_conversation_message_item.xml

@@ -9,47 +9,34 @@
     android:paddingStart="5dp"
     android:paddingTop="5dp">
 
-    <!-- Messages on the left -->
-    <LinearLayout
-        android:id="@+id/fragment_conversation_message_left"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:orientation="vertical">
-
     <TextView
         android:id="@+id/fragment_conversation_message_item_username"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         tools:text="User name" />
 
-        <RelativeLayout
+    <LinearLayout
+        android:id="@+id/fragment_conversation_message_item_container"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-            android:padding="1dp">
+        android:orientation="horizontal"
+        android:padding="5dp"
+        android:background="@drawable/fragment_conversation_message_otheruser_bg">
 
         <ImageView
-                android:id="@+id/fragment_conversation_message_item_accountimage"
+            android:id="@+id/fragment_conversation_message_item_left_account_image"
             android:layout_width="26dp"
             android:layout_height="26dp"
-                android:layout_gravity="center"
             android:layout_marginEnd="5dp"
+            android:layout_gravity="center"
             android:contentDescription="@string/user_image_description"
             android:src="@drawable/default_account_image"/>
 
-            <LinearLayout
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_toEndOf="@id/fragment_conversation_message_item_accountimage"
-                android:background="@drawable/fragment_conversation_message_otheruser_bg"
-                android:orientation="vertical"
-                android:paddingBottom="5dp"
-                android:paddingEnd="15dp"
-                android:paddingStart="15dp">
-
         <TextView
             android:id="@+id/fragment_conversation_message_item_content"
-                    android:layout_width="wrap_content"
+            android:layout_width="0dp"
             android:layout_height="wrap_content"
+            android:layout_weight="1"
             android:layout_gravity="center"
             android:padding="5dp"
             android:textColor="@color/conversation_otheruser_messages_textColor"
@@ -57,71 +44,22 @@
 
         <ImageView
             android:id="@+id/fragment_conversation_message_item_messageimage"
-                    android:layout_width="wrap_content"
+            android:layout_width="40dp"
-                    android:layout_height="wrap_content"
+            android:layout_height="40dp"
             android:layout_gravity="center"
             android:contentDescription="@string/fragment_conversation_message_image"
+            android:scaleType="fitCenter"
             tools:background="@android:color/black"
             tools:layout_height="40dp"
             tools:layout_width="40dp"/>
-            </LinearLayout>
-
-
-
-        </RelativeLayout>
-
-    </LinearLayout>
-
-    <!-- Messages on the right -->
-    <RelativeLayout
-        android:id="@+id/fragment_conversation_message_right"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:padding="1dp">
 
         <ImageView
-            android:id="@+id/fragment_conversation_message_item_accountimage_right"
+            android:id="@+id/fragment_conversation_message_item_right_account_image"
             android:layout_width="26dp"
             android:layout_height="26dp"
-            android:layout_alignParentEnd="true"
-            android:layout_gravity="end"
             android:layout_marginStart="5dp"
+            android:layout_gravity="center"
             android:contentDescription="@string/user_image_description"
             android:src="@drawable/default_account_image"/>
-
-        <LinearLayout
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_toStartOf="@id/fragment_conversation_message_item_accountimage_right"
-            android:background="@drawable/fragment_conversation_message_currentuser_bg"
-            android:orientation="vertical"
-            android:paddingBottom="5dp"
-            android:paddingEnd="15dp"
-            android:paddingStart="15dp">
-
-            <TextView
-                android:id="@+id/fragment_conversation_message_item_content_right"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_gravity="center"
-                android:padding="5dp"
-                android:textColor="@color/conversation_user_messages_textColor"
-                tools:text="A message" />
-
-            <ImageView
-                android:id="@+id/fragment_conversation_message_item_messageimage_right"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_gravity="center"
-                android:contentDescription="@string/fragment_conversation_message_image"
-                tools:background="@android:color/black"
-                tools:layout_height="40dp"
-                tools:layout_width="40dp"/>
-
-
     </LinearLayout>
-
-
-    </RelativeLayout>
-
 </LinearLayout>