Android Recycler View + 流式布局实现步骤

2023-07-23 16:22:25

Android RecyclerView 流式布局：打造美观且灵活的标签布局

了解 RecyclerView 的运作机制

Android RecyclerView 是一款高效的列表视图，它利用“视图回收”技术优化性能。这意味着当一个视图滚动出屏幕时，它不会被销毁，而是被回收并储存起来，以供将来重新使用。此举可减少创建和销毁视图的开销，从而提升性能。

添加流式布局依赖

要在应用中实现流式布局，我们需要添加一个依赖项：

implementation 'com.google.android.flexbox:flexbox:2.0.1'

在布局文件中使用流式布局

接下来，在布局文件中使用流式布局：

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />

LinearLayoutManager 是一款简单的布局管理器，它将项目排列成垂直或水平的列表。

自定义 RecyclerView 适配器

为了将数据与 RecyclerView 中的视图关联，我们需要自定义一个适配器：

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {

    private List<String> data;

    public MyAdapter(List<String> data) {
        this.data = data;
    }

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

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        holder.textView.setText(data.get(position));
    }

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

    public static class ViewHolder extends RecyclerView.ViewHolder {

        private TextView textView;

        public ViewHolder(View view) {
            super(view);
            textView = view.findViewById(R.id.textView);
        }
    }
}

适配器 MyAdapter 继承自 RecyclerView.Adapter<MyAdapter.ViewHolder>，其中 ViewHolder 是一个内部类，代表 RecyclerView 中的单个视图。

在 RecyclerView 中使用自定义适配器

将自定义适配器与 RecyclerView 关联：

RecyclerView recyclerView = findViewById(R.id.recyclerView);
recyclerView.setAdapter(new MyAdapter(data));

这样，RecyclerView 便可显示数据了。

代码示例

以下是完整代码示例：

MainActivity.java：

public class MainActivity extends AppCompatActivity {

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

        RecyclerView recyclerView = findViewById(R.id.recyclerView);
        List<String> data = new ArrayList<>();
        data.add("Item 1");
        data.add("Item 2");
        data.add("Item 3");
        data.add("Item 4");
        data.add("Item 5");

        recyclerView.setAdapter(new MyAdapter(data));
    }
}

item_layout.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TextView" />
</LinearLayout>

activity_main.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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" />
</LinearLayout>