تطبيق chat ب android و firebase الجزء الثاني


فهاد الجزء الثاني من تطبيق chat ب android و firebase غادي نكملو الملف ديال الواجهة الرئيسية ولي غادي يكون فيه الكود لي غادي يمكنا كيفاش نزيدو الرسائل فقاعدة البيانات و من بعد نعرضهم ف chat room بالإضافة للإسم ديال المستخدم والتوقيت. 

نظرة سريعة بالفيديو

1- الملف activity_main.xml

غادي تمشي للمجلد res/layout فيه الملف activity_main.xml هادا هو الملف ديال الواجهة ديال الصفحة الرئيسية كنزيد فيه RecyclerView ولي غادي يكونوا فيها les messages لي زادو المستخدمين و champ edittext و bouton ملي يكليكي عليه المستخدم كتنفد ل fonction sendMsg لي غادي نشوفوها منبعد فالملف MainActivity.java الكود ديال الملف  activity_main.xml هو:


                                <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.belasri.firebasechatapp.MainActivity">
    <android.support.v7.widget.RecyclerView
        android:id="@+id/listMsg"
        android:layout_width="match_parent"
        android:layout_above="@+id/messageBox"
        android:layout_height="match_parent"></android.support.v7.widget.RecyclerView>
    <LinearLayout
        android:id="@+id/messageBox"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:id="@+id/msg"
            android:layout_width="300dp"
            android:padding="25dp"
            android:layout_height="wrap_content" />
        <Button
            android:id="@+id/sendBtn"
            android:onClick="sendMsg"
            android:text="Envoyer"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
</RelativeLayout>
                            

2- chat_item.xml

دائما فالمجلد res/layout فيه كنزيد ملف كنسميه chat_item.xml  فيه 3 ديال les textviews كل وحدة غادي تاخد الإسم ديال المستخدم الرسالة والتوقيت ديال الرسالة الكود ديال الملف هو :


                                <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:background="@drawable/chat_shape"
    android:layout_width="250dp"
    android:layout_height="wrap_content">
    <TextView
        android:id="@+id/name"
        android:textAlignment="center"
        android:text=""
        android:textSize="20sp"
        android:padding="10dp"
        android:layout_marginTop="5dp"
        android:layout_marginRight="5dp"
        android:layout_marginLeft="5dp"
        android:background="#b3e5fc"
        android:textColor="#000"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/messageText"
        android:textAlignment="center"
        android:textSize="20sp"
        android:layout_marginRight="5dp"
        android:layout_marginLeft="5dp"
        android:padding="10dp"
        android:textColor="#000"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/timeText"
        android:textAlignment="center"
        android:text=""
        android:background="#ffe97d"
        android:textSize="20sp"
        android:layout_marginRight="5dp"
        android:layout_marginLeft="5dp"
        android:layout_marginBottom="10dp"
        android:padding="10dp"
        android:textColor="#000"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <View
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="#e0e0e0"></View>
</LinearLayout>
                            

3- الملف Message.java

فالمجلد com.example زيد ملف جديد عبارة عن java class فيه غادي نخزنو المعلومات الخاصة بكل message فعندنا المعلومات على شكل des variables و كاين ل constructeur ولgetters وsetters الكود ديال الملف هو:


                                package com.example.belasri.firebasechatapp;

/**
 * Created by belasri on 31/08/2017.
 */

public class Message {
    private String message,name,time;
    public Message(){

    }
    public Message(String message,String name) {
        this.message = message;
        this.name = name;
    }
    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getMessage() {
        return message;
    }

    public void setMessage(String message) {
        this.message = message;
    }

    public String getTime() {
        return time;
    }

    public void setTime(String time) {
        this.time = time;
    }
}

                            

4- الملف MainActivity.java

فالمجلد java كاين الملف MainActivity.java  فيه الكود لي كيمكن باش ن référencer la table منين غادي نجبد الرسائل  ولي هي messages من بعد كنسترجع ال RecyclerView  من الملف activity_main.xml ومنبعد كنتحقق واش المستخدم لي فتح التطبيق مكونيكطي يلا مكانش كنوجهو للملف الخاص بالكونيكسيون من بعد كنخدم ب FirebaseRecyclerAdapter لي كيمكنا باش نزيدو المعلومات لي استرجعنا ف RecyclerView  فكنعطيه ل class Message و لملف chat_item.xml ول  class MessageViewHolder لي غادي تمكني باش نmodifier المعلومات لي فال TextViews منبعد مكنسترجعهم وكنعطيه ايضا référence لقاعدة البيانات ثم كاين ل fonction sendMsg لي كتمكنا من إضافة رسالة رسلها المستخدم لقاعدة البيانات من بعد مكنسترجع الميساج من ل editText ول id ديال المستخدم لي مكونيكطي والتوقيت  ثم كاين onOptionsItemSelected  لي كنخدم بها ل Menu فيلا ضغط المستخدم على déconnexion كيديكونيكطا الكود ديال الملف هو: 

                                    package com.example.belasri.firebasechatapp;

import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.text.TextUtils;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.inputmethod.InputMethodManager;
import android.widget.EditText;
import android.widget.TextView;

import com.firebase.ui.database.FirebaseRecyclerAdapter;
import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.FirebaseAuth;
import com.google.firebase.auth.FirebaseUser;
import com.google.firebase.database.DataSnapshot;
import com.google.firebase.database.DatabaseError;
import com.google.firebase.database.DatabaseReference;
import com.google.firebase.database.FirebaseDatabase;
import com.google.firebase.database.ValueEventListener;

import java.util.Calendar;
import java.util.Locale;

import static com.example.belasri.firebasechatapp.R.id.listMsg;
import static com.example.belasri.firebasechatapp.R.id.msg;

public class MainActivity extends AppCompatActivity {
    private EditText  msgEdit;
    private DatabaseReference database;
    private RecyclerView recyclerView;
    private FirebaseAuth auth;
    private FirebaseAuth.AuthStateListener authStateListener;
    private FirebaseUser user;
    private DatabaseReference userDb;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        msgEdit = (EditText) findViewById(msg);
        database  = FirebaseDatabase.getInstance().getReference().child("messages");
        recyclerView = (RecyclerView) findViewById(R.id.listMsg);
        recyclerView.setHasFixedSize(true);
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
        linearLayoutManager.setStackFromEnd(true);
        recyclerView.setLayoutManager(linearLayoutManager);
        userDb = FirebaseDatabase.getInstance().getReference().child("users");
        auth = FirebaseAuth.getInstance();
        authStateListener = new FirebaseAuth.AuthStateListener() {
            @Override
            public void onAuthStateChanged(@NonNull FirebaseAuth firebaseAuth) {
                if(firebaseAuth.getCurrentUser() == null){
                    Intent registerIntent = new Intent(MainActivity.this,LoginActivity.class);
                    //prevent user from returning back
                    registerIntent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK);
                    startActivity(registerIntent);
                }
            }
        };
    }

    @Override
    protected void onStart() {
        auth.addAuthStateListener(authStateListener);
        super.onStart();
        FirebaseRecyclerAdapter<Message,MessageViewHolder> firebaseRecyclerAdapter = new FirebaseRecyclerAdapter<Message, MessageViewHolder>(
                Message.class,
                R.layout.chat_item,
                MessageViewHolder.class,
                database
        ) {
            @Override
            protected void populateViewHolder(MessageViewHolder viewHolder, Message model, int position) {
                viewHolder.setMessage(model.getMessage());
                viewHolder.setName(model.getName());
                viewHolder.setTime(model.getTime());
            }
        };
        recyclerView.setAdapter(firebaseRecyclerAdapter);
    }

    public void sendMsg(View view){
        final String message = msgEdit.getText().toString().trim();
        user = auth.getCurrentUser();
        Calendar calendar = Calendar.getInstance(Locale.getDefault());
        final int hour = calendar.get(Calendar.HOUR_OF_DAY);
        final int minute = calendar.get(Calendar.MINUTE);
        if(!TextUtils.isEmpty(message)){
            final DatabaseReference newMsg = database.push();
            userDb.addValueEventListener(new ValueEventListener() {
                @Override
                public void onDataChange(DataSnapshot dataSnapshot) {
                    newMsg.child("message").setValue(message);
                    newMsg.child("time").setValue(hour+ ":" +minute);
                    newMsg.child("name").setValue(dataSnapshot.child(user.getUid()).child("name").getValue()).addOnCompleteListener(new OnCompleteListener<Void>() {
                        @Override
                        public void onComplete(@NonNull Task<Void> task) {
                            msgEdit.setText("");
                            View context = MainActivity.this.getCurrentFocus();
                            if (context != null) {
                                InputMethodManager imm = (InputMethodManager)getSystemService(Context.INPUT_METHOD_SERVICE);
                                imm.hideSoftInputFromWindow(context.getWindowToken(), 0);
                            }
                        }
                    });
                }

                @Override
                public void onCancelled(DatabaseError databaseError) {

                }
            });
            recyclerView.scrollToPosition(recyclerView.getAdapter().getItemCount());
        }
    }
    public static class MessageViewHolder extends RecyclerView.ViewHolder{
        View view;
        public MessageViewHolder(View itemView) {
            super(itemView);
            view = itemView;
        }
        public void setMessage(String msg){
            TextView msgText = (TextView) view.findViewById(R.id.messageText);
            msgText.setText(msg);
        }
        public void setName(String name){
            TextView nameText = (TextView) view.findViewById(R.id.name);
            nameText.setText(name);
        }
        public void setTime(String time){
            TextView nameText = (TextView) view.findViewById(R.id.timeText);
            nameText.setText(time);
        }
    }
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_item, menu);
        return true;
    }
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if(id == R.id.logout){
            auth.signOut();
        }
        return super.onOptionsItemSelected(item);
    }
}

                                


إشترك في قناتنا على اليوتيوب

بحث في الموقع


إشترك للتوصل بالجديد