Android 中的 Material Design 分页指南

Question

我有一个包含超过 200 行数据的 RecycleView，我想实现分页机制。

使用 Material Design 最佳实践来实现这一点的正确方法是什么？谷歌似乎忘记了这个重要因素。

你能指导我一些代码或设计的例子吗？

Answer 1

您可以从 Google 的“Data Tables”中获取一些分页材料设计指南：

下面是对应的xml分页布局：

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

<LinearLayout
  xmlns:android = "http://schemas.android.com/apk/res/android"
  xmlns:app = "http://schemas.android.com/apk/res-auto"
  xmlns:tools = "http://schemas.android.com/tools"
  android:layout_width = "match_parent"
  android:layout_height = "56dp"
  android:background = "@color/white"
  android:gravity = "center_vertical|end"
  android:orientation = "vertical">

  <LinearLayout
    android:layout_width = "match_parent"
    android:layout_height = "match_parent"
    android:layout_marginBottom = "1dp"
    android:gravity = "center_vertical|end"
    android:orientation = "horizontal">

    <TextView
      android:layout_width = "wrap_content"
      android:layout_height = "wrap_content"
      android:layout_marginEnd = "40dp"
      android:text = "@string/rows_per_page"
      android:textColor = "@color/discreet_dark"
      android:textSize = "12sp"/>

    <TextView
      android:id = "@+id/paginationSize"
      android:layout_width = "24dp"
      android:layout_height = "wrap_content"
      android:text = "50"
      android:textAlignment = "textEnd"
      android:textColor = "@color/discreet_dark"
      android:textSize = "12sp"/>

    <ImageView
      android:id = "@+id/paginationDropdown"
      android:layout_width = "24dp"
      android:layout_height = "24dp"
      android:layout_marginEnd = "32dp"
      android:contentDescription = "@string/dropdown"
      app:srcCompat = "@drawable/dropdown_discreet_dark"
      tools:src = "@drawable/dropdown_discreet_dark"/>

    <TextView
      android:id = "@+id/paginationDisplayed"
      android:layout_width = "wrap_content"
      android:layout_height = "wrap_content"
      android:layout_marginEnd = "32dp"
      android:text = "1-50 из 100"
      android:textAlignment = "textEnd"
      android:textColor = "@color/discreet_dark"
      android:textSize = "12sp"/>

    <ImageView
      android:id = "@+id/paginationPrevious"
      android:layout_width = "24dp"
      android:layout_height = "24dp"
      android:layout_marginEnd = "24dp"
      android:contentDescription = "@string/pagination_previous"
      app:srcCompat = "@drawable/pagination_previous_discreet_dark"
      tools:src = "@drawable/pagination_previous_discreet_dark"/>

    <ImageView
      android:id = "@+id/paginationNext"
      android:layout_width = "24dp"
      android:layout_height = "24dp"
      android:layout_marginEnd = "14dp"
      android:contentDescription = "@string/pagination_next"
      app:srcCompat = "@drawable/pagination_next_discreet_dark"
      tools:src = "@drawable/pagination_next_discreet_dark"/>

  </LinearLayout>

  <View
    android:layout_width = "match_parent"
    android:layout_height = "1dp"
    android:layout_gravity = "bottom"
    android:layout_marginBottom="1dp"
    android:background = "@color/discreet_dark"/>

</LinearLayout>