Android连载5-编写一个微信聊天界面

一、制作Nine-Patch图片

1.含义：一种被特殊处理的png图片，能够指定哪些区域可以被拉伸，哪些区域不可以被拉伸。

2.首先先制作一个布局

 

<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: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="Type something here"

          android:maxLines="2"/>

     

      <Button

          android:id="@+id/send"

          android:layout_width="wrap_content"

          android:layout_height="wrap_content"

          android:text="Send"/>

     

  </LinearLayout>

​

</LinearLayout>

​

这里的基本结构就是，建立一个线性桌面，然后添加对话框、输入框和一个按钮

我们建立对话框的背景图片就是选用类似于微信的那种样式

 

然后再设计主程序之前，先重写一个适配器

package com.example.uibestpractice;

​

import android.widget.ArrayAdapter;

import android.widget.LinearLayout;

import android.widget.TextView;

import android.view.LayoutInflater;

import android.content.Context;

import java.util.*;

import android.view.ViewGroup;

import android.view.View;

​

​

public class MsgAdapter extends ArrayAdapter<Msg>{

 

  private int resourceId;

 

  public MsgAdapter(Context context,int textViewResourceId,List<Msg> objects) {

    super(context,textViewResourceId,objects);

    resourceId = textViewResourceId;

  }

 

  @Override

  public View getView(int position,View convertView,ViewGroup parent) {

    Msg 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() == Msg.TYPE_RECEICED) {

      //如果是收到的消息，则显示左边的消息布局，将右边的消息布局隐藏

      viewHolder.leftLayout.setVisibility(View.VISIBLE);

      viewHolder.rightLayout.setVisibility(View.GONE);

      viewHolder.leftMsg.setText(msg.getContent());

    }else if(msg.getType() == Msg.TYPE_SENT) {

      //如果是发出的消息，则显示右边的消息布局，将左边的消息布局隐藏

      viewHolder.rightLayout.setVisibility(View.VISIBLE);

      viewHolder.leftLayout.setVisibility(View.GONE);

      viewHolder.rightMsg.setText(msg.getContent());

    }

    return view;

   

  }

 

 

  class ViewHolder{

    LinearLayout leftLayout;

   

    LinearLayout rightLayout;

   

    TextView leftMsg;

   

    TextView rightMsg;

  }

}

​

这个适配器大致的意思就是，对方发来的信息就左对齐，自己发的信息就是右对齐，可以看出来开头两个常量使用来，标志信息到底是发来的，还是发过去的​；内部类表示了左对齐和右对齐的代码​；

然后编写主程序，来进行适配

package com.example.uibestpractice;

​

import android.app.Activity;

​

import android.os.Bundle;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.Window;

import android.widget.Button;

import android.widget.ListView;

import android.widget.EditText;

import java.util.*;

​

public class MainActivity extends Activity {

 

  private ListView msgListView;

 

  private EditText inputText;

 

  private Button send;

 

  private MsgAdapter adapter;

 

  private List<Msg> msgList= new ArrayList<Msg>();

 

  @Override

  protected void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);

    requestWindowFeature(Window.FEATURE_NO_TITLE);

    setContentView(R.layout.activity_main);

    initMsgs();//初始化消息数据

    adapter = new MsgAdapter(MainActivity.this,R.layout.msg_item,msgList);

    inputText = (EditText) findViewById(R.id.input_text);

    send = (Button) findViewById(R.id.send);

    msgListView.setAdapter(adapter);

    send.setOnClickListener(new OnClickListener() {

      @Override

      public void onClick(View v) {

        String content = inputText.getText().toString();

        if(!"".contentEquals(content)) {

          Msg msg = new Msg(content,Msg.TYPE_SENT);

          msgList.add(msg);

          adapter.notifyDataSetChanged();//当有新消息时候，刷新ListView中的显示

          msgListView.setSelection(msgList.size());//将ListView定位到最后一行

          inputText.setText("");//清空输入框中的内容

        }

      }

    });   

  }

  private void initMsgs() {

    Msg msg1 = new Msg("Hello guy.",Msg.TYPE_RECEICED);

    msgList.add(msg1);

    Msg msg2 = new Msg("Hello. Who id that",Msg.TYPE_SENT);

    msgList.add(msg2);

    Msg msg3 = new Msg("jsdlf",Msg.TYPE_RECEICED);

    msgList.add(msg3);   

  }

}

​

 

二、源码：

1.项目地址

https://github.com/ruigege66/Android/tree/master/UIBestPractice

2.CSDN：https://blog.csdn.net/weixin_44630050

3.博客园：https://www.cnblogs.com/ruigege0000/

4.欢迎关注微信公众号：傅里叶变换，个人公众号，仅用于学习交流，后台回复”礼包“，获取大数据学习资料