xml - Android layout: chat bubble with date text in bottom right and baseline of message text -


this question has been asked many times never got correct answer.

how can build layout (that similar common messaging apps whatsapp, telegram) following characteristics:

  • it has view acts container , has background image of bubble.
  • in container there 2 elements, text message , text date.
  • the text message start top left , can have multiple lines.
  • the text date aligned baseline of last text message line, , on right of it.

i've tried reach relative layout.

<relativelayout android:id="@+id/message_bubble_container"     android:layout_below="@+id/message_date_separator_container"     android:layout_height="wrap_content"     android:layout_width="wrap_content"     xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:background="@drawable/chat_message_background"     android:padding="4dp">       <relativelayout         android:layout_height="wrap_content"         android:layout_width="wrap_content">          <textview             style="@style/textappearance.appcompat.medium"             android:id="@+id/message_text"             android:layout_height="wrap_content"             android:layout_width="wrap_content"             tools:text="this message long causes date leave screen!" />          <textview             style="@style/textappearance.appcompat.small"             android:id="@+id/message_time"             android:layout_alignbottom="@id/message_text"             android:layout_height="wrap_content"             android:layout_torightof="@id/message_text"             android:textcolor="@color/material_grey_900"             android:textsize="12sp"             tools:text="18:58"             android:paddingleft="4dp"/>      </relativelayout>   </relativelayout>

it works when text message on 1 single line, when grows fill width of container, pushes out date screen. how can avoid behavior , make text message keep margin on right date?

one line multiple lines

if css needed add margin-right: 40px; .message_text. of course android , not css so...

moreover, dislike use maxwidth on @id/message_text because don't know how many dp screen be.

lastly, i've heard talking flowlayout. there way?

thanks try solve problem affects tring develop chat layout.

use linear layout vertical orientation instead of relative layout. this:

<linearlayout android:id="@+id/message_bubble_container" android:layout_below="@+id/message_date_separator_container" android:layout_height="wrap_content" android:layout_width="wrap_content" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:orientation="vertical" android:background="@drawable/chat_message_background" android:padding="4dp">   <linearlayout     android:layout_height="wrap_content"     android:layout_width="wrap_content"     android:orientation="vertical">      <textview         style="@style/textappearance.appcompat.medium"         android:id="@+id/message_text"         android:gravity="right"         android:layout_height="wrap_content"         android:layout_width="wrap_content"         tools:text="this message long causes date leave screen!" />      <textview         style="@style/textappearance.appcompat.small"         android:id="@+id/message_time"         android:layout_alignbottom="@id/message_text"         android:layout_height="wrap_content"         android:layout_torightof="@id/message_text"         android:textcolor="@color/material_grey_900"         android:textsize="12sp"         tools:text="18:58"         android:paddingleft="4dp"/>  </linearlayout> </linearlayout>

try, , let me know f worked. :)


Comments

Post a Comment

Popular posts from this blog

aws api gateway - SerializationException in posting new Records via Dynamodb Proxy Service in API -

i getting "__type": "com.amazon.coral.service#serializationexception" as reply in postman & in test console in api gateway trying post record directly dynamodb using api proxy services.. referring aws article - https://aws.amazon.com/blogs/compute/using-amazon-api-gateway-as-a-proxy-for-dynamodb/ here's mapping { "tablename": "tablenamegoeshere", "item": { "id" : "$context.requestid" "eventname" : "$input.path('$.eventname')", "timestamp" : $input.path('$.timestamp'), "answers": "$util.parsejson($input.path('$.answers'))" } } update: did asked ... , worked if try add array of json objects gives me above same error - here's trying now. please - couldnt find on google well #set($inputroot = $input.path('$')) { "tablename": "answer", "item": {
Read more

asp.net - Problems sending emails from forum -

i have been redesigning site has message board, has been written guy looked after site. it has few problems , written in .asp , uses .mdb files database. you can see whole thing here . feel free post if helps, test thing have set using original files , new database. the basic problem when posts message, supposed email sent them, have posted it. when replies, originator supposed message, replier has been posted. i’d have thought @ point in process there should script/file in postmessage.asp? the postmessage.asp page below. <% option explicit %> <!-- #include virtual="common/adovbs.inc" --> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1252"> <meta name="generator" content="microsoft frontpage 4.0"> <meta name="progid" content="frontpage.editor.document"> <title>new page 2</title> <base target="_self"
Read more