RecyclerView এবং CardView পরিচিতি
CardView-এর জন্য RecyclerView উদাহরণে যাওয়ার আগে, আমাদের জানতে হবে অ্যান্ড্রয়েডে RecyclerView কী। RecyclerView হলো ListView-এর একটি উন্নত সংস্করণ যা ViewHolder ডিজাইন প্যাটার্নের উপর কাজ করে। RecyclerView ব্যবহার করে আমরা গ্রিড এবং আইটেমের তালিকা দেখাতে পারি।
CardView FrameLayout দ্বারা বর্ধিত এবং এটি আইটেমগুলো কার্ড রূপে দেখাতে ব্যবহৃত হয়। এটি পূর্বনির্ধারিত ট্যাগ হিসেবে রেডিয়াস এবং শ্যাডো সমর্থন করে।
এই উদাহরণটি একটি সুন্দর ছাত্র রেকর্ড অ্যাপ তৈরি করে RecyclerView-এ CardView সংহত করার পদ্ধতি প্রদর্শন করে যা ছাত্রের নাম এবং বয়স প্রদর্শন করে।
ধাপ ১: নতুন প্রজেক্ট তৈরি করুন
Android Studio-তে File → New Project-এ যান এবং একটি নতুন প্রজেক্ট তৈরি করতে সমস্ত প্রয়োজনীয় বিবরণ পূরণ করুন।
ধাপ ২: build.gradle-এ নির্ভরতা যোগ করুন
RecyclerView এবং CardView লাইব্রেরির নির্ভরতা যোগ করুন।
apply plugin: 'com.android.application'
android {
compileSdkVersion 28
defaultConfig {
applicationId "com.example.andy.tutorialspoint"
minSdkVersion 19
targetSdkVersion 28
versionCode 1
versionName "1.0"
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar'])
implementation 'com.android.support:appcompat-v7:28.0.0'
implementation 'com.android.support:design:28.0.0'
implementation 'com.android.support.constraint:constraint-layout:1.1.3'
implementation 'com.android.support:cardview-v7:28.0.0'
implementation 'com.android.support:recyclerview-v7:28.0.0'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}
ধাপ ৩: res/layout/activity_main.xml-এ কোড যোগ করুন
<?xml version = "1.0" encoding = "utf-8"?>
<RelativeLayout
xmlns:android = "https://schemas.android.com/apk/res/android"
xmlns:tools = "https://schemas.android.com/tools"
xmlns:app = "https://schemas.android.com/apk/res-auto"
android:layout_width = "match_parent"
android:layout_height = "match_parent"
app:layout_behavior = "@string/appbar_scrolling_view_behavior"
tools:showIn = "@layout/activity_main"
tools:context = ".MainActivity">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical" />
</RelativeLayout>
উপরোক্ত কোডে আমরা RecyclerView-কে RelativeLayout হিসেবে প্যারেন্ট লেআউটে উইন্ডো ম্যানেজারে যোগ করেছি।
ধাপ ৪: src/MainActivity.java-এ কোড যোগ করুন
package com.example.andy.tutorialspoint;
import android.annotation.TargetApi;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.RequiresApi;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.DividerItemDecoration;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import java.util.ArrayList;
import java.util.Collections;
import java.util.Comparator;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private StudentAdapter studentAdapter;
private List<studentData> studentDataList = new ArrayList<>();
@TargetApi(Build.VERSION_CODES.O)
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
recyclerView = findViewById(R.id.recycler_view);
studentAdapter = new StudentAdapter(studentDataList);
RecyclerView.LayoutManager manager = new GridLayoutManager(this, 2);
recyclerView.setLayoutManager(manager);
recyclerView.setAdapter(studentAdapter);
StudentDataPrepare();
}
@RequiresApi(api = Build.VERSION_CODES.N)
private void StudentDataPrepare() {
studentData data = new studentData("sai", 25);
studentDataList.add(data);
data = new studentData("sai", 25);
studentDataList.add(data);
data = new studentData("raghu", 20);
studentDataList.add(data);
data = new studentData("raj", 28);
studentDataList.add(data);
data = new studentData("amar", 15);
studentDataList.add(data);
data = new studentData("bapu", 19);
studentDataList.add(data);
data = new studentData("chandra", 52);
studentDataList.add(data);
data = new studentData("deraj", 30);
studentDataList.add(data);
data = new studentData("eshanth", 28);
studentDataList.add(data);
Collections.sort(studentDataList, new Comparator<studentData>() {
@Override
public int compare(studentData o1, studentData o2) {
return o1.name.compareTo(o2.name);
}
});
}
}
উপরোক্ত কোডে আমরা RecyclerView এবং studentAdapter যোগ করেছি। সেই student adapter-এ আমরা studentDataList কে ArrayList হিসেবে পাস করেছি। Student data list-এ ছাত্রের নাম এবং বয়স থাকে।
গ্রিড পেতে হলে GridLayoutManager ব্যবহার করতে হবে:
RecyclerView.LayoutManager manager = new GridLayoutManager(this, 2);
উপরোক্ত কোডে আমরা লেআউট ম্যানেজার হিসেবে GridLayoutManager ব্যবহার করেছি এবং সেল হিসেবে ২ যোগ করেছি। তাই এটি প্রতিটি সطرে দুটি গ্রিড সহ ফলাফল দেখাবে।
RecyclerView আইটেম তুলনা করার জন্য আমরা Collections framework এবং sort মেথড ব্যবহার করেছি:
Collections.sort(studentDataList, new Comparator<studentData>() {
@Override
public int compare(studentData o1, studentData o2) {
return o1.name.compareTo(o2.name);
}
});
উপরোক্ত কোডে আমরা নাম দিয়ে এলিমেন্টগুলো তুলনা করছি।
ধাপ ৫: src/StudentAdapter.java ফাইলের বিষয়বস্তু
package com.example.andy.tutorialspoint;
import android.graphics.Color;
import android.support.annotation.NonNull;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;
import java.util.List;
import java.util.Random;
class StudentAdapter extends RecyclerView.Adapter {
List studentDataList;
public StudentAdapter(List studentDataList) {
this.studentDataList = studentDataList;
}
@NonNull
@Override
public MyViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
View itemView = LayoutInflater.from(viewGroup.getContext())
.inflate(R.layout.student_list_row, viewGroup, false);
return new MyViewHolder(itemView);
}
@Override
public void onBindViewHolder(MyViewHolder viewHolder, int i) {
studentData data = studentDataList.get(i);
Random rnd = new Random();
int currentColor = Color.argb(255, rnd.nextInt(256), rnd.nextInt(256), rnd.nextInt(256));
viewHolder.parent.setBackgroundColor(currentColor);
viewHolder.name.setText(data.name);
viewHolder.age.setText(String.valueOf(data.age));
}
@Override
public int getItemCount() {
return studentDataList.size();
}
class MyViewHolder extends RecyclerView.ViewHolder {
TextView name, age;
LinearLayout parent;
public MyViewHolder(View itemView) {
super(itemView);
parent = itemView.findViewById(R.id.parent);
name = itemView.findViewById(R.id.name);
age = itemView.findViewById(R.id.age);
}
}
}
অ্যাডাপ্টার ক্লাসে চারটি মেথড রয়েছে:
onCreateViewHolder() :- এটি একটি ভিউ হোল্ডার তৈরি করতে ব্যবহৃত হয় এবং একটি ভিউ রিটার্ন করে।
onBindViewHolder() - এটি তৈরি করা ভিউ হোল্ডারের সাথে বাঁধা হয়।
getItemCount() - এতে লিস্টের আকার থাকে।
MyViewHolder ক্লাস- এটি RecyclerView.ViewHolder দ্বারা বর্ধিত একটি ভিউ হোল্ডার ইনার ক্লাস।
RecyclerView আইটেমের জন্য র্যান্ডম ব্যাকগ্রাউন্ড সেট করতে, আমরা Random ক্লাস ব্যবহার করে র্যান্ডম রঙ তৈরি করেছি এবং ভিউ আইটেমের প্যারেন্টে রঙ যোগ করেছি:
Random rnd = new Random(); int currentColor = Color.argb(255, rnd.nextInt(256), rnd.nextInt(256), rnd.nextInt(256)); viewHolder.parent.setBackgroundColor(currentColor);
ধাপ ৬: xml res/layout/student_list_row.xml ফাইলের সংশোধিত বিষয়বস্তু
<?xml version = "1.0" encoding = "utf-8"?>
<android.support.v7.widget.CardView xmlns:android="https://schemas.android.com/apk/res/android"
xmlns:card_view = "https://schemas.android.com/apk/res-auto"
android:layout_width = "match_parent"
card_view:cardCornerRadius = "4dp"
android:id = "@+id/card_view"
android:layout_margin = "10dp"
android:layout_height = "200dp">
<LinearLayout
android:id = "@+id/parent"
android:layout_gravity = "center"
android:layout_width = "match_parent"
android:orientation = "vertical"
android:gravity = "center"
android:layout_height="match_parent">
<TextView
android:id = "@+id/name"
android:layout_width = "wrap_content"
android:gravity = "center"
android:textSize = "25sp"
android:textColor = "#FFF"
android:layout_height = "wrap_content" />
<TextView
android:id = "@+id/age"
android:layout_width = "wrap_content"
android:gravity = "center"
android:textSize = "25sp"
android:textColor = "#FFF"
android:layout_height = "wrap_content" />
</LinearLayout>
</android.support.v7.widget.CardView>
উপরোক্ত লিস্ট আইটেম ভিউতে আমরা CardView-এর ভিতরে নাম এবং বয়সের জন্য দুটি TextView তৈরি করেছি। CardView-এ পূর্বনির্ধারিত কর্নার রেডিয়াস এবং শ্যাডো প্রোপার্টি রয়েছে। তাই আমরা CardView-এর সাথে কর্নার রেডিয়াস ব্যবহার করেছি।
ধাপ ৭: src/studentData.java ফাইলের বিষয়বস্তু
package com.example.andy.tutorialspoint;
class studentData {
String name;
int age;
public studentData(String name, int age) {
this.name = name;
this.age = age;
}
}
উপরোক্ত কোড ছাত্র ডেটা অবজেক্ট সম্পর্কে জানায়। আপনার অ্যাপ্লিকেশন চালানোর চেষ্টা করুন। আমি ধরে নিচ্ছি আপনার আসল Android মোবাইল ডিভাইস কম্পিউটারের সাথে সংযুক্ত আছে। Android Studio থেকে অ্যাপ চালাতে, আপনার প্রজেক্টের একটি এক্টিভিটি ফাইল খুলুন এবং টুলবার থেকে Run আইকনে ক্লিক করুন। আপনার মোবাইল ডিভাইস নির্বাচন করুন এবং তারপর আপনার মোবাইল ডিভাইস চেক করুন যা আপনার ডিফল্ট স্ক্রিন প্রদর্শন করবে।
এখন RecyclerView-এ নিচে স্ক্রল করুন, এটি নিচের ফলাফল দেখাবে:
