Android實(shí)現(xiàn)RecyclerView嵌套流式布局的詳細(xì)過程
前言
Android開發(fā)中,列表頁面是常見需求,流式布局的標(biāo)簽效果也是常見需求,那么兩者結(jié)合的效果啥樣呢?這篇文章簡單實(shí)現(xiàn)一下。
實(shí)現(xiàn)過程
- 添加流式布局依賴,在app/build.gradle文件中添加如下代碼
implementation 'com.google.android.flexbox:flexbox:3.0.0'
- 新建Activity文件RecyclerViewActivity.class
package com.example.androidstudy; import androidx.appcompat.app.AppCompatActivity; import androidx.recyclerview.widget.LinearLayoutManager; import androidx.recyclerview.widget.RecyclerView; import android.os.Bundle; import android.widget.Toast; import com.example.androidstudy.adapter.MyRecyclerAdapter; import com.example.androidstudy.bean.TestData; import java.util.ArrayList; import java.util.List; public class RecyclerViewActivity extends AppCompatActivity { private RecyclerView recyclerView; private MyRecyclerAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_recycler_view); initViews(); initListener(); } private void initListener() { adapter.setItemCellClicker(tag -> Toast.makeText(RecyclerViewActivity.this, tag, Toast.LENGTH_SHORT).show()); } private void initViews() { recyclerView = findViewById(R.id.recyclerview); // 設(shè)置布局管理器 recyclerView.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false)); List<String> sss = new ArrayList<>(); sss.add("重型卡車1"); sss.add("重車11"); sss.add("重型卡車3445"); sss.add("重型卡車6677"); List<String> sss1 = new ArrayList<>(); sss1.add("輕型卡車1"); sss1.add("輕車11"); sss1.add("輕型卡車3445"); sss1.add("輕型卡車6677"); List<String> sss2 = new ArrayList<>(); sss2.add("其他1"); sss2.add("其他2"); List<TestData> list = new ArrayList<>(); list.add(new TestData("重型",sss)); list.add(new TestData("輕型", sss1)); list.add(new TestData("其他", sss2)); // 實(shí)例化Adapter對象 adapter = new MyRecyclerAdapter(this, list); // 設(shè)置Adapter recyclerView.setAdapter(adapter); adapter.notifyDataSetChanged(); } }
Activity頁面布局activity_recycler_view.xml
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout 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="match_parent" tools:context=".RecyclerViewActivity"> <androidx.recyclerview.widget.RecyclerView android:id="@+id/recyclerview" android:layout_width="match_parent" android:layout_height="match_parent"/> </androidx.constraintlayout.widget.ConstraintLayout>
- 創(chuàng)建Adapter文件MyRecyclerAdapter.class
package com.example.androidstudy.adapter; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import androidx.annotation.NonNull; import androidx.recyclerview.widget.RecyclerView; import com.example.androidstudy.R; import com.example.androidstudy.bean.TestData; import com.google.android.flexbox.FlexboxLayout; import java.util.List; public class MyRecyclerAdapter extends RecyclerView.Adapter<MyRecyclerAdapter.MyViewHolder>{ private List<TestData> data; private Context myContext; public MyRecyclerAdapter(Context context, List<TestData> data) { this.myContext = context; this.data = data; } @NonNull @Override public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) { View inflate = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_cell, parent, false); return new MyViewHolder(inflate); } public interface ItemCellClicker{ void onItemClick(String tag); } // 流式布局標(biāo)簽點(diǎn)擊事件 public ItemCellClicker itemCellClicker; // 設(shè)置點(diǎn)擊事件回調(diào) public void setItemCellClicker(ItemCellClicker itemCellClicker){ this.itemCellClicker = itemCellClicker; } @Override public void onBindViewHolder(@NonNull MyViewHolder holder, int position) { TextView title = holder.itemView.findViewById(R.id.tv_title); FlexboxLayout flexboxLayout = holder.itemView.findViewById(R.id.flexbox_layout); TestData data = this.data.get(position); List<String> tags = data.getTag(); flexboxLayout.removeAllViews(); // flexbox布局動態(tài)添加標(biāo)簽 for (int i = 0; i < tags.size(); i++) { String temp = tags.get(i); View tagView = LayoutInflater.from(myContext).inflate(R.layout.item_tag_cell, null, false); TextView tag = tagView.findViewById(R.id.tv_tag); tag.setText(temp); // 設(shè)置標(biāo)簽點(diǎn)擊事件 tag.setOnClickListener(view -> itemCellClicker.onItemClick(temp)); flexboxLayout.addView(tagView); } title.setText(data.getTitle()); } @Override public int getItemCount() { return data.size(); } public static class MyViewHolder extends RecyclerView.ViewHolder{ public MyViewHolder(@NonNull View itemView) { super(itemView); } } }
列表項(xiàng)布局item_cell.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="wrap_content" android:orientation="vertical" android:padding="10dp" tools:context=".MyActivity"> <TextView app:layout_constraintTop_toTopOf="parent" app:layout_constraintLeft_toLeftOf="parent" android:id="@+id/tv_title" android:text="Hello android" android:textSize="20sp" android:textColor="@color/black" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <!--流式布局--> <com.google.android.flexbox.FlexboxLayout android:id="@+id/flexbox_layout" android:orientation="horizontal" app:flexWrap="wrap" android:layout_width="match_parent" android:layout_height="wrap_content"/> </LinearLayout>
列表中標(biāo)簽布局item_tag_cell.xml
<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="wrap_content" android:padding="10dp" tools:context=".MyActivity"> <TextView android:id="@+id/tv_tag" android:paddingHorizontal="12dp" android:background="@drawable/item_tag_bg" android:gravity="center" android:text="Hello android" android:textSize="20sp" android:textColor="@color/black" android:layout_width="wrap_content" android:layout_height="32dp"/> </LinearLayout>
效果
總結(jié)
到此這篇關(guān)于Android實(shí)現(xiàn)RecyclerView嵌套流式布局的文章就介紹到這了,更多相關(guān)Android RecyclerView嵌套流式布局內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Android ActionBar制作時鐘實(shí)例解析
這篇文章主要為大家詳細(xì)介紹了Android ActionBar制作時鐘的實(shí)現(xiàn)代碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-05-05Android table布局開發(fā)實(shí)現(xiàn)簡單計(jì)算器
這篇文章主要為大家詳細(xì)介紹了Android table布局開發(fā)實(shí)現(xiàn)簡單計(jì)算器,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2020-05-05Android?Flutter使用本地?cái)?shù)據(jù)庫編寫備忘錄應(yīng)用
這篇文章主要為大家詳細(xì)介紹了Android?Flutter如何使用本地?cái)?shù)據(jù)庫實(shí)現(xiàn)編寫簡單的備忘錄應(yīng)用,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以了解一下2023-03-03Android中關(guān)于遞歸和二分法的算法實(shí)例代碼
這篇文章主要介紹了Android中關(guān)于遞歸和二分法的算法實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下2016-10-10淺談Android AsyncTask內(nèi)存安全的一種使用方式
這篇文章主要介紹了淺談Android AsyncTask內(nèi)存安全的一種使用方式,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-08-08Android學(xué)習(xí)之介紹Binder的簡單使用
BInder方面的資料雖然感覺看的比較多,但是真正用的時候才發(fā)現(xiàn)有很多地方模棱兩棵的,所以,打算用一個實(shí)例再來鞏固一下binder的使用方法。這篇文章主要介紹了Android中Binder的簡單使用,文中給出詳細(xì)的示例代碼,需要的朋友可以參考下2016-12-12Android編程實(shí)現(xiàn)XML解析與保存的三種方法詳解
這篇文章主要介紹了Android編程實(shí)現(xiàn)XML解析與保存的三種方法,結(jié)合實(shí)例形式詳細(xì)分析了Android實(shí)現(xiàn)xml解析的SAX、DOM、PULL三種方法的相關(guān)操作技巧,需要的朋友可以參考下2017-08-08使用ListView實(shí)現(xiàn)網(wǎng)上訂餐首頁
這篇文章主要為大家詳細(xì)介紹了使用ListView實(shí)現(xiàn)網(wǎng)上訂餐首頁,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-01-01