كيفية عرض معلومات المستخدم داخل صفحة الاعدادات "فاير بيز" - أندرويد ستوديو #4

Ahmed Mahmoud

اخر تحديث :

كيفية عرض معلومات المستخدم داخل صفحة الاعدادات "فاير بيز" - أندرويد ستوديو

في المقالات السابقة تعرفنا على كيفية انشاء صفحه دخول و صفحه تسجيل وكيف نجعل المستخدم يقوم بعملية التسجيل ويخزن البيانات الخاص به في الفايربيز وتحديدا في قاعدة البيانات في هذه الصفحه سنقوم بعمل اكتقني جديدة يتم فيها عرض بعض المعلومات التي نريد أن نعرضها للمستخدم مثل اسم البريد الإلكتروني ورقم الهاتف وفي المقالات القادمه سوف نتعرف على كيفيه امكانية المستخدم من تحديث البيانات بحيث انه يقوم تحديث بياناته ويضغط على تحديث البيانات يتم تحديث البيانات داخل برنامج الاندرويد استوديو وداخل قاعدة البيانات , ولكن في مقالة اليوم سوف نتعرف فقط على طريقة عرض البيانات من الفايربيز او من الفايرستور الى الاندرويد استوديو لذلك تابع المقالة وحاول التركيز جيدا .

شرح كيف يمكنك عرض بيانات المستخدم في التطبيق

اولا قم بإنشاء Activity جديد وقم بتسميتة SettingsActivity او اي اسم تريدة حيث سيتم عرض معلومات المستخدم التي حصلنا عليها في المقالة السابقة هنا , صمم هنا كل ما تريد عرضة وفي حالتي صممت صورة والبريد والاسم ورقم الهاتف وجعلت الاميل غير قابل للتعديل وزر في النهايه لتحديث البيانات اذا اراد المستخدم .

الان توجة الى كود الجافا الخاص بي SettingsActivity قم بتعريف FirebaseFirestore و FirebaseAuth كما تعلمنا سابقا وقم بكتابة عنوان method التي ترجع لك المعلومات داخل onCreate وهنا قمت بتسميتها بإسم getUserdata(); وستجد ايرور ظهر لك يخبرك بعمل ميثود لها بعدها اختار SettingsActivity لكي يقوم بإنشاء method خارج onCreat

اقرء المزيد

شرح كيفية استخدام الماتريال ديزين Material Design داخل تطبيقك في الاندرويد ستوديو

اضافة زر للعودة للصفحة السابقه وتعديل اسم toolbar داخل android studio

كيفية اضافة صور json الى تطبيقك في الاندرويد ستوديو android studio

الان داخل الميثود التي قمت بإنشائها الصق الكود التالي

 String uid = firebaseAuth.getCurrentUser().getUid();

        firestore.collection("upload UserData").document(uid).get().addOnCompleteListener(new OnCompleteListener<DocumentSnapshot>() {

            @Override

            public void onComplete(@NonNull Task<DocumentSnapshot> task) {

                if (task.isSuccessful()) {

                    UserData userData = task.getResult().toObject(UserData.class);

                    Log.i(TAG, "onComplete: " + userData.toString());

                    showuserData(userData);

                } else {

                    String errorMessage = task.getException().getLocalizedMessage();

                    Log.i(TAG, "onComplete: "+errorMessage);

                    Toast.makeText(SettingsActivity.this, errorMessage, Toast.LENGTH_SHORT).show();

                }
            }
        });

في البداية سوف نقوم بعمل string ونكتب اي اسم نريدة يرمز الى id اليوز وبعدها نقوم بتعريفه انة يذهب الى firebaseAuth ويحضر لنا id الخاص بالمستخدم وبعدها قمت بتعريف firestore واخبرتة للذهاب الى مجلد upload UserData وبعدها يفتح المستندات الخاصه بعنوان اليوزر وبعدها يحضرها حيث في هذا المكان قمنا بتخزين البيانات سابقا في المقالة السابقة وبعد ذلك قمت بعمل addOnCompleteListener وهو اختبار لنرى هل تمت العملية بنجاح ام لا اذا كانت ناجحه سوف نقوم بتعريف الكلاس UserData والذي تم انشاؤه سابقا وهو يحتوي على المتغيرات

بعدها نريد عرض النتيجة للمطور لذلك استخدمنا Logi لنرى ماهي النتيجة وبعدها قم بتعريف ميثود اخرى بإسم showuserData ويتم فيها عرض البيانات وسنرسل له userData لكي يجلب لنا البيانات من userData , سيظهر Error واتوقع انكم اصبحتم تستطيعون التعامل معه اليس كذلك ؟

قبل التعامل مع private void showuserData التي تم انشائها توجة الى كلاس بيانات اليوزر userData.class وبعدها انقر كلك يمين في اي مكان فارغ واختار Generate واختر toString بعدها حدد جميع العناصر وانقر على ok , لترى ان الكود اصبح هذا الشكل .

الان قم بإستدعاء البيانات التي تريد عرضها اذا كنت تستخدم databinding فقم بكتابة التعريف كما فعلت انا ولكن تاكد انك قمت بتعريف databinding بالاعلى وذا كنت تستخدم الطريقة العادية

email=findViewById(R.id.setting_email) ;

فقم بتعريف المتغيرات واكتب بالاسفل فقط اسمها وبعدها setText لانها نص وبين الاقواس اكتب اسم class الذي تم تخزين فيه هذة المدخلات وهو userData وبعدها . وبعدها اسم المتغير الموجود في UserData وهكذا مع باقي المتغيرات النصية ولكن في الصورة الامر يختلف قليلا حيث يتم عرض بيانات الصورة من خلال مكاتب يتم اضافتها وانا شخصيا استخدم مكتبة picasso ويمكنني من خلالها ان اقوم بعرض الصور من خلال سطر واحد , توجة الى ملف gradle واضف المكتبة التالية

implementation 'com.squareup.picasso:picasso:2.71828'

والان توجة الى الكود واكتب الكود التالي في مكان استدعاء الصورة ( اسفل settingEmail.setText )

Picasso.get().load("http://i.imgur.com/DvpvklR.png").into(imageView);

قم بتغيير الرابط الى عنوان الصورة في UserData.class عن طريق كتابة load(userData.getImageurl()) بمعنى احضر الصورة من هذا الكلاس وضعها في هذا المكان settingImage ويمكنك اضافة placeholder لعرض صورة افتراضية الى ان يتم تحميل الصورة الاصلية .

الكود الموجود داخل showuserData

        binding.settingEmail.setText(userData.getEmail());
        binding.settingName.setText(userData.getName());
        binding.settingPhone.setText(userData.getPhone());
        Picasso.get().load(userData.getImageurl()).placeholder(R.drawable.image_register).into(binding.settingImage);

        Log.i(TAG, "onComplete: ");

شكل الكود النهائي