create a chatView layout in android
How about below code -
Main.xml
<LinearLayout android:id="@+id/list_layout"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:background="@drawable/background"
xmlns:android="http://schemas.android.com/apk/res/android">
<ListView android:id="@+id/myList"
android:layout_height="fill_parent"
android:layout_width="wrap_content"/>
</LinearLayout>
list_row_layout_even.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/even_container"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:id="@+id/user_img"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="80dip"
android:src="@drawable/sample_image"/>
<ImageView android:id="@+id/even_bubble"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="5dip"
android:src="@drawable/even"/>
<TextView android:id="@+id/text"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:textColor="#000000"
android:textSize="16dip"
android:layout_marginRight="8dip"
android:layout_marginLeft="120dip"
android:layout_marginTop="10dip" />
</RelativeLayout>
list_row_layout_odd.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/even_container"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:id="@+id/user_img"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="80dip"
android:layout_alignParentRight="true"
android:src="@drawable/sample_image"/>
<ImageView android:id="@+id/odd_bubble"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true"
android:layout_margin="5dip"
android:src="@drawable/odd"/>
<TextView android:id="@+id/text"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true"
android:textColor="#ffffff"
android:textSize="16dip"
android:layout_marginRight="120dip"
android:layout_marginLeft="8dip"
android:layout_marginTop="10dip" />
</RelativeLayout>
This is my output -
Just Customize this example with your needs.
Instead of TableLayout, i would suggest you to create Custom adapter for ListView. You just need to check the condition to change the background of layout/views inside getViews()
method.
Some thread may be helpful to you:
- Android: ListView style like text messages conversations
- Android Implementing Chat Bubble in ListView