Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Android

วิธีใช้ RecyclerView ร่วมกับฐานข้อมูล SQLite ใน Android


ภาพรวม

ตัวอย่างนี้สาธิตการใช้ RecyclerView ร่วมกับฐานข้อมูล SQLite (Room/SQLiteOpenHelper) พร้อมฟังก์ชัน CRUD (Create, Read, Update, Delete) และการค้นหา/กรองข้อมูล

ขั้นตอนที่ 1: สร้างโปรเจกต์ใหม่

เปิด Android Studio ไปที่ File → New Project แล้วกรอกข้อมูลที่จำเป็น

ขั้นตอนที่ 2: เพิ่ม Dependency

dependencies {
    implementation "androidx.recyclerview:recyclerview:1.3.2"
    implementation "androidx.cardview:cardview:1.0.0"
    implementation "com.google.android.material:material:1.11.0"
}

ขั้นตอนที่ 3: Layout หลัก (res/layout/activity_main.xml)

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="4dp"
    tools:context=".MainActivity">
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/myContactList"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="50dp"
        android:paddingBottom="8dp" />
    <Button
        android:id="@+id/btnAdd"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_marginEnd="16dp"
        android:layout_marginBottom="4dp"
        android:padding="12dp"
        android:text="ADD" />
</FrameLayout>

ขั้นตอนที่ 4: Layout เพิ่ม/แก้ไข Contact (res/layout/add_contacts.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">
    <EditText
        android:id="@+id/enterName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Enter Name"
        android:inputType="text"
        android:maxLines="1"
        android:padding="12dp"
        android:textSize="16sp" />
    <EditText
        android:id="@+id/enterPhoneNum"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:hint="Enter Number"
        android:inputType="phone"
        android:maxLines="1"
        android:padding="12dp"
        android:textSize="16sp" />
</LinearLayout>

ขั้นตอนที่ 5: Layout รายการ Contact (res/layout/contact_list_layout.xml)

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="https://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="1dp"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:padding="12dp">
        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1">
            <TextView
                android:id="@+id/contactName"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="16sp"
                android:textStyle="bold" />
            <TextView
                android:id="@+id/phoneNum"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/contactName"
                android:textSize="14sp"
                android:textColor="#666" />
        </RelativeLayout>
        <ImageView
            android:id="@+id/editContact"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:layout_gravity="center_vertical"
            android:src="@android:drawable/ic_menu_edit"
            android:contentDescription="Edit" />
        <ImageView
            android:id="@+id/deleteContact"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:layout_gravity="center_vertical"
            android:layout_marginStart="16dp"
            android:src="@android:drawable/ic_delete"
            android:contentDescription="Delete" />
    </LinearLayout>
</androidx.cardview.widget.CardView>

ขั้นตอนที่ 6: Model Class (Contacts.java)

package com.app.sample;

public class Contacts {
    private int id;
    private String name;
    private String phoneNumber;

    public Contacts(String name, String phno) {
        this.name = name;
        this.phoneNumber = phno;
    }

    public Contacts(int id, String name, String phno) {
        this.id = id;
        this.name = name;
        this.phoneNumber = phno;
    }

    public int getId() { return id; }
    public void setId(int id) { this.id = id; }
    public String getName() { return name; }
    public void setName(String name) { this.name = name; }
    public String getPhno() { return phoneNumber; }
    public void setPhno(String phno) { this.phoneNumber = phno; }
}

ขั้นตอนที่ 7: ViewHolder (ContactViewHolder.java)

package com.app.sample;

import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.recyclerview.widget.RecyclerView;

class ContactViewHolder extends RecyclerView.ViewHolder {
    TextView tvName, tvPhoneNum;
    ImageView deleteContact, editContact;

    ContactViewHolder(View itemView) {
        super(itemView);
        tvName = itemView.findViewById(R.id.contactName);
        tvPhoneNum = itemView.findViewById(R.id.phoneNum);
        deleteContact = itemView.findViewById(R.id.deleteContact);
        editContact = itemView.findViewById(R.id.editContact);
    }
}

ขั้นตอนที่ 8: Database Helper (SqliteDatabase.java)

package com.app.sample;

import android.content.ContentValues;
import android.content.Context;
import android.database.Cursor;
import android.database.sqlite.SQLiteDatabase;
import android.database.sqlite.SQLiteOpenHelper;
import java.util.ArrayList;

public class SqliteDatabase extends SQLiteOpenHelper {
    private static final int DATABASE_VERSION = 1;
    private static final String DATABASE_NAME = "ContactsDB";
    private static final String TABLE_CONTACTS = "contacts";
    private static final String COLUMN_ID = "_id";
    private static final String COLUMN_NAME = "name";
    private static final String COLUMN_NO = "phone_number";

    SqliteDatabase(Context context) {
        super(context, DATABASE_NAME, null, DATABASE_VERSION);
    }

    @Override
    public void onCreate(SQLiteDatabase db) {
        String CREATE_CONTACTS_TABLE = "CREATE TABLE " + TABLE_CONTACTS + "("
                + COLUMN_ID + " INTEGER PRIMARY KEY AUTOINCREMENT,"
                + COLUMN_NAME + " TEXT,"
                + COLUMN_NO + " TEXT" + ")";
        db.execSQL(CREATE_CONTACTS_TABLE);
    }

    @Override
    public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {
        db.execSQL("DROP TABLE IF EXISTS " + TABLE_CONTACTS);
        onCreate(db);
    }

    ArrayList<Contacts> listContacts() {
        ArrayList<Contacts> storeContacts = new ArrayList<>();
        SQLiteDatabase db = this.getReadableDatabase();
        Cursor cursor = db.rawQuery("SELECT * FROM " + TABLE_CONTACTS, null);
        
        if (cursor.moveToFirst()) {
            do {
                int id = cursor.getInt(cursor.getColumnIndexOrThrow(COLUMN_ID));
                String name = cursor.getString(cursor.getColumnIndexOrThrow(COLUMN_NAME));
                String phno = cursor.getString(cursor.getColumnIndexOrThrow(COLUMN_NO));
                storeContacts.add(new Contacts(id, name, phno));
            } while (cursor.moveToNext());
        }
        cursor.close();
        return storeContacts;
    }

    void addContacts(Contacts contacts) {
        SQLiteDatabase db = this.getWritableDatabase();
        ContentValues values = new ContentValues();
        values.put(COLUMN_NAME, contacts.getName());
        values.put(COLUMN_NO, contacts.getPhno());
        db.insert(TABLE_CONTACTS, null, values);
    }

    void updateContacts(Contacts contacts) {
        SQLiteDatabase db = this.getWritableDatabase();
        ContentValues values = new ContentValues();
        values.put(COLUMN_NAME, contacts.getName());
        values.put(COLUMN_NO, contacts.getPhno());
        db.update(TABLE_CONTACTS, values, COLUMN_ID + " = ?", 
                  new String[]{String.valueOf(contacts.getId())});
    }

    void deleteContact(int id) {
        SQLiteDatabase db = this.getWritableDatabase();
        db.delete(TABLE_CONTACTS, COLUMN_ID + " = ?", 
                  new String[]{String.valueOf(id)});
    }
}

ขั้นตอนที่ 9: Adapter พร้อม Filter (ContactAdapter.java)

package com.app.sample;

import android.app.Activity;
import android.content.Context;
import android.content.DialogInterface;
import android.text.TextUtils;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.EditText;
import android.widget.Filter;
import android.widget.Filterable;
import android.widget.Toast;
import androidx.appcompat.app.AlertDialog;
import androidx.recyclerview.widget.RecyclerView;
import java.util.ArrayList;
import java.util.Objects;

class ContactAdapter extends RecyclerView.Adapter<ContactViewHolder> implements Filterable {
    private Context context;
    private ArrayList<Contacts> listContacts;
    private ArrayList<Contacts> mArrayList;
    private SqliteDatabase mDatabase;

    ContactAdapter(Context context, ArrayList<Contacts> listContacts) {
        this.context = context;
        this.listContacts = listContacts;
        this.mArrayList = new ArrayList<>(listContacts);
        mDatabase = new SqliteDatabase(context);
    }

    @Override
    public ContactViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.contact_list_layout, parent, false);
        return new ContactViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ContactViewHolder holder, int position) {
        final Contacts contacts = listContacts.get(position);
        holder.tvName.setText(contacts.getName());
        holder.tvPhoneNum.setText(contacts.getPhno());

        holder.editContact.setOnClickListener(v -> editTaskDialog(contacts));
        
        holder.deleteContact.setOnClickListener(v -> {
            mDatabase.deleteContact(contacts.getId());
            ((Activity) context).recreate(); // Refresh แบบง่ายกว่า finish/startActivity
        });
    }

    @Override
    public Filter getFilter() {
        return new Filter() {
            @Override
            protected FilterResults performFiltering(CharSequence charSequence) {
                String charString = charSequence.toString();
                ArrayList<Contacts> filteredList = new ArrayList<>();
                
                if (charString.isEmpty()) {
                    filteredList.addAll(mArrayList);
                } else {
                    for (Contacts contacts : mArrayList) {
                        if (contacts.getName().toLowerCase().contains(charString.toLowerCase())) {
                            filteredList.add(contacts);
                        }
                    }
                }
                
                FilterResults filterResults = new FilterResults();
                filterResults.values = filteredList;
                return filterResults;
            }

            @Override
            protected void publishResults(CharSequence charSequence, FilterResults filterResults) {
                listContacts.clear();
                listContacts.addAll((ArrayList<Contacts>) filterResults.values);
                notifyDataSetChanged();
            }
        };
    }

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

    private void editTaskDialog(final Contacts contacts) {
        LayoutInflater inflater = LayoutInflater.from(context);
        View subView = inflater.inflate(R.layout.add_contacts, null);
        final EditText nameField = subView.findViewById(R.id.enterName);
        final EditText contactField = subView.findViewById(R.id.enterPhoneNum);
        
        if (contacts != null) {
            nameField.setText(contacts.getName());
            contactField.setText(contacts.getPhno());
        }

        AlertDialog.Builder builder = new AlertDialog.Builder(context);
        builder.setTitle("Edit Contact");
        builder.setView(subView);
        
        builder.setPositiveButton("UPDATE", (dialog, which) -> {
            String name = nameField.getText().toString().trim();
            String ph_no = contactField.getText().toString().trim();
            
            if (TextUtils.isEmpty(name)) {
                Toast.makeText(context, "Name cannot be empty", Toast.LENGTH_SHORT).show();
            } else {
                mDatabase.updateContacts(new Contacts(contacts.getId(), name, ph_no));
                ((Activity) context).recreate();
            }
        });
        
        builder.setNegativeButton("CANCEL", (dialog, which) -> 
            Toast.makeText(context, "Cancelled", Toast.LENGTH_SHORT).show());
        
        builder.show();
    }
}

ขั้นตอนที่ 10: MainActivity (src/MainActivity.java)

package com.app.sample;

import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import android.content.DialogInterface;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {
    private SqliteDatabase mDatabase;
    private ContactAdapter mAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        RecyclerView contactView = findViewById(R.id.myContactList);
        contactView.setLayoutManager(new LinearLayoutManager(this));
        contactView.setHasFixedSize(true);
        
        mDatabase = new SqliteDatabase(this);
        loadContacts();
        
        Button btnAdd = findViewById(R.id.btnAdd);
        btnAdd.setOnClickListener(v -> addTaskDialog());
    }

    private void loadContacts() {
        ArrayList<Contacts> allContacts = mDatabase.listContacts();
        RecyclerView contactView = findViewById(R.id.myContactList);
        
        if (allContacts.size() > 0) {
            contactView.setVisibility(View.VISIBLE);
            mAdapter = new ContactAdapter(this, allContacts);
            contactView.setAdapter(mAdapter);
        } else {
            contactView.setVisibility(View.GONE);
            Toast.makeText(this, "No contacts yet. Tap ADD to start.", Toast.LENGTH_LONG).show();
        }
    }

    private void addTaskDialog() {
        LayoutInflater inflater = LayoutInflater.from(this);
        View subView = inflater.inflate(R.layout.add_contacts, null);
        final EditText nameField = subView.findViewById(R.id.enterName);
        final EditText noField = subView.findViewById(R.id.enterPhoneNum);

        AlertDialog.Builder builder = new AlertDialog.Builder(this);
        builder.setTitle("Add New Contact");
        builder.setView(subView);
        
        builder.setPositiveButton("ADD", (dialog, which) -> {
            String name = nameField.getText().toString().trim();
            String ph_no = noField.getText().toString().trim();
            
            if (TextUtils.isEmpty(name)) {
                Toast.makeText(this, "Name cannot be empty", Toast.LENGTH_SHORT).show();
            } else {
                mDatabase.addContacts(new Contacts(name, ph_no));
                loadContacts(); // Refresh list
            }
        });
        
        builder.setNegativeButton("CANCEL", null);
        builder.show();
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        if (mDatabase != null) {
            mDatabase.close();
        }
    }
}

ขั้นตอนที่ 11: Manifest (androidManifest.xml)

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android" package="app.com.sample">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

ข้อเสนอแนะ: ใช้ Room Database แทน

สำหรับโปรเจกต์จริง แนะนำให้ใช้ Room Persistence Library แทน SQLiteOpenHelper โดยตรง:

  • Compile-time verification ของ SQL queries
  • RxJava/Flow/LiveData support
  • Migration system ที่ดีกว่า
  • Type-safe DAO

การทดสอบ

เชื่อมต่ออุปกรณ์ Android จริง ใน Android Studio คลิก Run - กด ADD เพื่อเพิ่ม Contact, กด Edit/Delete บนแต่ละรายการ, ลองค้นหาได้