[Android] List - (4)채팅 틀 구현

 

1. 결과 & 코드파일

7.안드로이드 매니페스트 등록

 

 

 

 

2. 코드

1) DataItem.java (채팅 안에 사용할 get,set)

 

2) Code.java (리스트안의 아이템(뷰) 왼쪽,오른쪽,가운데 구별)

 

3) room2.xml

RecyclerView, EditText, ImageButton 만 있음.

 

4) 각 뷰타입에 대한 View 정의 

밑에 코드 있음

 

5) MyAdapter.java

- ArrayList 생성

- 해당 뷰 넣는거

- ViewHolder 해당뷰 가져오는 거 (셋팅)

 

6) ChatRoomActivity2.java 

 

 

 

 

3. 똑같은 코드임

- room2.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="#E7F6FF"
    tools:context=".app.view.part2.ChatRoomActivity">


    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyvlerv"
        android:layout_above="@+id/layout1"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </androidx.recyclerview.widget.RecyclerView>

    <LinearLayout
        android:id="@+id/layout1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:layout_alignParentBottom="true"
        android:gravity="center"
        android:orientation="horizontal">
        <EditText
            android:id="@+id/editText1"
            android:background="#ffffff"
            android:maxLength="120"
            android:maxLines="5"
            android:padding="6dp"
            android:inputType="textMultiLine|textNoSuggestions"
            android:layout_width="0dp"
            android:layout_weight="4"
            android:layout_height="wrap_content"/>
        <ImageButton
            android:id="@+id/btn_send1"
            android:src="@drawable/submit"
            android:background="#E7F6FF"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="60dp"
            android:foreground="?attr/selectableItemBackground"
            android:scaleType="fitXY"
            android:layout_gravity="center_horizontal"/>
    </LinearLayout>
</RelativeLayout>

 

- room_center_item_list.xml

<?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="wrap_content">
    <TextView
        android:id="@+id/textv"
        android:textSize="20dp"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

 

- room_left_item_list.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="wrap_content"
    android:layout_marginBottom="10dp"
    android:padding="3dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center_vertical">
        <de.hdodenhof.circleimageview.CircleImageView
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/imgv"
            android:layout_width="35dp"
            android:layout_height="35dp"
            android:layout_gravity="top"
            android:src="@drawable/del123"
            app:civ_border_color="#FF000000"
            app:civ_border_width="1dp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:gravity="center_vertical"
            android:orientation="vertical">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="10dp"
                android:orientation="horizontal">
                <TextView
                    android:id="@+id/textv_nicname"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="#ffffff"
                    android:layout_marginRight="5dp"
                    android:text="닉네임"
                    android:textColor="#000000"
                    android:textSize="15dp"
                    android:textStyle="bold" />
            </LinearLayout>

            <TextView
                android:id="@+id/textv_msg"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#ffffff"
                android:maxLength="150"
                android:maxLines="15"
                android:padding="10dp"
                android:text="메세지 내용"
                android:textColor="#000000"
                android:textSize="15dp" />

            <TextView
                android:id="@+id/textv_time"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:text="데모 2020-03-12 12:30" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

 

- room_right_item_list.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="wrap_content"
    android:layout_marginBottom="10dp"
    android:padding="3dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:orientation="vertical">
            <TextView
                android:id="@+id/textv_msg"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:layout_marginRight="10dp"
                android:background="#ffffff"
                android:maxLength="150"
                android:maxLines="15"
                android:padding="10dp"
                android:text="메세지 내용"
                android:textColor="#000000"
                android:textSize="15dp" />

            <TextView
                android:id="@+id/textv_time"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_gravity="right"
                android:text="데모 2020-03-12 12:30" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

 

- MyAdapter.java

public class MyAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {

    private ArrayList<DataItem> myDataList = null;

    public MyAdapter(ArrayList<DataItem> dataList){
        myDataList = dataList;
    }



    @NonNull
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view;
        Context context = parent.getContext();
        LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        if(viewType == Code.ViewType.CENTER_CONTENT){
            view = inflater.inflate(R.layout.room_center_item_list,parent,false);
            return new CenterViewHolder(view);
        }else if(viewType == Code.ViewType.LEFT_CONTENT){
            view = inflater.inflate(R.layout.room_left_item_list,parent,false);
            return new LeftViewHolder(view);
        }else{
            view = inflater.inflate(R.layout.room_right_item_list,parent,false);
            return new RightViewHolder(view);
        }

    }

    // 실제 각 뷰 홀더에 데이터를 연결해주는 함수
    @Override
    public void onBindViewHolder(@NonNull RecyclerView.ViewHolder viewHolder, int position) {
        if(viewHolder instanceof CenterViewHolder){
            ((CenterViewHolder)viewHolder).textv.setText(myDataList.get(position).getContent());
        }else if(viewHolder instanceof LeftViewHolder){
            ((LeftViewHolder)viewHolder).textv_nicname.setText(myDataList.get(position).getName());
            ((LeftViewHolder)viewHolder).textv_msg.setText(myDataList.get(position).getContent());
        }else{
            ((RightViewHolder)viewHolder).textv_msg.setText(myDataList.get(position).getContent());
        }

    }

    // 리사이클러뷰안에서 들어갈 뷰 홀더의 개수
    @Override
    public int getItemCount() {
        return myDataList.size();
    }

    // ★★★
    // 위에 3개만 오버라이드가 기본 셋팅임,
    // 이 메소드는 ViewType때문에 오버라이딩 했음(구별할려고)
    @Override
    public int getItemViewType(int position) {
        return myDataList.get(position).getViewType();
    }

    // "리사이클러뷰에 들어갈 뷰 홀더", 그리고 "그 뷰 홀더에 들어갈 아이템들을 셋팅"
    public class CenterViewHolder extends RecyclerView.ViewHolder{
        TextView textv;

        public CenterViewHolder(@NonNull View itemView) {
            super(itemView);
            textv = (TextView)itemView.findViewById(R.id.textv);
        }
    }

    public class LeftViewHolder extends RecyclerView.ViewHolder{
        CircleImageView imgv;
        TextView textv_nicname;
        TextView textv_msg;
        TextView textv_time;

        public LeftViewHolder(@NonNull View itemView) {
            super(itemView);
            imgv = (CircleImageView)itemView.findViewById(R.id.imgv);
            textv_nicname = (TextView)itemView.findViewById(R.id.textv_nicname);
            textv_msg = (TextView)itemView.findViewById(R.id.textv_msg);
            textv_time = (TextView)itemView.findViewById(R.id.textv_time);

        }
    }

    public class RightViewHolder extends RecyclerView.ViewHolder{
        TextView textv_msg;
        TextView textv_time;

        public RightViewHolder(@NonNull View itemView) {
            super(itemView);
            textv_msg = (TextView)itemView.findViewById(R.id.textv_msg);
            textv_time = (TextView)itemView.findViewById(R.id.textv_time);
        }
    }

}

 

- ChatRoomActivity2.java

public class ChatRoomActivity2 extends Activity {
    private ArrayList<DataItem> dataList;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.room2);   //나중에 바꾸기

        initData();

        RecyclerView recyvlerv = findViewById(R.id.recyvlerv);
        LinearLayoutManager manager = new LinearLayoutManager(this,RecyclerView.VERTICAL,false);
        recyvlerv.setLayoutManager(manager);
        recyvlerv.setAdapter(new MyAdapter(dataList));



    }

    private void initData(){
        dataList = new ArrayList<>();
        dataList.add(new DataItem("시용자1님 입장했음",null,Code.ViewType.CENTER_CONTENT));
        dataList.add(new DataItem("사용자2님 입장했음",null,Code.ViewType.CENTER_CONTENT));
        dataList.add(new DataItem("안녕하세요11","사용자1",Code.ViewType.LEFT_CONTENT));
        dataList.add(new DataItem("안녕하세요22","사용자2",Code.ViewType.RIGHT_CONTENT));

    }
}