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

一、制作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>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

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

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


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

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;
  }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65

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

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

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
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

二、源码：
1.项目地址
https://github.com/ruigege66/Android/tree/master/UIBestPractice
2.CSDN：https://blog.csdn.net/weixin_44630050
3.博客园：https://www.cnblogs.com/ruigege0000/
4.欢迎关注微信公众号：傅里叶变换，个人公众号，仅用于学习交流，后台回复”礼包“，获取大数据学习资料