شرح كيفية عمل recyclerview داخل الاندرويد ستوديو بسهولة تامة

 

شرح كيفية عمل recyclerview داخل الاندرويد ستوديو بسهولة 

متابعي موقعنا الاعزاء مرحبا بكم في مقالة جديدة في برنامج android studio حيث يتم استخدام هذا البرنامج لتطوير (development) وبرمجة تطبيقات الاندرويد حيث يعمل اندرويد ستوديو في بيئة xml للتصميم  ويمكن تطويرالتطبيق الخاص بك بلغة الجافا او الكوتلن وقد سبق وان قدمنا لكم اكواد برمجية لي كلاتا اللغتين ، حيث يتعد لغة الكوتلن تطوير من جوجل للجافا وتعد اللغة الرسمية لتطوير التطبيقات لدى جوجل ولكن ما يعيبها ان البرنامج يكون مساحتة كبيرة خلافا عن الجافا الذي تكون مساحتة قليلة ، ويفضل تحميل اخر نسخة من الاندرويد استديو لانها تحوي مميزات رهيبة وتسهل على المطور عملية تطوير التطبيقات .

عن الاندرويد ستوديو

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

تاريخ الاندرويد ستوديو

كانت بداية الاندرويد عام 2003 على يد آندي روبين وعدد من المبروجين الاخرين حيث تعد أندرويد استوديو ‏ منصة لكتابة و انشاء التطبيقات ( apps ) والتي تسهل على المطورين كتابة الشيفرة المصدرية لتطبيقات أندرويد سواء بلغة جافا ( java ) في بيئة ide ، كما تسمح للمطور بمعاينة الهيئة التطبيقه الخاصة على مختلف قياسات الشاشات بشكل فوري أثناء التطوير ألتطبيقات والبرامج ، وتسهّل البرمجة تطوير التطبيقات متعددة اللغات ويمكنك تنزيل المحرر من خلال الموقع الرسمي للبرنامج ويمكنك الـ بداية في البرمجة وتعلم البرمجة باستخدام لغة الجافا ويوجد دروس في موقعنا وشروحات في الجافا يمكنك الاطلاع عليها ويوجد كتاب او مجموعة كتب لتعلم كيفية الكتابة بالجافا .

طريقة اضافة مكتبة ريسايكلر فيو - recyclerview

اولا توجة الى ملف build.gradle وابحث عن dependencies { وقم بإضافة الكود التالي أسفلة مباشرة

implementation 'androidx.recyclerview:recyclerview:1.1.0'

طريقة عمل recyclerview بالاندرويد ستوديو

○ هذة الاكواد معتمدة على اكواد الكارد فيو التي قد سبق وان شرحناها ○

كود xml الخاص بالـ recyclerview 

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recler_eqtnasa"
        tools:listitem="@layout/activity_cardhekma"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

غير activity_cardhekma بإسم الكارد فيو الذي قمت بعملة

كود java

قم بتعريف الاشياء الموجود في كود الكارد فيو لديك اولا واضف عليها ما تحت //

    TextView titale;

    ImageView image;

//

PersonAdaptoreqrbas personAdapterr;
RecyclerView recyclerView;
ArrayList<Personeqtbasa> per = new ArrayList<>();

 

اسفل 

 

super.onCreate(savedInstanceState);  

 

اكتب 

        titale = findViewById(R.id.eqtbs);
        image = findViewById(R.id.image_eqtbas);

        personAdapterr = new PersonAdaptoreqrbas(per, this);
        recyclerView = findViewById(R.id.recler_eqtnasa);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        recyclerView.setAdapter(personAdapterr);

        per.add(new Personeqtbasa(""));

 

الان يمكنك تكرار الكود per.add(new Personeqtbasa("")); كما تريد وكل ما سوف تضعه في هذا الكود سوف ياتيك في الكارد بنفس الخصائص التي قمت بإنشاءة بها

اذا اردت تمرير صور او غيرها يمكنك عمل , بعد "" وكتابة R.drawable.## واستبدل ## بعنوان الصورة 

قم بتغيير النصطلحات السابقة بالمصطلحات التي قمت بتسميتها وإنشائها

الان قم بإنشاء class بإسم Personeqtbasa واكتب بداخلة ( اذا اردت تمرير صور او فيديوهات او صوتيات فجميعها تكون من نوع int )

    String titale;

    int image;

وعمل كلك يمين وعمل لهم getter and setter و Constructor

الخطوة الاخيره وهي انشاء class بإسم PersonAdaptoreqrbas واكتب مثل الموجود في الصورة

💕 الاكواد الموجودة في الصورة 💕

import android.annotation.SuppressLint;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Filter;
import android.widget.Filterable;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;


import java.util.ArrayList;
import java.util.List;

public class PersonAdaptoreqrbas extends RecyclerView.Adapter<PersonAdaptoreqrbas.Holder> implements Filterable {
    ArrayList<Personeqtbasa> personal;
    Context context;

    class Holder extends RecyclerView.ViewHolder {
        TextView titale;
        ImageView image;
        LinearLayout linearLayout;


        public Holder(@NonNull View itemView) {
            super(itemView);
            titale=itemView.findViewById(R.id.eqtbs);
            image=itemView.findViewById(R.id.image_eqtbas);
            linearLayout=itemView.findViewById(R.id.lenyereqtbs);


        }
    }

    public PersonAdaptoreqrbas(ArrayList<Personeqtbasa> pesonal, Context context) {
        this.personal = pesonal;
        this.context = context;

    }


    @NonNull
    @Override
    public Holder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(context).inflate(R.layout.activity_cardhekma,parent,false);
        return new Holder(view);
    }

    @SuppressLint("ResourceAsColor")
    @Override
    public void onBindViewHolder(@NonNull final Holder holder, final int position) {
        final Personeqtbasa person = personal.get(position);
        holder.titale.setText(person.getTitale());


        if (position %10 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.card_style_blue);
            holder.image.setImageResource(R.drawable.t_hands);
        }
        else if (position %9 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.cars_style_cyam);
            holder.image.setImageResource(R.drawable.t_love);
        }
        else if (position %8 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.card_style_ver);
            holder.image.setImageResource(R.drawable.t_bbt);
        }
        else if (position %7 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.card_style_d3d3d3);
            holder.image.setImageResource(R.drawable.t_talk);
        }
        else if (position %6 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.card_style_jook);
            holder.image.setImageResource(R.drawable.t_smiley);
        }
        else if (position %5 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.caed_style_green);
            holder.image.setImageResource(R.drawable.t_peace);
        }
        else if (position %4 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.card_style_mive);
            holder.image.setImageResource(R.drawable.t_heart);
        }
        else if (position %3 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.card_style_b3b3b3);
            holder.image.setImageResource(R.drawable.t_handshake);
        }
        else if (position %2 == 0) {
            holder.linearLayout.setBackgroundResource(R.drawable.card_style_f3f3f3);
            holder.image.setImageResource(R.drawable.t_handshake);
        }

    }

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

ادبتر لعمل صوتيات

🌹 الاكواد الموجودة في الصور 🌹

package com.example.tafaol;

import android.content.Context;
import android.graphics.Color;
import android.media.MediaPlayer;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;

import com.ohoussein.playpause.PlayPauseView;

import java.util.ArrayList;

public class PersonAdaptormusic extends RecyclerView.Adapter<PersonAdaptormusic.Holder> {
    ArrayList<Personmusic> personal;
    Context context;
    MediaPlayer mediaPlayer;
    boolean var ;


    class Holder extends RecyclerView.ViewHolder {
        TextView tital;
        PlayPauseView song;
        LinearLayout linearLayout;



        public Holder(@NonNull View itemView) {
            super(itemView);
            song=itemView.findViewById(R.id.play_pause_view);
            tital=itemView.findViewById(R.id.titale);
            linearLayout=itemView.findViewById(R.id.lenyer);
            
        }
    }

    public PersonAdaptormusic(ArrayList<Personmusic> pesonal, Context context) {
        this.personal = pesonal;
        this.context = context;
    }


    @NonNull
    @Override
    public Holder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(context).inflate(R.layout.activity_soung,parent,false);
        return new Holder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull final Holder holder, final int position) {
        final Personmusic person = personal.get(position);
        holder.tital.setText(person.getTitale());
        holder.song.setOnClickListener(new View.OnClickListener() {
        @Override

        public void onClick(View view) {

            if (var==false) {
             mediaPlayer = MediaPlayer.create(context, person.getMusical());
             mediaPlayer.start();
             holder.song.toggle();
             var=true; }

            else if (var==true){
                mediaPlayer.pause();
                holder.song.toggle();
                var=false;
            }

            mediaPlayer.setOnCompletionListener(new MediaPlayer.OnCompletionListener() {
                @Override
                public void onCompletion(MediaPlayer mediaPlayer) {
                    holder.song.toggle();
                }
            });
        }}
        );

        if (position % 2 ==0 ) {
            holder.linearLayout.setBackgroundColor(Color.WHITE);
        }

    }

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

فيديو الشرح

لمزيد من المقالات :

طريقة تغيير شكل الازرار في الاندرويد استوديو وجعلها احترافية

طريقة عمل زر مموج في الاندرويد ستوديو

شرح انشاء واجهة تسجيل دخول بسيطة بالاندرويد ستوديو

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

شرح كيفية تنسيق الصور والخطوط على جميع الاجهزة في الاندرويد ستوديو

تعديل المقال