实验效果解析:在底部输入框里面输入文字信息,点击左边的按钮,就会是左边的消息发布,点击右边的按钮,就是右边发的消息,当消息发布出去以后,新的消息会出现的最下面.
1 实现主界面布局的部分代码:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".activity.MainActivity">
<ListView
android:divider="@null"
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"></ListView>
<TextView
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#898989" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<Button
android:id="@+id/btn_left"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_margin="5dp"
android:background="@drawable/btn_float"
android:text="左"
android:textColor="#fff" />
<EditText
android:id="@+id/et_meg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1" />
<Button
android:id="@+id/btn_right"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_margin="5dp"
android:background="@drawable/btn_float"
android:text="右"
android:textColor="#fff" />
</LinearLayout>
</LinearLayout>
2 布局文件:item.xml
<?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">
<LinearLayout
android:id="@+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/boy" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:text="卡卡西" />
</LinearLayout>
<TextView
android:id="@+id/text_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="@drawable/left"
android:text="" />
</LinearLayout>
<LinearLayout
android:id="@+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:orientation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:id="@+id/text_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="@drawable/right"
android:text="" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/girl" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="路飞" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
3 遇到的问题
将一个文字域和一个头像放在一个线性布局中,需要创建两个线性布局,一个在左一个在右,没有注意到。
4 运行效果图。