一个聊天界面

目录

布局

    先写一个布局，包含一个自定义的菜单，ListView用于显示聊天信息，底部布局左边的imageview用于选择表情，图片，中间输入框，右边发送按钮。    再写放在ListView中的子布局

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:id="@+id/friend"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:gravity="center"        android:layout_marginBottom="1dp"        android:text="不要回我省略号"        android:textSize="24sp"        android:background="#88000088"        />    <ListView        android:id="@+id/list_chat"        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1"        android:divider="#00000000"        android:background="@mipmap/chatbackground"        >    </ListView>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="80dp"        android:orientation="horizontal"        android:gravity="bottom"        android:background="#345678"        >        <ImageView            android:id="@+id/image_face"            android:layout_width="50dp"            android:layout_height="50dp"            android:layout_marginLeft="5dp"            android:layout_marginRight="2dp"            android:background="@mipmap/dga"            />        <EditText            android:id="@+id/edit_message"            android:layout_width="0dp"            android:layout_height="50dp"            android:layout_weight="1"            android:maxLines="4"            android:layout_marginRight="2dp"            android:background="@drawable/edit_background"            />        <Button            android:id="@+id/button_send"            android:layout_width="wrap_content"            android:layout_height="50dp"            android:layout_marginRight="5dp"            android:text="发送"            android:background="@drawable/button_background_right"            />    </LinearLayout></LinearLayout>//<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:layout_marginTop="2dp"    style="@style/NoBackground"    >    <LinearLayout        android:id="@+id/layout_left"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="left"        android:layout_marginRight="60dp"        android:orientation="vertical"        >        <ImageView            android:id="@+id/left_face"            android:layout_width="40dp"            android:layout_height="40dp"            android:scaleType="fitXY"            android:src="@mipmap/messi"            />        <TextView            android:id="@+id/message_left"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="@mipmap/eng"            android:layout_marginLeft="30dp"            android:textColor="#000000"            style="@style/NoBackground"            />    </LinearLayout>    <LinearLayout        android:id="@+id/layout_right"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="right"        android:layout_marginTop="5dp"        android:layout_marginLeft="60dp"        android:orientation="vertical"        >        <ImageView            android:id="@+id/right_face"            android:layout_width="40dp"            android:layout_height="40dp"            android:scaleType="fitXY"            android:layout_gravity="right"            android:src="@mipmap/zhaoliying"            />        <TextView            android:id="@+id/message_right"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="@mipmap/kap"            android:layout_marginRight="30dp"            android:textColor="@color/white"            style="@style/NoBackground"            />    </LinearLayout></LinearLayout>

活动

    大概就是这样，还有一个用PopUpWindow弹出GridView布局的表情没有写好

package com.example.linj.myfirstapplication;import android.app.Activity;import android.content.Intent;import android.graphics.drawable.Drawable;import android.os.Bundle;import android.text.Html;import android.text.Spanned;import android.view.Gravity;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.AdapterView;import android.widget.Button;import android.widget.EditText;import android.widget.GridView;import android.widget.ImageView;import android.widget.ListView;import android.widget.PopupWindow;import android.widget.TextView;import com.example.linj.myfirstapplication.adapter.ChatAdapter;import com.example.linj.myfirstapplication.adapter.FaceAdapter;import com.example.linj.myfirstapplication.modle.Face;import com.example.linj.myfirstapplication.modle.Message;import java.util.ArrayList;import java.util.List;/** * Created by Administrator on 2015/8/27. */public class ChatActivity extends Activity implements View.OnClickListener{    private ListView mListView;    private EditText mEditText;    private Button mButtonSend;    private ImageView mButtonFace;    private List<Message> messages = new ArrayList<>();    private ChatAdapter chatAdapter;    private LayoutInflater inflater;    private Spanned spanned;    private int imageId;    private int headId;    private String name;    private TextView textView;    private List<Face> faces;    private LayoutInflater layoutInflater;    private FaceAdapter faceAdapter;    private GridView mGridView;    private int faceId;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.chat_layout);        Intent intent1 = getIntent();        name = intent1.getStringExtra("name");        textView = (TextView) findViewById(R.id.friend);        textView.setText(name);        headId = intent1.getIntExtra("head", R.mipmap.messi);        mListView = (ListView) findViewById(R.id.list_chat);        mEditText = (EditText) findViewById(R.id.edit_message);        mButtonSend = (Button) findViewById(R.id.button_send);        mButtonSend.setOnClickListener(this);        mButtonFace = (ImageView) findViewById(R.id.image_face);        mButtonFace.setOnClickListener(this);        inflater = getLayoutInflater();    }    @Override    public void onClick(View v) {        switch (v.getId()){            case R.id.image_face:                Intent intent = new Intent(ChatActivity.this, FaceActivity.class);                startActivityForResult(intent, 5);//                setContentView(R.layout.grid_layout);//                mGridView = (GridView) findViewById(R.id.grid_view_test);//                layoutInflater = getLayoutInflater();//                initFace();//                faceAdapter = new FaceAdapter(faces,layoutInflater);//                mGridView.setAdapter(faceAdapter);//                mGridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {//                    @Override//                    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {//                        faceId = faces.get(position).getFaceId();//                        spanned = Html.fromHtml("<img src = ''/>", new Html.ImageGetter() {//                            @Override//                            public Drawable getDrawable(String source) {//                                Drawable drawable = getResources().getDrawable(faceId);//                                drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());//                                return drawable;//                            }//                        }, null);//                        mEditText.getText().insert(mEditText.getSelectionStart(), spanned);//                    }//                });////                PopupWindow popupWindow = new PopupWindow(ChatActivity.this);//                View popView = layoutInflater.inflate(R.layout.grid_layout, null);//                popupWindow.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);//                popupWindow.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);//                popupWindow.setContentView(popView);//                popupWindow.setOutsideTouchable(true);//                popupWindow.showAtLocation(v, Gravity.LEFT, 0, 300);                break;            case R.id.button_send:                spanned = mEditText.getText();                Message message = new Message(spanned,0,R.mipmap.zhaoliying);                Spanned receiver = Html.fromHtml("..............");                Message message1 = new Message(receiver,1, headId);                messages.add(message);                messages.add(message1);                chatAdapter = new ChatAdapter(inflater,messages);                mListView.setAdapter(chatAdapter);                chatAdapter.notifyDataSetChanged();                mListView.setSelection(messages.size());                mEditText.setText("");                break;            default:                break;        }    }    @Override    protected void onActivityResult(int requestCode, int resultCode, Intent data) {        switch (requestCode){            case 5:                if (resultCode == RESULT_OK){                    imageId = data.getIntExtra("face", R.mipmap.flag);                    spanned = Html.fromHtml("<img src = ''/>", new Html.ImageGetter() {                        @Override                        public Drawable getDrawable(String source) {                            Drawable drawable = getResources().getDrawable(imageId);                            drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());                            return drawable;                        }                    }, null);                    mEditText.getText().insert(mEditText.getSelectionStart(), spanned);                }                break;            default:                break;        }    }    public int getHeadId() {        return headId;    }    private void initFace() {        faces = new ArrayList<>();        Face face1 = new Face(R.mipmap.ebg);        faces.add(face1);        Face face2 = new Face(R.mipmap.eca);        faces.add(face2);        Face face3 = new Face(R.mipmap.biaoqing);        faces.add(face3);        Face face4 = new Face(R.mipmap.dga);        faces.add(face4);        Face face5 = new Face(R.mipmap.ecb);        faces.add(face5);        Face face6 = new Face(R.mipmap.ecw);        faces.add(face6);        Face face7 = new Face(R.mipmap.ecz);        faces.add(face7);        Face face8 = new Face(R.mipmap.ecy);        faces.add(face8);        Face face9 = new Face(R.mipmap.edd);        faces.add(face9);        Face face10 = new Face(R.mipmap.edj);        faces.add(face10);        Face face11 = new Face(R.mipmap.edq);        faces.add(face11);        Face face12 = new Face(R.mipmap.ecs);        faces.add(face12);        Face face13 = new Face(R.mipmap.ecn);        faces.add(face13);        Face face14 = new Face(R.mipmap.eco);        faces.add(face14);        Face face15 = new Face(R.mipmap.ecc);        faces.add(face15);    }}

适配器

继承自BaseAdapter，注意getView（）方法的写法，用缓存器缓存布局

package com.example.linj.myfirstapplication.adapter;import android.content.Intent;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;import com.example.linj.myfirstapplication.ChatActivity;import com.example.linj.myfirstapplication.R;import com.example.linj.myfirstapplication.modle.Message;import java.util.List;/** * Created by Administrator on 2015/8/27. */public class ChatAdapter extends BaseAdapter {    private LayoutInflater inflater;    private List<Message> messages;    public ChatAdapter(LayoutInflater inflater, List<Message> messages) {        this.inflater = inflater;        this.messages = messages;    }    @Override    public int getCount() {        return messages.size();    }    @Override    public Object getItem(int position) {        return position;    }    @Override    public long getItemId(int position) {        return position;    }    @Override    public View getView(int position, View convertView, ViewGroup parent) {        ViewHolder viewHolder = null;        if (convertView == null){            viewHolder = new ViewHolder();            convertView = inflater.inflate(R.layout.chat_message_layout, null);            viewHolder.leftLayout = (LinearLayout) convertView.findViewById(R.id.layout_left);            viewHolder.rightLayout = (LinearLayout) convertView.findViewById(R.id.layout_right);            viewHolder.textViewLeft = (TextView) convertView.findViewById(R.id.message_left);            viewHolder.textViewRight = (TextView) convertView.findViewById(R.id.message_right);            viewHolder.imageViewLeft = (ImageView) convertView.findViewById(R.id.left_face);            viewHolder.imageViewRight = (ImageView) convertView.findViewById(R.id.right_face);            convertView.setTag(viewHolder);        } else {            viewHolder = (ViewHolder) convertView.getTag();        }        Message message = messages.get(position);        if (message.getType()==0){            viewHolder.rightLayout.setVisibility(View.VISIBLE);            viewHolder.leftLayout.setVisibility(View.GONE);            viewHolder.textViewRight.setText(message.getMessage());            viewHolder.imageViewLeft.setImageResource(message.getFaceId());        } else if (message.getType()==1){            viewHolder.leftLayout.setVisibility(View.VISIBLE);            viewHolder.rightLayout.setVisibility(View.GONE);            viewHolder.textViewLeft.setText(message.getMessage());            viewHolder.imageViewLeft.setImageResource(message.getFaceId());        }        notifyDataSetChanged();        return convertView;    }    class ViewHolder{        LinearLayout leftLayout;        LinearLayout rightLayout;        TextView textViewLeft;        TextView textViewRight;        ImageView imageViewLeft;        ImageView imageViewRight;    }}

model

消息的实体，写的不好

package com.example.linj.myfirstapplication.modle;import android.text.Spanned;/** * Created by Administrator on 2015/8/27. */public class Message {    private Spanned message;    private int type;    private int faceId;    public Message(Spanned message, int type, int faceId) {        this.message = message;        this.type = type;        this.faceId = faceId;    }    public Spanned getMessage() {        return message;    }    public void setMessage(Spanned message) {        this.message = message;    }    public int getType() {        return type;    }    public void setType(int type) {        this.type = type;    }    public int getFaceId() {        return faceId;    }    public void setFaceId(int faceId) {        this.faceId = faceId;    }}

界面

总结

我不想总结，因为巨丑无比，还有很多不完善的，毕竟初学，还没有学完，继续努力，加油！