From 77237decb0c90c5d788df9ca9d10d7e75403e99f Mon Sep 17 00:00:00 2001
From: Felix Ableitner <me@nutomic.com>
Date: Tue, 18 Nov 2014 00:04:11 +0200
Subject: [PATCH] Added proper chat layout.

---
 .../main/res/drawable/message_background.xml  | 10 +++
 .../main/res/layout/activity_add_contacts.xml |  2 +
 app/src/main/res/layout/activity_main.xml     |  2 +
 .../main/res/layout/dialog_add_contact.xml    |  2 +
 app/src/main/res/layout/fragment_chat.xml     | 83 +++++++++----------
 app/src/main/res/layout/fragment_contacts.xml |  2 +
 app/src/main/res/layout/item_message.xml      | 17 ++++
 app/src/main/res/values-v21/style.xml         |  1 +
 app/src/main/res/values/colors.xml            | 11 +++
 app/src/main/res/values/strings.xml           |  1 +
 app/src/main/res/values/style.xml             |  1 +
 app/src/main/res/xml/settings.xml             |  1 +
 .../ensichat/fragments/ChatFragment.scala     |  4 +-
 .../ensichat/util/MessagesAdapter.scala       | 32 +++++--
 14 files changed, 117 insertions(+), 52 deletions(-)
 create mode 100644 app/src/main/res/drawable/message_background.xml
 create mode 100644 app/src/main/res/layout/item_message.xml
 create mode 100644 app/src/main/res/values/colors.xml

diff --git a/app/src/main/res/drawable/message_background.xml b/app/src/main/res/drawable/message_background.xml
new file mode 100644
index 0000000..14a6988
--- /dev/null
+++ b/app/src/main/res/drawable/message_background.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+
+    <solid android:color="#ffffff"/>
+
+    <stroke android:width="1dip" android:color="@color/chat_seperator"/>
+
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/layout/activity_add_contacts.xml b/app/src/main/res/layout/activity_add_contacts.xml
index 308529f..657d19e 100644
--- a/app/src/main/res/layout/activity_add_contacts.xml
+++ b/app/src/main/res/layout/activity_add_contacts.xml
@@ -1,3 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent" >
diff --git a/app/src/main/res/layout/activity_main.xml b/app/src/main/res/layout/activity_main.xml
index da8b68a..5cb293b 100644
--- a/app/src/main/res/layout/activity_main.xml
+++ b/app/src/main/res/layout/activity_main.xml
@@ -1,3 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@android:id/primary"
     android:layout_width="fill_parent"
diff --git a/app/src/main/res/layout/dialog_add_contact.xml b/app/src/main/res/layout/dialog_add_contact.xml
index e1a1a5e..614f7cc 100644
--- a/app/src/main/res/layout/dialog_add_contact.xml
+++ b/app/src/main/res/layout/dialog_add_contact.xml
@@ -1,3 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+
 <RelativeLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
diff --git a/app/src/main/res/layout/fragment_chat.xml b/app/src/main/res/layout/fragment_chat.xml
index 09f4dda..539130b 100644
--- a/app/src/main/res/layout/fragment_chat.xml
+++ b/app/src/main/res/layout/fragment_chat.xml
@@ -1,58 +1,57 @@
+<?xml version="1.0" encoding="utf-8"?>
+
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:layout_weight="10"
     android:orientation="vertical">
 
-    <LinearLayout
-        android:layout_width="match_parent"
-        android:orientation="vertical"
+    <FrameLayout
         android:layout_height="0dp"
-        android:layout_weight="10">
+        android:layout_width="match_parent"
+        android:layout_weight="11"
+        android:layout_marginLeft="10dip"
+        android:layout_marginRight="10dip"
+        android:layout_marginBottom="2dip"
+        android:background="@color/chat_background">
 
-        <FrameLayout
-            android:layout_height="0dp"
+        <ListView
+            android:id="@android:id/list"
+            android:layout_height="match_parent"
             android:layout_width="match_parent"
-            android:layout_weight="11"
-            android:background="@android:color/background_light">
+            android:stackFromBottom="true"
+            android:transcriptMode="normal"
+            android:divider="@android:color/transparent"
+            android:dividerHeight="5dp"/>
 
-            <ListView
-                android:id="@android:id/list"
-                android:drawSelectorOnTop="false"
-                android:layout_height="match_parent"
-                android:layout_width="match_parent"
-                android:footerDividersEnabled="true" />
+    </FrameLayout>
 
-        </FrameLayout>
+    <View
+        android:layout_width="match_parent"
+        android:layout_height="1dip"
+        android:background="@color/chat_seperator"/>
 
+    <LinearLayout
+        android:layout_height="wrap_content"
+        android:layout_width="match_parent"
+        android:background="@android:color/background_light"
+        android:id="@+id/linearLayout"
+        android:orientation="horizontal">
 
-        <FrameLayout
-            android:layout_height="0dp"
-            android:layout_width="match_parent"
-            android:layout_weight="1">
+        <EditText
+            android:id="@+id/message"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"
+            android:imeOptions="actionDone"
+            android:inputType="textMultiLine|textCapSentences|textAutoCorrect"/>
 
-            <LinearLayout
-                android:layout_height="match_parent"
-                android:layout_width="match_parent"
-                android:background="@android:color/darker_gray"
-                android:id="@+id/linearLayout">
-
-                <EditText
-                    android:id="@+id/message"
-                    android:layout_width="0dp"
-                    android:layout_height="match_parent"
-                    android:layout_weight="1"
-                    android:imeOptions="actionDone" />
-
-                <Button
-                    android:id="@+id/send"
-                    android:layout_width="45dp"
-                    android:layout_height="45dp"
-                    android:background="@drawable/ic_action_send_now"
-                    android:onClick="sendMessage"/>
-
-            </LinearLayout>
-
-        </FrameLayout>
+        <Button
+            android:id="@+id/send"
+            android:layout_width="45dp"
+            android:layout_height="45dp"
+            android:background="@drawable/ic_action_send_now"
+            android:onClick="sendMessage"/>
 
     </LinearLayout>
 
diff --git a/app/src/main/res/layout/fragment_contacts.xml b/app/src/main/res/layout/fragment_contacts.xml
index 9de2c56..b8b4950 100644
--- a/app/src/main/res/layout/fragment_contacts.xml
+++ b/app/src/main/res/layout/fragment_contacts.xml
@@ -1,3 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent" >
diff --git a/app/src/main/res/layout/item_message.xml b/app/src/main/res/layout/item_message.xml
new file mode 100644
index 0000000..caf600e
--- /dev/null
+++ b/app/src/main/res/layout/item_message.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<RelativeLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_height="wrap_content"
+    android:layout_width="match_parent"
+    android:orientation="horizontal">
+
+    <TextView
+        android:id="@android:id/text1"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:padding="5dip"
+        android:background="@drawable/message_background"
+        android:textAppearance="?android:attr/textAppearanceMedium"/>
+
+</RelativeLayout>
\ No newline at end of file
diff --git a/app/src/main/res/values-v21/style.xml b/app/src/main/res/values-v21/style.xml
index 9c242f5..427ac46 100644
--- a/app/src/main/res/values-v21/style.xml
+++ b/app/src/main/res/values-v21/style.xml
@@ -1,4 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
+
 <resources>
     <style name="AppTheme" parent="@android:style/Theme.Material.Light.DarkActionBar" />
 </resources>
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
new file mode 100644
index 0000000..8ad38e2
--- /dev/null
+++ b/app/src/main/res/values/colors.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<resources>
+
+    <!-- Background color for ChatFragment -->
+    <color name="chat_background">#E6FFE6</color>
+
+    <!-- Color for message border and compose/message layout seperator in ChatFragment -->
+    <color name="chat_seperator">#AAAAAA</color>
+
+</resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 7b32f61..d4b3d54 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -1,4 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
+
 <resources>
 
     <!-- Global -->
diff --git a/app/src/main/res/values/style.xml b/app/src/main/res/values/style.xml
index f43b8bb..ce0b1ee 100644
--- a/app/src/main/res/values/style.xml
+++ b/app/src/main/res/values/style.xml
@@ -1,4 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
+
 <resources>
     <style name="AppTheme" parent="@android:style/Theme.Holo.Light.DarkActionBar" />
 </resources>
diff --git a/app/src/main/res/xml/settings.xml b/app/src/main/res/xml/settings.xml
index e9b9486..363cb03 100644
--- a/app/src/main/res/xml/settings.xml
+++ b/app/src/main/res/xml/settings.xml
@@ -1,4 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
+
 <PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android">
 
     <EditTextPreference
diff --git a/app/src/main/scala/com/nutomic/ensichat/fragments/ChatFragment.scala b/app/src/main/scala/com/nutomic/ensichat/fragments/ChatFragment.scala
index 95bf645..d0e7081 100644
--- a/app/src/main/scala/com/nutomic/ensichat/fragments/ChatFragment.scala
+++ b/app/src/main/scala/com/nutomic/ensichat/fragments/ChatFragment.scala
@@ -51,7 +51,7 @@ class ChatFragment extends ListFragment with OnClickListener
       // Read local device ID from service,
       adapter = new MessagesAdapter(getActivity, chatService.localDeviceId)
       chatService.registerMessageListener(ChatFragment.this)
-      onMessageReceived(chatService.database.getMessages(device, 10))
+      onMessageReceived(chatService.database.getMessages(device, 15))
 
       if (listView != null) {
         listView.setAdapter(adapter)
@@ -97,7 +97,7 @@ class ChatFragment extends ListFragment with OnClickListener
    */
   override def onClick(view: View): Unit = view.getId match {
     case R.id.send =>
-      val text: String = messageText.getText.toString
+      val text: String = messageText.getText.toString.trim
       if (!text.isEmpty) {
         if (!chatService.isConnected(device)) {
           Toast.makeText(getActivity, R.string.contact_offline_toast, Toast.LENGTH_SHORT).show()
diff --git a/app/src/main/scala/com/nutomic/ensichat/util/MessagesAdapter.scala b/app/src/main/scala/com/nutomic/ensichat/util/MessagesAdapter.scala
index e252aa5..62fd966 100644
--- a/app/src/main/scala/com/nutomic/ensichat/util/MessagesAdapter.scala
+++ b/app/src/main/scala/com/nutomic/ensichat/util/MessagesAdapter.scala
@@ -1,8 +1,9 @@
 package com.nutomic.ensichat.util
 
 import android.content.Context
-import android.view.{View, ViewGroup}
-import android.widget.{ArrayAdapter, TextView}
+import android.view.{Gravity, View, ViewGroup}
+import android.widget.{ArrayAdapter, RelativeLayout, TextView}
+import com.nutomic.ensichat.R
 import com.nutomic.ensichat.bluetooth.Device
 import com.nutomic.ensichat.messages.TextMessage
 
@@ -10,15 +11,30 @@ import com.nutomic.ensichat.messages.TextMessage
  * Displays [[TextMessage]]s in ListView.
  */
 class MessagesAdapter(context: Context, localDevice: Device.ID) extends
-  ArrayAdapter[TextMessage](context, android.R.layout.simple_list_item_1) {
+  ArrayAdapter[TextMessage](context, R.layout.item_message, android.R.id.text1) {
+
+  /**
+   * Free space to the right/left to a message depending on who sent it, in dip.
+   */
+  private val MessageMargin = 50
 
   override def getView(position: Int, convertView: View, parent: ViewGroup): View = {
-    val view: View = super.getView(position, convertView, parent)
-    val tv: TextView = view.findViewById(android.R.id.text1).asInstanceOf[TextView]
-    view.setBackgroundColor(context.getResources.getColor(
-      if (getItem(position).sender == localDevice) android.R.color.holo_blue_light
-      else android.R.color.holo_green_light))
+    val view = super.getView(position, convertView, parent).asInstanceOf[RelativeLayout]
+    val tv = view.findViewById(android.R.id.text1).asInstanceOf[TextView]
+
     tv.setText(getItem(position).text)
+
+    val lp = new RelativeLayout.LayoutParams(tv.getLayoutParams)
+    val margin = (MessageMargin * context.getResources.getDisplayMetrics.density).toInt
+    if (getItem(position).sender == localDevice) {
+      view.setGravity(Gravity.RIGHT)
+      lp.setMargins(margin, 0, 0, 0)
+    } else {
+      view.setGravity(Gravity.LEFT)
+      lp.setMargins(0, 0, margin, 0)
+    }
+    tv.setLayoutParams(lp)
+
     view
   }