From e6cb12dfe414497b4317820497985c110cb81864 Mon Sep 17 00:00:00 2001 From: Raphael Pohl Date: Sun, 19 Jul 2015 14:26:03 +0200 Subject: changed message bubble appearance --- art/message_bubble_received.svg | 165 +++++++++++++++++++++ art/message_bubble_sent.svg | 165 +++++++++++++++++++++ art/render.rb | 128 ++++++++++++---- .../conversations/ui/adapter/MessageAdapter.java | 37 +++-- src/main/res/drawable-hdpi/ic_secure_indicator.png | Bin 294 -> 294 bytes .../drawable-hdpi/ic_secure_indicator_white.png | Bin 0 -> 322 bytes .../drawable-hdpi/message_bubble_received.9.png | Bin 0 -> 759 bytes .../res/drawable-hdpi/message_bubble_sent.9.png | Bin 0 -> 693 bytes src/main/res/drawable-mdpi/ic_secure_indicator.png | Bin 295 -> 295 bytes .../drawable-mdpi/ic_secure_indicator_white.png | Bin 0 -> 306 bytes .../drawable-mdpi/message_bubble_received.9.png | Bin 0 -> 589 bytes .../res/drawable-mdpi/message_bubble_sent.9.png | Bin 0 -> 570 bytes .../res/drawable-xhdpi/ic_secure_indicator.png | Bin 410 -> 410 bytes .../drawable-xhdpi/ic_secure_indicator_white.png | Bin 0 -> 434 bytes .../drawable-xhdpi/message_bubble_received.9.png | Bin 0 -> 922 bytes .../res/drawable-xhdpi/message_bubble_sent.9.png | Bin 0 -> 832 bytes .../res/drawable-xxhdpi/ic_secure_indicator.png | Bin 380 -> 380 bytes .../drawable-xxhdpi/ic_secure_indicator_white.png | Bin 0 -> 441 bytes .../drawable-xxhdpi/message_bubble_received.9.png | Bin 0 -> 1319 bytes .../res/drawable-xxhdpi/message_bubble_sent.9.png | Bin 0 -> 1195 bytes .../drawable-xxxhdpi/message_bubble_received.9.png | Bin 0 -> 1672 bytes .../res/drawable-xxxhdpi/message_bubble_sent.9.png | Bin 0 -> 1519 bytes src/main/res/drawable/account_image_border.xml | 15 ++ src/main/res/drawable/message_border.xml | 15 -- .../layout/activity_publish_profile_picture.xml | 2 +- src/main/res/layout/fragment_conversation.xml | 5 +- src/main/res/layout/message_received.xml | 55 ++++--- src/main/res/layout/message_sent.xml | 50 +++---- src/main/res/layout/message_status.xml | 10 +- src/main/res/values/dimens.xml | 1 + 30 files changed, 536 insertions(+), 112 deletions(-) create mode 100644 art/message_bubble_received.svg create mode 100644 art/message_bubble_sent.svg create mode 100644 src/main/res/drawable-hdpi/ic_secure_indicator_white.png create mode 100644 src/main/res/drawable-hdpi/message_bubble_received.9.png create mode 100644 src/main/res/drawable-hdpi/message_bubble_sent.9.png create mode 100644 src/main/res/drawable-mdpi/ic_secure_indicator_white.png create mode 100644 src/main/res/drawable-mdpi/message_bubble_received.9.png create mode 100644 src/main/res/drawable-mdpi/message_bubble_sent.9.png create mode 100644 src/main/res/drawable-xhdpi/ic_secure_indicator_white.png create mode 100644 src/main/res/drawable-xhdpi/message_bubble_received.9.png create mode 100644 src/main/res/drawable-xhdpi/message_bubble_sent.9.png create mode 100644 src/main/res/drawable-xxhdpi/ic_secure_indicator_white.png create mode 100644 src/main/res/drawable-xxhdpi/message_bubble_received.9.png create mode 100644 src/main/res/drawable-xxhdpi/message_bubble_sent.9.png create mode 100644 src/main/res/drawable-xxxhdpi/message_bubble_received.9.png create mode 100644 src/main/res/drawable-xxxhdpi/message_bubble_sent.9.png create mode 100644 src/main/res/drawable/account_image_border.xml delete mode 100644 src/main/res/drawable/message_border.xml diff --git a/art/message_bubble_received.svg b/art/message_bubble_received.svg new file mode 100644 index 000000000..4f4158616 --- /dev/null +++ b/art/message_bubble_received.svg @@ -0,0 +1,165 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + diff --git a/art/message_bubble_sent.svg b/art/message_bubble_sent.svg new file mode 100644 index 000000000..90ad5091a --- /dev/null +++ b/art/message_bubble_sent.svg @@ -0,0 +1,165 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + diff --git a/art/render.rb b/art/render.rb index 312dd06b1..926c7544d 100755 --- a/art/render.rb +++ b/art/render.rb @@ -1,11 +1,15 @@ #!/bin/env ruby -resolutions={ - 'mdpi'=> 1, + +require 'xml' + +resolutions = { + 'mdpi' => 1, 'hdpi' => 1.5, 'xhdpi' => 2, 'xxhdpi' => 3, 'xxxhdpi' => 4, } + images = { 'conversations_baloon.svg' => ['ic_launcher', 48], 'conversations_mono.svg' => ['ic_notification', 24], @@ -14,38 +18,110 @@ images = { 'ic_send_text_online.svg' => ['ic_send_text_online', 36], 'ic_send_text_away.svg' => ['ic_send_text_away', 36], 'ic_send_text_dnd.svg' => ['ic_send_text_dnd', 36], - 'ic_send_photo_online.svg' => ['ic_send_photo_online', 36], - 'ic_send_photo_offline.svg' => ['ic_send_photo_offline', 36], - 'ic_send_photo_away.svg' => ['ic_send_photo_away', 36], - 'ic_send_photo_dnd.svg' => ['ic_send_photo_dnd', 36], + 'ic_send_photo_online.svg' => ['ic_send_photo_online', 36], + 'ic_send_photo_offline.svg' => ['ic_send_photo_offline', 36], + 'ic_send_photo_away.svg' => ['ic_send_photo_away', 36], + 'ic_send_photo_dnd.svg' => ['ic_send_photo_dnd', 36], 'ic_send_location_online.svg' => ['ic_send_location_online', 36], - 'ic_send_location_offline.svg' => ['ic_send_location_offline', 36], - 'ic_send_location_away.svg' => ['ic_send_location_away', 36], - 'ic_send_location_dnd.svg' => ['ic_send_location_dnd', 36], + 'ic_send_location_offline.svg' => ['ic_send_location_offline', 36], + 'ic_send_location_away.svg' => ['ic_send_location_away', 36], + 'ic_send_location_dnd.svg' => ['ic_send_location_dnd', 36], 'ic_send_voice_online.svg' => ['ic_send_voice_online', 36], - 'ic_send_voice_offline.svg' => ['ic_send_voice_offline', 36], - 'ic_send_voice_away.svg' => ['ic_send_voice_away', 36], - 'ic_send_voice_dnd.svg' => ['ic_send_voice_dnd', 36], + 'ic_send_voice_offline.svg' => ['ic_send_voice_offline', 36], + 'ic_send_voice_away.svg' => ['ic_send_voice_away', 36], + 'ic_send_voice_dnd.svg' => ['ic_send_voice_dnd', 36], 'ic_send_cancel_online.svg' => ['ic_send_cancel_online', 36], - 'ic_send_cancel_offline.svg' => ['ic_send_cancel_offline', 36], - 'ic_send_cancel_away.svg' => ['ic_send_cancel_away', 36], - 'ic_send_cancel_dnd.svg' => ['ic_send_cancel_dnd', 36], - 'ic_send_picture_online.svg' => ['ic_send_picture_online', 36], - 'ic_send_picture_offline.svg' => ['ic_send_picture_offline', 36], - 'ic_send_picture_away.svg' => ['ic_send_picture_away', 36], - 'ic_send_picture_dnd.svg' => ['ic_send_picture_dnd', 36], + 'ic_send_cancel_offline.svg' => ['ic_send_cancel_offline', 36], + 'ic_send_cancel_away.svg' => ['ic_send_cancel_away', 36], + 'ic_send_cancel_dnd.svg' => ['ic_send_cancel_dnd', 36], + 'ic_send_picture_online.svg' => ['ic_send_picture_online', 36], + 'ic_send_picture_offline.svg' => ['ic_send_picture_offline', 36], + 'ic_send_picture_away.svg' => ['ic_send_picture_away', 36], + 'ic_send_picture_dnd.svg' => ['ic_send_picture_dnd', 36], 'md_switch_thumb_disable.svg' => ['switch_thumb_disable', 48], 'md_switch_thumb_off_normal.svg' => ['switch_thumb_off_normal', 48], 'md_switch_thumb_off_pressed.svg' => ['switch_thumb_off_pressed', 48], 'md_switch_thumb_on_normal.svg' => ['switch_thumb_on_normal', 48], 'md_switch_thumb_on_pressed.svg' => ['switch_thumb_on_pressed', 48], + 'message_bubble_received.svg' => ['message_bubble_received.9', 0], + 'message_bubble_sent.svg' => ['message_bubble_sent.9', 0], } -images.each do |source, result| - resolutions.each do |name, factor| - size = factor * result[1] - path = "../src/main/res/drawable-#{name}/#{result[0]}.png" - cmd = "inkscape -e #{path} -C -h #{size} -w #{size} #{source}" - puts cmd - system cmd + +# Executable paths for Mac OSX +# "/Applications/Inkscape.app/Contents/Resources/bin/inkscape" + +inkscape = "inkscape" +imagemagick = "convert" + +def execute_cmd(cmd) + puts cmd + system cmd +end + +images.each do |source_filename, settings| + svg_content = File.read(source_filename) + + svg = XML::Document.string(svg_content) + base_width = svg.root["width"].to_i + base_height = svg.root["height"].to_i + + guides = svg.find(".//sodipodi:guide") + + resolutions.each do |resolution, factor| + output_filename, base_size = settings + + if base_size > 0 + width = factor * base_size + height = factor * base_size + else + width = factor * base_width + height = factor * base_height + end + + path = "../src/main/res/drawable-#{resolution}/#{output_filename}.png" + execute_cmd "#{inkscape} -f #{source_filename} -z -C -w #{width} -h #{height} -e #{path}" + + top = [] + right = [] + bottom = [] + left = [] + + guides.each do |guide| + orientation = guide["orientation"] + x, y = guide["position"].split(",") + x, y = x.to_i, y.to_i + + if orientation == "1,0" and y == base_height + top.push(x * factor) + end + + if orientation == "0,1" and x == base_width + right.push((base_height - y) * factor) + end + + if orientation == "1,0" and y == 0 + bottom.push(x * factor) + end + + if orientation == "0,1" and x == 0 + left.push((base_height - y) * factor) + end + end + + next if top.length != 2 + next if right.length != 2 + next if bottom.length != 2 + next if left.length != 2 + + execute_cmd "#{imagemagick} -background none PNG32:#{path} -gravity center -extent #{width+2}x#{height+2} PNG32:#{path}" + + draw_format = "-draw \"rectangle %d,%d %d,%d\"" + top_line = draw_format % [top.min + 1, 0, top.max, 0] + right_line = draw_format % [width + 1, right.min + 1, width + 1, right.max] + bottom_line = draw_format % [bottom.min + 1, height + 1, bottom.max, height + 1] + left_line = draw_format % [0, left.min + 1, 0, left.max] + draws = "#{top_line} #{right_line} #{bottom_line} #{left_line}" + + execute_cmd "#{imagemagick} -background none PNG32:#{path} -fill black -stroke none #{draws} PNG32:#{path}" end end diff --git a/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java b/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java index 08e0f2989..679fb3558 100644 --- a/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java +++ b/src/main/java/eu/siacs/conversations/ui/adapter/MessageAdapter.java @@ -81,15 +81,31 @@ public class MessageAdapter extends ArrayAdapter { return 3; } - @Override - public int getItemViewType(int position) { - if (getItem(position).getType() == Message.TYPE_STATUS) { + public int getItemViewType(Message message) { + if (message.getType() == Message.TYPE_STATUS) { return STATUS; - } else if (getItem(position).getStatus() <= Message.STATUS_RECEIVED) { + } else if (message.getStatus() <= Message.STATUS_RECEIVED) { return RECEIVED; - } else { - return SENT; } + + return SENT; + } + + @Override + public int getItemViewType(int position) { + return this.getItemViewType(getItem(position)); + } + + private int getMessageTextColor(Message message) { + int type = this.getItemViewType(message); + + if (type == SENT) { + return activity.getResources().getColor(R.color.black87); + } else if (type == RECEIVED) { + return activity.getResources().getColor(R.color.white); + } + + return activity.getPrimaryTextColor(); } private void displayStatus(ViewHolder viewHolder, Message message) { @@ -150,7 +166,7 @@ public class MessageAdapter extends ArrayAdapter { if (error) { viewHolder.time.setTextColor(activity.getWarningTextColor()); } else { - viewHolder.time.setTextColor(activity.getSecondaryTextColor()); + viewHolder.time.setTextColor(this.getMessageTextColor(message)); } if (message.getEncryption() == Message.ENCRYPTION_NONE) { viewHolder.indicator.setVisibility(View.GONE); @@ -294,7 +310,7 @@ public class MessageAdapter extends ArrayAdapter { } else { viewHolder.messageBody.setText(""); } - viewHolder.messageBody.setTextColor(activity.getPrimaryTextColor()); + viewHolder.messageBody.setTextColor(this.getMessageTextColor(message)); viewHolder.messageBody.setTypeface(null, Typeface.NORMAL); viewHolder.messageBody.setTextIsSelectable(true); } @@ -363,8 +379,9 @@ public class MessageAdapter extends ArrayAdapter { scalledW = (int) target; scalledH = (int) (params.height / ((double) params.width / target)); } - viewHolder.image.setLayoutParams(new LinearLayout.LayoutParams( - scalledW, scalledH)); + LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(scalledW, scalledH); + layoutParams.setMargins(0, (int)(metrics.density * 4), 0, (int)(metrics.density * 4)); + viewHolder.image.setLayoutParams(layoutParams); activity.loadBitmap(message, viewHolder.image); viewHolder.image.setOnClickListener(new OnClickListener() { diff --git a/src/main/res/drawable-hdpi/ic_secure_indicator.png b/src/main/res/drawable-hdpi/ic_secure_indicator.png index 2a2934fb1..220463fc7 100644 Binary files a/src/main/res/drawable-hdpi/ic_secure_indicator.png and b/src/main/res/drawable-hdpi/ic_secure_indicator.png differ diff --git a/src/main/res/drawable-hdpi/ic_secure_indicator_white.png b/src/main/res/drawable-hdpi/ic_secure_indicator_white.png new file mode 100644 index 000000000..46eb1195b Binary files /dev/null and b/src/main/res/drawable-hdpi/ic_secure_indicator_white.png differ diff --git a/src/main/res/drawable-hdpi/message_bubble_received.9.png b/src/main/res/drawable-hdpi/message_bubble_received.9.png new file mode 100644 index 000000000..eb44a1b6d Binary files /dev/null and b/src/main/res/drawable-hdpi/message_bubble_received.9.png differ diff --git a/src/main/res/drawable-hdpi/message_bubble_sent.9.png b/src/main/res/drawable-hdpi/message_bubble_sent.9.png new file mode 100644 index 000000000..9daa36bd1 Binary files /dev/null and b/src/main/res/drawable-hdpi/message_bubble_sent.9.png differ diff --git a/src/main/res/drawable-mdpi/ic_secure_indicator.png b/src/main/res/drawable-mdpi/ic_secure_indicator.png index 5a73aef4b..690d4d03d 100644 Binary files a/src/main/res/drawable-mdpi/ic_secure_indicator.png and b/src/main/res/drawable-mdpi/ic_secure_indicator.png differ diff --git a/src/main/res/drawable-mdpi/ic_secure_indicator_white.png b/src/main/res/drawable-mdpi/ic_secure_indicator_white.png new file mode 100644 index 000000000..e2f894ef4 Binary files /dev/null and b/src/main/res/drawable-mdpi/ic_secure_indicator_white.png differ diff --git a/src/main/res/drawable-mdpi/message_bubble_received.9.png b/src/main/res/drawable-mdpi/message_bubble_received.9.png new file mode 100644 index 000000000..3b4eee56e Binary files /dev/null and b/src/main/res/drawable-mdpi/message_bubble_received.9.png differ diff --git a/src/main/res/drawable-mdpi/message_bubble_sent.9.png b/src/main/res/drawable-mdpi/message_bubble_sent.9.png new file mode 100644 index 000000000..74fb8d41a Binary files /dev/null and b/src/main/res/drawable-mdpi/message_bubble_sent.9.png differ diff --git a/src/main/res/drawable-xhdpi/ic_secure_indicator.png b/src/main/res/drawable-xhdpi/ic_secure_indicator.png index 1f4c9a32e..cd0d1391a 100644 Binary files a/src/main/res/drawable-xhdpi/ic_secure_indicator.png and b/src/main/res/drawable-xhdpi/ic_secure_indicator.png differ diff --git a/src/main/res/drawable-xhdpi/ic_secure_indicator_white.png b/src/main/res/drawable-xhdpi/ic_secure_indicator_white.png new file mode 100644 index 000000000..b624a8ce6 Binary files /dev/null and b/src/main/res/drawable-xhdpi/ic_secure_indicator_white.png differ diff --git a/src/main/res/drawable-xhdpi/message_bubble_received.9.png b/src/main/res/drawable-xhdpi/message_bubble_received.9.png new file mode 100644 index 000000000..0f5f1ac6e Binary files /dev/null and b/src/main/res/drawable-xhdpi/message_bubble_received.9.png differ diff --git a/src/main/res/drawable-xhdpi/message_bubble_sent.9.png b/src/main/res/drawable-xhdpi/message_bubble_sent.9.png new file mode 100644 index 000000000..7939f213f Binary files /dev/null and b/src/main/res/drawable-xhdpi/message_bubble_sent.9.png differ diff --git a/src/main/res/drawable-xxhdpi/ic_secure_indicator.png b/src/main/res/drawable-xxhdpi/ic_secure_indicator.png index 1ee9b67dc..6a74ccbef 100644 Binary files a/src/main/res/drawable-xxhdpi/ic_secure_indicator.png and b/src/main/res/drawable-xxhdpi/ic_secure_indicator.png differ diff --git a/src/main/res/drawable-xxhdpi/ic_secure_indicator_white.png b/src/main/res/drawable-xxhdpi/ic_secure_indicator_white.png new file mode 100644 index 000000000..4945c9595 Binary files /dev/null and b/src/main/res/drawable-xxhdpi/ic_secure_indicator_white.png differ diff --git a/src/main/res/drawable-xxhdpi/message_bubble_received.9.png b/src/main/res/drawable-xxhdpi/message_bubble_received.9.png new file mode 100644 index 000000000..c47974c5f Binary files /dev/null and b/src/main/res/drawable-xxhdpi/message_bubble_received.9.png differ diff --git a/src/main/res/drawable-xxhdpi/message_bubble_sent.9.png b/src/main/res/drawable-xxhdpi/message_bubble_sent.9.png new file mode 100644 index 000000000..2117c187b Binary files /dev/null and b/src/main/res/drawable-xxhdpi/message_bubble_sent.9.png differ diff --git a/src/main/res/drawable-xxxhdpi/message_bubble_received.9.png b/src/main/res/drawable-xxxhdpi/message_bubble_received.9.png new file mode 100644 index 000000000..5e65d062f Binary files /dev/null and b/src/main/res/drawable-xxxhdpi/message_bubble_received.9.png differ diff --git a/src/main/res/drawable-xxxhdpi/message_bubble_sent.9.png b/src/main/res/drawable-xxxhdpi/message_bubble_sent.9.png new file mode 100644 index 000000000..3d7ddbddf Binary files /dev/null and b/src/main/res/drawable-xxxhdpi/message_bubble_sent.9.png differ diff --git a/src/main/res/drawable/account_image_border.xml b/src/main/res/drawable/account_image_border.xml new file mode 100644 index 000000000..990d02886 --- /dev/null +++ b/src/main/res/drawable/account_image_border.xml @@ -0,0 +1,15 @@ + + + + + + + + + + \ No newline at end of file diff --git a/src/main/res/drawable/message_border.xml b/src/main/res/drawable/message_border.xml deleted file mode 100644 index 990d02886..000000000 --- a/src/main/res/drawable/message_border.xml +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - - \ No newline at end of file diff --git a/src/main/res/layout/activity_publish_profile_picture.xml b/src/main/res/layout/activity_publish_profile_picture.xml index 4b2497458..3b249a665 100644 --- a/src/main/res/layout/activity_publish_profile_picture.xml +++ b/src/main/res/layout/activity_publish_profile_picture.xml @@ -12,7 +12,7 @@ android:layout_centerHorizontal="true" android:layout_marginBottom="8dp" android:layout_marginTop="24dp" - android:background="@drawable/message_border" > + android:background="@drawable/account_image_border" > + android:paddingTop="@dimen/activity_horizontal_margin" + android:paddingBottom="@dimen/activity_horizontal_margin" + android:clipToPadding="false" + tools:listitem="@layout/message_sent"> + android:paddingBottom="0dp" + android:paddingLeft="@dimen/activity_vertical_margin" + android:paddingRight="4dp" + android:paddingTop="0dp"> + + + android:orientation="vertical">