码迷,mamicode.com
首页 > 移动开发 > 详细

安卓入门:加深ListView学习,做一个简单的聊天界面

时间:2015-05-10 09:53:26      阅读:240      评论:0      收藏:0      [点我收藏+]

标签:

1,一个简单的聊天窗口也是ListView显示的

首先是Main.xml是要建立一个列ListView,下面是输入框和发送按钮

然后是单独的消息列表项的界面

接着就是要建立一个自定义的适配器,搭建列表项和ListView之间的桥梁

技术分享

技术分享

具体的代码如下(注意LineraLayout布局,没说方向的时候默认是水平方向的,还有关于layout_weight权重的理解):

activity_main.xml

<?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:background="#d8e0e8"
    android:orientation="vertical" >

    <ListView
        android:id="@+id/msg_list_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:divider="#0000" >
    </ListView>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <EditText
            android:id="@+id/input_text"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:hint="请输入一些数据"
            android:maxLines="2" />

        <Button
            android:id="@+id/send"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="发送" />
    </LinearLayout>

</LinearLayout>
然后是自定义的消息项

msg_item.xml

<?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:orientation="vertical"
    android:padding="10dp" >

    <LinearLayout
        android:id="@+id/left_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:background="@drawable/message_left" >

        <TextView
            android:id="@+id/left_msg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="10dp"
            android:textColor="#fff" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/right_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:background="@drawable/message_right" >

        <TextView
            android:id="@+id/right_msg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="10dp" />
    </LinearLayout>

</LinearLayout>

接着是建立一个适配器类

MessageAdapter

public class MessageAdapter extends ArrayAdapter<Message> {
	private int resourceId;

	public MessageAdapter(Context context, int resource, List<Message> objects) {
		super(context, resource, objects);
		// TODO Auto-generated constructor stub
		resourceId = resource;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		// TODO Auto-generated method stub
		/* return super.getView(position, convertView, parent); */
		Message msg = getItem(position);
		View view;
		ViewHolder viewHolder;
		if (convertView == null) {
			view = LayoutInflater.from(getContext()).inflate(resourceId, null);
			viewHolder = new ViewHolder();
			viewHolder.leftLayout = (LinearLayout) view
					.findViewById(R.id.left_layout);
			viewHolder.rightLayout = (LinearLayout) view
					.findViewById(R.id.right_layout);

			viewHolder.leftMsg = (TextView) view.findViewById(R.id.left_msg);
			viewHolder.rightMsg = (TextView) view.findViewById(R.id.right_msg);

			view.setTag(viewHolder);

		} else {
			view = convertView;
			viewHolder = (ViewHolder) view.getTag();
		}

		if (msg.getType()==Message.TYPE_RECEIVED) {
			//如果是收到消息,就显示左边的布局,隐藏右边的消息布局
			viewHolder.leftLayout.setVisibility(View.VISIBLE);
			viewHolder.rightLayout.setVisibility(View.GONE);
			viewHolder.leftMsg.setText(msg.getContent());
			
		} else if(msg.getType()==Message.TYPE_SENT){
			//如果是收到消息,就显示左边的布局,隐藏右边的消息布局
			viewHolder.leftLayout.setVisibility(View.GONE);
			viewHolder.rightLayout.setVisibility(View.VISIBLE);
			viewHolder.rightMsg.setText(msg.getContent());
		}
		return view;
	}

	//列表子项实例类
	class ViewHolder {
		LinearLayout leftLayout;
		LinearLayout rightLayout;
		TextView leftMsg;
		TextView rightMsg;

	}
}
注意该适配器类中有一个存放列表子项实例的类

最后就是MainActivity中初始化数据、构建适配器装载数据,将适配器加载到ListView项中

public class MainActivity extends Activity {
private ListView msgListView;
private EditText inputText;
private Button send;
private MessageAdapter adapter;
	
private List<Message> msgList=new ArrayList<Message>();
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.activity_main);
		
		//初始化数据
		initMsgs();
		
		//将消息数据的xml格式文件加载打牌adapter,等待ListView把adapter装载起来
		adapter=new MessageAdapter( MainActivity.this,R.layout.msg_item,msgList);
		
		inputText=(EditText) findViewById(R.id.input_text);
		send=(Button) findViewById(R.id.send);
		
		msgListView=(ListView) findViewById(R.id.msg_list_view);
		msgListView.setAdapter(adapter);
		
		send.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
				String content=inputText.getText().toString();
				
				if(!"".equals(content)){
					Message msg=new Message(content, Message.TYPE_SENT);
					msgList.add(msg);
				<strong>	//当有新消息的时候,刷新ListView中的显示
					adapter.notifyDataSetChanged();
					
					//将ListView定位到最后一行
					msgListView.setSelection(msgList.size());</strong>
					
					//清空输入框中的内容
					inputText.setText("");
				}							
			}
		});
	}

	private void initMsgs() {
		// TODO Auto-generated method stub
	Message msg=new Message("你好xxx", Message.TYPE_RECEIVED);
	Message msg1=new Message("Who are you,你谁呀", Message.TYPE_SENT);
	Message msg2=new Message("初次见面,多多关照", Message.TYPE_RECEIVED);
	msgList.add(msg);
	msgList.add(msg1);
	msgList.add(msg2);	
	}


附录:

下面用到的左右两个聊天背景,主要代码和素材都是来自“第一行代码”这本书

技术分享技术分享

安卓入门:加深ListView学习,做一个简单的聊天界面

标签:

原文地址:http://blog.csdn.net/hll174/article/details/45604751

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!