GridLayoutManager ile RecyclerView kullanan basit Android grid örneği (eski GridView gibi)

Eski ListView ve GridView işlevlerinin yerini RecyclerView işlevinin aldığını biliyorum. Ben RecyclerView kullanarak minimal bir grid kurulumunu gösteren çok basit bir örnek arıyorum. Uzun öğretici tarzda açıklamalar değil, sadece minimal bir örnek arıyorum. Eski GridView'i taklit eden en basit ızgaranın aşağıdaki özelliklerden oluşacağını hayal ediyorum:

  • satır başına birden fazla hücre
  • her hücrede tek görünüm
  • tıklama olaylarına yanıt verir
Suragch
Edited question 2017ösp19ös15 Ocak 2017 в 3:19
Programlama
android gridview android-recyclerview gridlayoutmanager
2016ööp2öö11 Kasım 2016 в 11:02
14 görünümler
Çözüm

Kısa cevap

Liste oluşturmak için bir RecyclerView kurmak]1 konusuna zaten aşina olanlar için iyi haber, ızgara oluşturmanın büyük ölçüde aynı olmasıdır. Sadece RecyclerViewi ayarlarken LinearLayoutManager yerine bir GridLayoutManager kullanırsınız.

recyclerView.setLayoutManager(new GridLayoutManager(this, numberOfColumns));

Bundan daha fazla yardıma ihtiyacınız varsa, aşağıdaki örneğe göz atın.

Tam örnek

Aşağıda, aşağıdaki resme benzeyecek minimal bir örnek verilmiştir.

Boş bir etkinlikle başlayın. RecyclerView` ızgarasını eklemek için aşağıdaki görevleri gerçekleştireceksiniz. Tek yapmanız gereken her bölümdeki kodu kopyalayıp yapıştırmak. Daha sonra ihtiyaçlarınıza uyacak şekilde özelleştirebilirsiniz.

  • gradle'a bağımlılıklar ekleyin
  • Aktivite ve ızgara hücresi için xml düzen dosyalarını ekleyin
  • RecyclerView bağdaştırıcısını oluşturma
  • Etkinliğinizde RecyclerView'i başlatın

Gradle bağımlılıklarını güncelle

Aşağıdaki bağımlılıkların uygulamanızın gradle.build dosyasında olduğundan emin olun:

compile 'com.android.support:appcompat-v7:27.1.1'
compile 'com.android.support:recyclerview-v7:27.1.1'

Sürüm numaralarını en güncel olana güncelleyebilirsiniz.

Etkinlik düzeni oluşturun

Xml düzeninize RecyclerView öğesini ekleyin.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

Izgara hücre düzenini oluşturun

RecyclerViewızgaramızdaki her hücrede yalnızca tek birTextView` bulunacaktır. Yeni bir düzen kaynak dosyası oluşturun.

recyclerview_item.xml

<?xml version="1.0" encoding="utf-8"?>

Adaptörü oluşturun

RecyclerView`, her hücredeki görünümleri verilerinizle doldurmak için bir adaptöre ihtiyaç duyar. Yeni bir java dosyası oluşturun.

MyRecyclerViewAdapter.java

public class MyRecyclerViewAdapter extends RecyclerView.Adapter {

    private String[] mData;
    private LayoutInflater mInflater;
    private ItemClickListener mClickListener;

    // data is passed into the constructor
    MyRecyclerViewAdapter(Context context, String[] data) {
        this.mInflater = LayoutInflater.from(context);
        this.mData = data;
    }

    // inflates the cell layout from xml when needed
    @Override
    @NonNull 
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = mInflater.inflate(R.layout.recyclerview_item, parent, false);
        return new ViewHolder(view);
    }

    // binds the data to the TextView in each cell
    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
        holder.myTextView.setText(mData[position]);
    }

    // total number of cells
    @Override
    public int getItemCount() {
        return mData.length;
    }

    // stores and recycles views as they are scrolled off screen
    public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
        TextView myTextView;

        ViewHolder(View itemView) {
            super(itemView);
            myTextView = itemView.findViewById(R.id.info_text);
            itemView.setOnClickListener(this);
        }

        @Override
        public void onClick(View view) {
            if (mClickListener != null) mClickListener.onItemClick(view, getAdapterPosition());
        }
    }

    // convenience method for getting data at click position
    String getItem(int id) {
        return mData[id];
    }

    // allows clicks events to be caught
    void setClickListener(ItemClickListener itemClickListener) {
        this.mClickListener = itemClickListener;
    }

    // parent activity will implement this method to respond to click events
    public interface ItemClickListener {
        void onItemClick(View view, int position);
    }
}

Notlar

  • Kesinlikle gerekli olmasa da, hücrelerdeki tıklama olaylarını dinleme işlevini ekledim. Bu, eski `GridView'da mevcuttu ve yaygın bir ihtiyaçtır. Eğer ihtiyacınız yoksa bu kodu kaldırabilirsiniz.

RecyclerView'i Activity'de Başlatın

Aşağıdaki kodu ana etkinliğinize ekleyin.

MainActivity.java

public class MainActivity extends AppCompatActivity implements MyRecyclerViewAdapter.ItemClickListener {

    MyRecyclerViewAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // data to populate the RecyclerView with
        String[] data = {"1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48"};

        // set up the RecyclerView
        RecyclerView recyclerView = findViewById(R.id.rvNumbers);
        int numberOfColumns = 6;
        recyclerView.setLayoutManager(new GridLayoutManager(this, numberOfColumns));
        adapter = new MyRecyclerViewAdapter(this, data);
        adapter.setClickListener(this);
        recyclerView.setAdapter(adapter);
    }

    @Override
    public void onItemClick(View view, int position) {
        Log.i("TAG", "You clicked number " + adapter.getItem(position) + ", which is at cell position " + position);
    }
}

Notlar

  • Aktivitenin, adaptörümüzde tanımladığımız ItemClickListenerı uyguladığına dikkat edin. Bu, hücre tıklama olaylarını onItemClick içinde ele almamızı sağlar.

Bitti

Bu kadar. Şimdi projenizi çalıştırabilmeli ve üstteki resme benzer bir şey elde edebilmelisiniz.

Gidiyor

Yuvarlatılmış köşeler

Otomatik oturan sütunlar

Daha fazla çalışma

Suragch
Edited answer 2018ööp56öö7 Ağustos 2018 в 7:56
Yorumlar (20)

Her ne kadar Suragch'ın cevabını beğenip takdir etsem de, bir not bırakmak istiyorum çünkü Adapter (MyRecyclerViewAdapter) kodlamasını onItemClick Listener yöntemini tanımlamak ve açığa çıkarmak için kodlamanın, sınıf kapsüllemesini doğru kullanmamak nedeniyle bunu yapmanın en iyi yolu olmadığını gördüm. Bu yüzden benim önerim, Adapter'in sadece Dinleme işlemlerini gerçekleştirmesine izin vermek (amacı budur!) ve bunları Adapter'i kullanan Activity'den (MainActivity) ayırmaktır. Adapter sınıfını bu şekilde ayarlardım:

MyRecyclerViewAdapter.java

public class MyRecyclerViewAdapter extends RecyclerView.Adapter {

    private String[] mData = new String[0];
    private LayoutInflater mInflater;

    // Data is passed into the constructor
    public MyRecyclerViewAdapter(Context context, String[] data) {
        this.mInflater = LayoutInflater.from(context);
        this.mData = data;
    }

    // Inflates the cell layout from xml when needed
    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = mInflater.inflate(R.layout.recyclerview_item, parent, false);
        ViewHolder viewHolder = new ViewHolder(view);
        return viewHolder;
    }

    // Binds the data to the textview in each cell
    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        String animal = mData[position];
        holder.myTextView.setText(animal);
    }

    // Total number of cells
    @Override
    public int getItemCount() {
        return mData.length;
    }

    // Stores and recycles views as they are scrolled off screen
    public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
        public TextView myTextView;

        public ViewHolder(View itemView) {
            super(itemView);
            myTextView = (TextView) itemView.findViewById(R.id.info_text);
            itemView.setOnClickListener(this);
        }

        @Override
        public void onClick(View view) {
            onItemClick(view, getAdapterPosition());
        }
    }

    // Convenience method for getting data at click position
    public String getItem(int id) {
        return mData[id];
    }

    // Method that executes your code for the action received
    public void onItemClick(View view, int position) {
        Log.i("TAG", "You clicked number " + getItem(position).toString() + ", which is at cell position " + position);
    }
}

Lütfen artık MyRecyclerViewAdapter içinde tanımlanan onItemClick yöntemine dikkat edin; bu, alınan olay/eylem için görevlerinizi kodlamak isteyeceğiniz yerdir.

Bu dönüşümü tamamlamak için yapılması gereken sadece küçük bir değişiklik var: Activity artık MyRecyclerViewAdapter.ItemClickListener uygulamasına ihtiyaç duymuyor, çünkü artık bu tamamen Adapter tarafından yapılıyor. Bu da son değişiklik olacaktır:

MainActivity.java

public class MainActivity extends AppCompatActivity {

    MyRecyclerViewAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // data to populate the RecyclerView with
        String[] data = {"1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48"};

        // set up the RecyclerView
        RecyclerView recyclerView = (RecyclerView) findViewById(R.id.rvNumbers);
        int numberOfColumns = 6;
        recyclerView.setLayoutManager(new GridLayoutManager(this, numberOfColumns));
        adapter = new MyRecyclerViewAdapter(this, data);
        adapter.setClickListener(this);
        recyclerView.setAdapter(adapter);
    }
}
Yorumlar (3)

Recyclerview layoutmanager'ınızı Gridlayout Moduna Ayarlamanız Gerekiyor, Bunu Yapmak İçin RecyclerView LayoutManager'ınızı Ayarlamak İstediğinizde kodunuzu değiştirmeniz yeterlidir:

Not: İstediğiniz Sütun Sayınızı ###HELP## ile değiştirin

   recyclerView.setLayoutManager(new GridLayoutManager(getActivity(),###HELP##));
lczapski
Edited answer 2019ööp26öö24 Kasım 2019 в 12:26
Yorumlar (0)