كيفية عرض الطلبات التي قام بها المستخدم داخل Recyclerview في الاندرويد ستوديو #10

Ahmed Mahmoud

اخر تحديث :

كيفية عرض الطلبات التي قام بها المستخدم داخل Recyclerview في الاندرويد ستوديو

متابعي موقع ومدونه جي كودرس gee coders السلام عليكم ورحمه الله وبركاته استكمالا للدروس السابقه ولي تطبيق المندوب و المستخدم أو تطبيق الطلبات سوف نتعرف بأذن الله تعالى في هذه المقال على كيفية عرض الطلبات التي يقوم بها المستخدم على شكل ريسايكل فيو Recycler view حيث قمنا ا بتقديم لكم شروحات حول Recycler view وتعرفنا ماهي وماهي فائدتها و قمنا بشرحها لكم بالطريقه العاديه و بطريقه الداتا بيندنج ولكن فى هذا المقال انا سوف استخدم طريقه الداتا بيندنج لتسهيل العمليه بشكل كبير ولكن ان لم تشاهد المقالات السابقة في الفايربيز فلن تتمكن من معرفة ما ما يدور في هذه الحلقة وقد يحدث لديك مشاكل كثير لذلك ارجو من مشاهده باقي المقالات السابقة لتتعرف على الصفحات والافكار التي قمنا بها سابقا

طريقة عمل Recyclerview لعرض الطلبات

اولا قم بإنشاء cardView لكي نعمل منة recyclerview عن طريق إنشاء ملف xml ووضع بداخلة CircularRevealCardView ويمكنك إنشاءة بدون الحاجة للمكتبة فقط إستخدم الماتريال ديزين والتي قد سبق وان شرحناها من قبل ووضع بداخلها نصين واحد بإسم المنتج والاخر بالتاريخ كما بالصورة .

الكود الموجود بالصورة

  <com.google.android.material.circularreveal.cardview.CircularRevealCardView
android:layout_width="match_parent"
android:elevation="@dimen/_2sdp"
android:layout_margin="@dimen/_10sdp"
app:cardCornerRadius="@dimen/_10sdp"
android:layout_height="wrap_content">

        <LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">

            <TextView
android:id="@+id/order_card"
android:textStyle="bold"
android:text="Order Description"
android:padding="@dimen/_10sdp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="@dimen/_15ssp" />

            <TextView
android:id="@+id/data_card"
android:text="20/1/2021"
android:padding="@dimen/_10sdp"
android:layout_gravity="end"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
        </LinearLayout>
</com.google.android.material.circularreveal.cardview.CircularRevealCardView>

ارجع الى ملف TalabatActivity والتي قمنا بإنشاءة سابقات واسفل recyclerview اضف الكود التالي tools:listitem="@layout/card_order" وهو اظهار التصميم الذي تم تنفيذة داخل layout card order

الخطوة التالية هي إنشاء Adptor لكي يتم فية عرض البيانات التي قام المستخدم بإدخالها , قم بإنشاء كلاس بإسم AdptorOrder او اي اسم اخر تريدة وهنا استخدم databinding .

اقرء المزيد

انشاء صفحة لاضافة طلبات make order بإستخدام "فايربيز" ( أندرويد ستوديو )

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

كيفية انشاء صفحة لتحديث بيانات المستخدم داخل برنامج الاندرويد ستوديو

خطوات انشاء Adptor بإسخدام Databinding .

الخطو الاولى :

وهي اسفل public class AdptorOrder قم بتعريف context وعمل List وبداخلها اسم class المسؤول عن نقل البيانات وقد سبق وان قمنا بإنشاءة في المقالة السابقة وكان بإسم OrderData .

الخطوة الثانية :

قم بعمل عن طريق النقر كلك يمين اسفل التعريفات السابقة وإختيار امر generate ومنه اختر constructor وحدد المتغيرات التي بداخلة وانقر على موافق .

الخطوة الثالثة :

قم بكتابة class Holder او يمكنك كتابة اي اسم اخر غير holder وهنا انا كتبت OrderViewHHolder واجعلة يرث من RecyclerView عن طريق كتابة extends RecyclerView.ViewHolder بعدة ستشاهد ظهور ايرور قم بالضغط على alt + enter وقم بكتابة اسفل مباشرة اسم الاكتفتي التي تحتوي على الكارد فيو واسفل public OrderViewHHolder قم بكتابة بين الاقواس الاسم الذي كتبتة فوقها , والان اسفلها اكتب super كما بالصورة وايضا this كما بالصورة .

الخطوة الرابعة :

ارجع الى الاعلى وبعد اسم الكلاس اكتب RecyclerView.Adapter<> وبين العلامات السابقة اكتب اسم الكلاس الذي انت فية . اسم holder الذي قمت بإنشاءة في الخطوة الثالثة سوف تشاهد ظهور ايرور قم بالنقر على alt + enter واختيار implement methods واختيار كل ما بداخلها .

الخطوة الخامسة :

داخل ميثود getItemCount اكتب اسم list الذي سميتة في الخطوة الاولى وبعدها .size() لكي يرجع لك حجمها .

الخطوة السادسة :

داخل onCreateViewHolder اكتب الكود الموجود بالصورة مع تغيير card_order وهي اسم xml للكارد الفيو الذي قمت بإنشاءة كما تعلمنا في اول المقالة .

الخطوة السابعة :

اعلم ان الموضوع يبدو صعب ولكن يجب ان تفهم الخطوات جيدا لانك سوف تستخدمها بكثرة , في هذا الجزء لم استخدم databinding تقريبا سوى في التسميات اولا تقوم بتعريف اسم class المسؤول على نقل البيانات والذي انشأناة في المقالة السابقة وتسميتة بأي اسم وبعدها ربطة بي orderDatalist والخاص بي List التي تم إنشائها في اول خطوة , بعدها اكمل التعريف كما بالصورة واسفلها اكتب holder . binding اذا كنت تستخدم داتا بيندنج في تطبيقك وبعدها . وهنا تكتب id الذي بالعنصر الذي تريد حفظ البيانات بداخلة واكمل باقي التعريف (orderData) غيرها بالاسم الذي سوف تطلقة على OrderData .

الكود الموجود بالصورة

public class AdptorOrder extends RecyclerView.Adapter<AdptorOrder.OrderViewHHolder> {
    Context context;
    List<OrderData> orderDatalist;

    public AdptorOrder(Context context, List<OrderData> orderData) {
        this.context = context;
        this.orderDatalist = orderData;
    }

    @NonNull
    @Override
    public OrderViewHHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {

return new OrderViewHHolder(DataBindingUtil.inflate(LayoutInflater.from(context), R.layout.card_order, parent, false));
    }

    @Override
    public void onBindViewHolder(@NonNull OrderViewHHolder holder, int position) {

        OrderData orderData = orderDatalist.get(position);
        holder.binding.orderCard.setText(orderData.getDescripation());
        holder.binding.dataCard.setText(orderData.getData());

    }

    @Override
    public int getItemCount() {
        return orderDatalist.size();
    }

    class OrderViewHHolder extends RecyclerView.ViewHolder {
        CardOrderBinding binding;
        public OrderViewHHolder(@NonNull CardOrderBinding binding) {
            super(binding.getRoot());
            this.binding = binding;

        }

    }

}

الان ارجع الى TalabatActivity (اكتفتي عرض الطلبات)

واضف AdptorOrder وقم بإطلاق علية اي اسم تريدة , قم بتعريف RecyclarView وعمل لها setLayoutManager كما بالصورة اسفل onCreate , وخارج forloop قم بإضافة adptorOrder وتعريفة واسفل مباشرة عمل setAdapter للـ RecyclarView وقم بعمل Run للتطبيق سوف تشاهد انة عندما تقوم بعمل اي طلب جديد يقوم بتكرار كل الطلبات السابقة ولحل هذة المشكلة قبل for قم بعمل clear للـ orderDatalist التي انشأناها في المقالة السابقة .

الاكواد التي تمت إضافتها مكتوبة باللون الاحمر

طريقة اخرى لعرض البيانات وهي انك تقوم بلصق الاكواد التي كانت خارج for الى onCreat وعمل خارج الفور لوب notifyDataSetChanged للادبتر لكي نخبرة انة حدث تغيير .

الاكواد التي تمت إضافتها مكتوبة باللون الاحمر