Android使用RecyclerView仿美團(tuán)分類界面
RecyclerView目前來(lái)說(shuō)對(duì)大家可能不陌生了。由于在公司的項(xiàng)目中,我們一直用的listview和gridview。某天產(chǎn)品設(shè)計(jì)仿照美團(tuán)的分類界面設(shè)計(jì)了一個(gè)界面,我發(fā)現(xiàn)用gridview不能實(shí)現(xiàn)這樣的效果,所以就想到了RecyclerView,確實(shí)是一個(gè)很好的控件。和大家分享一下。
效果圖
簡(jiǎn)介
RecyclerView與ListView原理是類似的:都是僅僅維護(hù)少量的View并且可以展示大量的數(shù)據(jù)集。RecyclerView用以下兩種方式簡(jiǎn)化了數(shù)據(jù)的展示和處理:
* 使用LayoutManager來(lái)確定每一個(gè)item的排列方式。
* 為增加和刪除項(xiàng)目提供默認(rèn)的動(dòng)畫效果
用法須知
LayoutManager:用來(lái)確定每一個(gè)item如何進(jìn)行排列擺放,何時(shí)展示和隱藏?;厥栈蛑赜靡粋€(gè)View的時(shí)候,LayoutManager會(huì)向適配器請(qǐng)求新的數(shù)據(jù)來(lái)替換舊的數(shù)據(jù),這種機(jī)制避免了創(chuàng)建過(guò)多的View和頻繁的調(diào)用findViewById方法(與ListView原理類似)。
目前SDK中提供了三種自帶的LayoutManager:
- LinearLayoutManager
- GridLayoutManager
- StaggeredGridLayoutManager
代碼
布局文件
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#7e6c6c" tools:context="cn.bluemobi.dylan.recyclerviewdemo.MainActivity"> <android.support.v7.widget.RecyclerView android:id="@+id/rv" android:background="#FFFFFF" android:paddingLeft="8dp" android:paddingBottom="5dp" android:layout_width="match_parent" android:layout_height="200dp" /> </RelativeLayout>
item.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="70dp" android:layout_height="match_parent" android:orientation="vertical"> <ImageView android:id="@+id/iv" android:layout_width="60dp" android:layout_height="75dp" app:srcCompat="@mipmap/ic_category_0" /> <TextView android:id="@+id/tv" android:layout_width="match_parent" android:gravity="center" android:layout_gravity="center" android:layout_height="wrap_content" android:textColor="#000000" android:text="TextView" /> </LinearLayout>
Activity中的代碼
RvAdpter.java
package cn.bluemobi.dylan.recyclerviewdemo; import android.content.Context; import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.TextView; import java.util.List; /** * Created by yuandl on 2016-11-01. */ public class RvAdpter extends RecyclerView.Adapter<RvAdpter.MyViewHolder> { private Context context; private List<Integer> datas; public RvAdpter(Context context, List<Integer> datas) { this.context = context; this.datas = datas; } @Override public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View contentView= LayoutInflater.from(context).inflate(R.layout.item,parent,false); MyViewHolder viewHolder=new MyViewHolder(contentView); return viewHolder; } @Override public void onBindViewHolder(MyViewHolder holder, int position) { holder.imageView.setImageResource(datas.get(position)); holder.tv.setText("分類"+position); } @Override public int getItemCount() { return datas==null?0:datas.size(); } public class MyViewHolder extends RecyclerView.ViewHolder { private ImageView imageView; public TextView tv; public MyViewHolder(View itemView) { super(itemView); imageView = (ImageView) itemView.findViewById(R.id.iv); tv = (TextView) itemView.findViewById(R.id.tv); } } }
MainActivity.java
package cn.bluemobi.dylan.recyclerviewdemo; import android.content.res.Resources; import android.graphics.Canvas; import android.graphics.Rect; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.RecyclerView; import android.support.v7.widget.StaggeredGridLayoutManager; import android.view.View; import java.lang.reflect.Field; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { private RecyclerView rv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); rv = (RecyclerView) findViewById(R.id.rv); initData(); } /** * 初始化數(shù)據(jù) */ private void initData() { List<Integer> datas = new ArrayList<>(); for (int i = 0; i < 38; i++) { Resources res = getResources(); datas.add(res.getIdentifier("ic_category_" + i, "mipmap", getPackageName())); } /** *用來(lái)確定每一個(gè)item如何進(jìn)行排列擺放 * LinearLayoutManager 相當(dāng)于ListView的效果 GridLayoutManager相當(dāng)于GridView的效果 StaggeredGridLayoutManager 瀑布流 */ rv.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.HORIZONTAL)); rv.addItemDecoration(new RecyclerView.ItemDecoration() { @Override public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) { outRect.left = 10; outRect.top = 10; outRect.top = 10; } }); rv.setAdapter(new RvAdpter(this, datas)); } }
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- Android自定義StepView仿外賣配送進(jìn)度
- Android仿外賣購(gòu)物車功能
- Android仿百度外賣自定義下拉刷新效果
- Android仿美團(tuán)下拉菜單(商品選購(gòu))實(shí)例代碼
- Android仿美團(tuán)分類下拉菜單實(shí)例代碼
- Android編程實(shí)現(xiàn)仿美團(tuán)或淘寶的多級(jí)分類菜單效果示例【附demo源碼下載】
- Android仿美團(tuán)淘寶實(shí)現(xiàn)多級(jí)下拉列表菜單功能
- Android模仿美團(tuán)頂部的滑動(dòng)菜單實(shí)例代碼
- 模仿美團(tuán)點(diǎn)評(píng)的Android應(yīng)用中價(jià)格和購(gòu)買欄懸浮固定的效果
- Android仿美團(tuán)外賣菜單界面
相關(guān)文章
Android 處理OnItemClickListener時(shí)關(guān)于焦點(diǎn)顏色的設(shè)置問(wèn)題
這篇文章主要介紹了Android 處理OnItemClickListener時(shí)關(guān)于焦點(diǎn)顏色的設(shè)置問(wèn)題的相關(guān)資料,需要的朋友可以參考下2017-02-02Android編程實(shí)現(xiàn)通訊錄中聯(lián)系人的讀取,查詢,添加功能示例
這篇文章主要介紹了Android編程實(shí)現(xiàn)通訊錄中聯(lián)系人的讀取,查詢,添加功能,涉及Android權(quán)限控制及通訊錄相關(guān)操作技巧,需要的朋友可以參考下2017-07-07Android webview與js交換JSON對(duì)象數(shù)據(jù)示例
js主動(dòng)調(diào)用android的對(duì)象方式,android也無(wú)法返回給js一個(gè)jsonobject,需要js做一下轉(zhuǎn)換,具體代碼如下,感興趣的朋友可以參考下哈2013-06-06Android如何利用RecyclerView實(shí)現(xiàn)列表倒計(jì)時(shí)效果實(shí)例代碼
這篇文章主要給大家介紹了關(guān)于Android如何利用RecyclerView實(shí)現(xiàn)列表倒計(jì)時(shí)效果的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-02-02python gstreamer實(shí)現(xiàn)視頻快進(jìn)/快退/循環(huán)播放功能
這篇文章主要介紹了python gstreamer 實(shí)現(xiàn)視頻快進(jìn)/快退/循環(huán)播放功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03kotlin 注解 @Parcelize 使用示例和步驟詳解
Parcelable 接口是 Android 中用于在組件之間傳遞對(duì)象的一種方式,在 Kotlin 中,@Parcelize 注解用于簡(jiǎn)化實(shí)現(xiàn) Android Parcelable 接口的過(guò)程,本文給大家分享kotlin 注解 @Parcelize 使用示例,感興趣的朋友一起看看吧2024-06-06Android應(yīng)用啟動(dòng)流程之從啟動(dòng)到可交互的過(guò)程解析
這篇文章將給大家總結(jié)學(xué)習(xí)Android 基礎(chǔ)知識(shí),Android應(yīng)用啟動(dòng)流程,從啟動(dòng)到可交互的過(guò)程解析,在學(xué)習(xí)過(guò)程中,大家最好是把源碼下載下來(lái),感興趣的小伙伴跟著小編一起來(lái)看看吧2023-08-08