วิธีเลื่อนไปด้านบนใน RecyclerView ด้วย LinearLayoutManager

RecyclerView คืออะไร?

RecyclerView เป็นเวอร์ชันขั้นสูงของ ListView ทำงานตามรูปแบบ View Holder แสดงรายการแบบกริดหรือลิสต์ได้ มีประสิทธิภาพดีกว่า

ตัวอย่างแอปพลิเคชันบันทึกข้อมูลนักเรียน พร้อมปุ่มเลื่อนไปด้านบน

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

ไปที่ File → New Project ใน Android Studio

ขั้นตอนที่ 2: เพิ่ม Dependencies ใน build.gradle

dependencies {
    implementation 'com.android.support:appcompat-v7:28.0.0'
    implementation 'com.android.support:design:28.0.0'
    implementation 'com.android.support:cardview-v7:28.0.0'
    implementation 'com.android.support:recyclerview-v7:28.0.0'
    // ... อื่นๆ
}

ขั้นตอนที่ 3: เพิ่มเลย์เอาต์หลักใน res/layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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"
    android:fitsSystemWindows="true"
    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="horizontal" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/top"
        app:backgroundTint="#FFFF00"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:src="@android:drawable/arrow_up_float" />
</android.support.design.widget.CoordinatorLayout>

ใช้ CoordinatorLayout เป็นเลย์เอาต์หลัก เพราะ FloatingActionButton รองรับ CoordinatorLayout ปุ่มลอยจะอยู่มุมล่างขวา คลิกเพื่อเลื่อนขึ้นบน

ขั้นตอนที่ 4: เพิ่มโค้ด Java ใน src/MainActivity.java

package com.example.andy.tutorialspoint;

import android.os.Build;
import android.os.Bundle;
import android.support.annotation.RequiresApi;
import android.support.design.widget.FloatingActionButton;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.DividerItemDecoration;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.View;
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<>();

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

        FloatingActionButton moveTop = findViewById(R.id.top);
        recyclerView = findViewById(R.id.recycler_view);
        studentAdapter = new StudentAdapter(studentDataList, this);

        RecyclerView.LayoutManager manager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(manager);
        recyclerView.setAdapter(studentAdapter);

        prepareStudentData();

        moveTop.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                recyclerView.smoothScrollToPosition(0);
            }
        });
    }

    private void prepareStudentData() {
        studentDataList.add(new StudentData("sai", 25));
        studentDataList.add(new StudentData("sai raj", 25));
        studentDataList.add(new StudentData("raghu", 20));
        studentDataList.add(new StudentData("raj", 28));
        studentDataList.add(new StudentData("amar", 15));
        studentDataList.add(new StudentData("bapu", 19));
        studentDataList.add(new StudentData("chandra", 52));
        studentDataList.add(new StudentData("deraj", 30));
        studentDataList.add(new StudentData("eshanth", 28));

        Collections.sort(studentDataList, new Comparator<StudentData>() {
            @Override
            public int compare(StudentData o1, StudentData o2) {
                return o1.name.compareTo(o2.name);
            }
        });
    }
}

ใช้ smoothScrollToPosition(0) เพื่อเลื่อนไปตำแหน่งที่ 0 (ด้านบนสุด) อย่างนุ่มนวล

ขั้นตอนที่ 5: สร้าง Adapter Class (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<StudentAdapter.MyViewHolder> {
    List<StudentData> studentDataList;

    public StudentAdapter(List<StudentData> studentDataList) {
        this.studentDataList = studentDataList;
    }

    @NonNull
    @Override
    public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.student_list_row, parent, false);
        return new MyViewHolder(itemView);
    }

    @Override
    public void onBindViewHolder(MyViewHolder holder, int position) {
        StudentData data = studentDataList.get(position);
        Random rnd = new Random();
        int color = Color.argb(255, rnd.nextInt(256), rnd.nextInt(256), rnd.nextInt(256));
        holder.parent.setBackgroundColor(color);
        holder.name.setText(data.name);
        holder.age.setText(String.valueOf(data.age));
    }

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

    static class MyViewHolder extends RecyclerView.ViewHolder {
        TextView name, age;
        LinearLayout parent;

        MyViewHolder(View itemView) {
            super(itemView);
            parent = itemView.findViewById(R.id.parent);
            name = itemView.findViewById(R.id.name);
            age = itemView.findViewById(R.id.age);
        }
    }
}

ขั้นตอนที่ 6: สร้างเลย์เอาต์รายการ (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>

ขั้นตอนที่ 7: สร้างโมเดลข้อมูล (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;
    }
}

การทดสอบ

รันแอปพลิเคชัน จะแสดงรายการนักเรียนพร้อมสีพื้นหลังสุ่ม คลิกปุ่มลอย (ลูกศรขึ้น) จะเลื่อนไปด้านบนสุดอย่างนุ่มนวล