Android 第十八课 强大的滚动控件 RecyclerView
步驟:
一、添加依賴庫
compile'com.android.support:recyclerview-v7:26.1.0'二、在activity_mian.xml中,添加RecyclerView控件,并占據(jù)整個(gè)頁面。
三、把你要在RecyclerView中展示的內(nèi)容,設(shè)置成一個(gè)實(shí)體類Fruit,接著為RecyclerView的子項(xiàng)(展示的各個(gè)內(nèi)容)制定一個(gè)我們自定義的布局fruit_item.xml(用來放在RecyclerView里面)。
四、新建適配器(FruitAdapter)
------------------------------------------------------------------------------------------》
Android 提供了一個(gè)更強(qiáng)大的滾動(dòng)控件--RecyclerView。它是一個(gè)增強(qiáng)版的ListView。
新建RecyclerView項(xiàng)目。自動(dòng)創(chuàng)建好項(xiàng)目,開始。
1、RecyclerView的基本用法
和百分比布局類似,RecyclerView也屬于新增控件,為了讓RecyclerView在所有Android版本上使用,Android團(tuán)隊(duì)使用了同樣
的方式,將RecyclerView定義在了support庫中,因此,要想使用RecyclerView這個(gè)控件,首先在項(xiàng)目的build.gradle中添加對(duì)應(yīng)的依賴庫才行,代開app/gradle文件,在dependencies中添加如下內(nèi)容:
dependencies {?
?implementation fileTree(dir: 'libs', include: ['*.jar'])?
?implementation 'com.android.support:appcompat-v7:26.1.0'
?????.....
? compile'com.android.support:recyclerview-v7:26.1.0'
}
然后修改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"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context="com.example.recyclerviewtestb.MainActivity"> <android.support.v7.widget.RecyclerViewandroid:id="@+id/recycler_view"android:layout_width="match_parent"android:layout_height="match_parent" /> </LinearLayout>在布局中添加RecyclerView控件也是非常簡單的,先為RecyclerView指定一個(gè)id。讓RecyclerView占據(jù)整個(gè)布局的空間,由于RecyclerVeiw不是內(nèi)置在系統(tǒng)SDK當(dāng)中的,所以需要把完整的報(bào)名路徑寫出來。
我們先準(zhǔn)備好一份同樣的水果圖片。放在drawable目錄下,然后創(chuàng)建一個(gè)實(shí)體類Fruit,作為RecyclerView的適配類型,代碼如下:
Fruit類中只有兩個(gè)字段,name表示水果的名稱,imageId表示水果對(duì)那個(gè)圖片的資源id。
然后我們需要為RecyclerView的子項(xiàng)制定一個(gè)我們自定義的布局,在layout目錄下新建fruit_item.xml。
代碼如下:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:orientation="horizontal"android:layout_width="match_parent"android:layout_height="match_parent"><ImageViewandroid:id="@+id/fruit_image"android:layout_width="wrap_content"android:layout_height="wrap_content" /><TextViewandroid:id="@+id/fruit_name"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:layout_marginLeft="10dp" /></LinearLayout>在這里我們可以設(shè)置展示的樣式。這里就簡單設(shè)置一下。四、
接下來,為RecyclerView準(zhǔn)備一個(gè)適配器,新建FruitAdapter類,讓這個(gè)適配器繼承自RecyclerView.Adapter,并將泛型指定為FruitAdapter.ViewHolder。其中,ViewHolder是我們?cè)贔ruitAdapter中定義的一個(gè)內(nèi)部類,代碼如下:
package com.example.recyclerviewtestb;import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.view.animation.LinearInterpolator; import android.widget.ImageView; import android.widget.TextView;import java.util.List;/*** Created by ZHJ on 2018/3/10.*/public class FruitAdpater extends RecyclerView.Adapter<FruitAdpater.ViewHolder> {private List<Fruit> mFruitList;static class ViewHolder extends RecyclerView.ViewHolder{//內(nèi)部類ImageView fruitImage;TextView fruitName;public ViewHolder(View view){super(view);fruitImage= (ImageView)view.findViewById(R.id.fruit_image);fruitName = (TextView)view.findViewById(R.id.fruit_name);}}//構(gòu)造函數(shù)public FruitAdpater(List<Fruit>fruitList){mFruitList = fruitList;}@Overridepublic ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.fruit_item,parent,false);ViewHolder holder = new ViewHolder(view);return holder;} @Override public void onBindViewHolder(ViewHolder holder, int position) {Fruit fruit = mFruitList.get(position);holder.fruitImage.setImageResource(fruit.getImageId());holder.fruitName.setText(fruit.getName());}@Overridepublic int getItemCount() {return mFruitList.size();} }我們先定義了一個(gè)內(nèi)部類ViewHolder,ViewHolder要繼承自RecyclerView.ViewHolder。然后,ViewHolder的構(gòu)造函數(shù)中要傳入一個(gè)View參數(shù),這個(gè)參數(shù)通常就是RecyclerView子項(xiàng)的最外層布局,那么我們就可以通過findViewById()方法來獲取到布局中的ImageView和TextView的實(shí)例了。
????接著往下看,FruitApapter中也有一個(gè)構(gòu)造函數(shù),這個(gè)方法用于把要展示的數(shù)據(jù)源傳進(jìn)來,并賦值給一個(gè)全局變量mFruitList,我們后續(xù)的操作都將在這個(gè)數(shù)據(jù)源的基礎(chǔ)上進(jìn)行。
?????繼續(xù)往下看,由于FruitAdapter是繼承自RecyclerView.Adapter的,那么就必須重寫onCreateViewHolder(),onBindViewHolder()和getItemCount()這3個(gè)方法。
onCreateViewHolder()方法用于創(chuàng)建ViewHolder實(shí)例的,我們?cè)谶@個(gè)方法中將fruit_item布局加載進(jìn)來,然后創(chuàng)建一個(gè)ViewHolder實(shí)例,并把加載進(jìn)來,然后創(chuàng)建一個(gè)ViewHolder實(shí)例,并把加載出來的布局傳入到構(gòu)造函數(shù)中,最后將ViewHolder()方法的實(shí)例返回。
onBindViewHolder()方法是用于對(duì)RecyclerView子項(xiàng)的數(shù)據(jù)進(jìn)行賦值,會(huì)在每個(gè)子項(xiàng)被滾到屏幕內(nèi)的時(shí)候執(zhí)行,這里我們通過position參數(shù)得到當(dāng)前項(xiàng)的Fruit實(shí)例,然后再將數(shù)據(jù)設(shè)置到ViewHolder的ImageView和TextView當(dāng)中即可。
getItemCount()方法就簡單了,它用于告訴RecyclerView一共有多少子項(xiàng),直接返回?cái)?shù)據(jù)源的長度九課就可以了。
五、
適配器準(zhǔn)備好了之后,我們開始修改MainActivity中的代碼,如下:
package com.example.recyclerviewtestb;import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView;import java.util.ArrayList; import java.util.List;public class MainActivity extends AppCompatActivity {private List<Fruit> fruitList = new ArrayList<>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initFruit();//初始化水果數(shù)據(jù)RecyclerView recyclerView =(RecyclerView)findViewById(R.id.recycler_view);LinearLayoutManager layoutManager = new LinearLayoutManager(this);recyclerView.setLayoutManager(layoutManager);FruitAdpater adpater = new FruitAdpater(fruitList);recyclerView.setAdapter(adpater);}private void initFruit(){ for (int i = 0; i < 2; i++) {Fruit apple = new Fruit("Apple", R.drawable.apple_pic);fruitList.add(apple);Fruit banana = new Fruit("Banana", R.drawable.banana_pic);fruitList.add(banana);Fruit orange = new Fruit("Orange", R.drawable.orange_pic);fruitList.add(orange);Fruit watermelon = new Fruit("Watermelon", R.drawable.watermelon_pic);fruitList.add(watermelon);Fruit pear = new Fruit("Pear", R.drawable.pear_pic);fruitList.add(pear);Fruit grape = new Fruit("Grape", R.drawable.grape_pic);fruitList.add(grape);Fruit pineapple = new Fruit("Pineapple", R.drawable.pineapple_pic);fruitList.add(pineapple);Fruit strawberry = new Fruit("Strawberry", R.drawable.strawberry_pic);fruitList.add(strawberry);Fruit cherry = new Fruit("Cherry", R.drawable.cherry_pic);fruitList.add(cherry);Fruit mango = new Fruit("Mango", R.drawable.mango_pic);fruitList.add(mango);} } }
這里使用了一個(gè)同樣的initFruits()方法,用于初始化所有的水果數(shù)據(jù)。
接著在onCreate()方法中我們先獲取RecyclerView的實(shí)例,然后創(chuàng)建一個(gè)LinearLayoutManager對(duì)象,并將它設(shè)置到RecyclerView中。LayoutManager用于指定RecyclerView的布局方式,這里使用的LinearLayoutManager是線性布局的意思。
接下來,我們創(chuàng)建了FruitAdaptper的實(shí)例,并將水果數(shù)據(jù)傳入FruitAdapter的構(gòu)造函數(shù)中,最后調(diào)用RecyclerView的setAdaper()方法來完成適配器設(shè)置,這樣RecyclerView和數(shù)據(jù)之間的關(guān)聯(lián)就建立完成了。
可以運(yùn)行一下:
----------------------------------------------------------------》
實(shí)現(xiàn)橫向滾動(dòng)和瀑布流布局:
接下來,我們開始嘗試實(shí)現(xiàn)橫向滾動(dòng)的效果,
首先,要對(duì)fruit_item.xml布局進(jìn)行修改,因?yàn)檫@個(gè)布局里面的元素是水平排列的,適用于縱向滾動(dòng)
如果我們要實(shí)現(xiàn)橫向滾動(dòng),應(yīng)該把fruit_item里的元素該成垂直排列。
修改fruit_item.xml中的代碼,如下:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="100dp"android:layout_height="match_parent"><ImageViewandroid:id="@+id/fruit_image"android:layout_width="wrap_content"android:layout_height="wrap_content" android:layout_gravity="center_horizontal"/><TextViewandroid:id="@+id/fruit_name"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:layout_marginTop="10dp"/></LinearLayout>我們將Linearlayout改成垂直排列,并把寬度設(shè)為100dp。這里將寬度指定為固定值是因?yàn)槊糠N水果的文字長度不一致。
修改MainActivity中的代碼,如下所示:
package com.example.recyclerviewtestb;import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView;import java.util.ArrayList; import java.util.List;public class MainActivity extends AppCompatActivity {private List<Fruit> fruitList = new ArrayList<>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initFruit();//初始化水果數(shù)據(jù)RecyclerView recyclerView =(RecyclerView)findViewById(R.id.recycler_view);LinearLayoutManager layoutManager = new LinearLayoutManager(this); layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);recyclerView.setLayoutManager(layoutManager);FruitAdpater adpater = new FruitAdpater(fruitList);recyclerView.setAdapter(adpater);}...... }我們只是調(diào)用了LinearLayoutManager的setOrientation()方法來設(shè)置布局的排列方向,默認(rèn)是縱向排列的,我們傳入LinearLayoutManager.HORIZONTAL表示讓布局橫行排列,這樣RecyclerView就可以橫向滾動(dòng)了。
運(yùn)行一下:
RecyclerView的布局排列是由LayoutManager去管理,LayoutManager中指定了一套可擴(kuò)展的布局排列接口,子類只要按照接口的規(guī)范來實(shí)現(xiàn),就可以指定出各種不同排列方式的布局。
除了LinearLayoutManager之外,RecyclerView還給我們提供了GridLayoutManager和StaggeredGridLayoutManager這兩種內(nèi)置的布局排列方式。
GridLayoutManager可以用來實(shí)現(xiàn)網(wǎng)格布局。
StaggeredGridLayoutManager可以用來實(shí)現(xiàn)瀑布流布局。
《待續(xù)。。。。》
總結(jié)
以上是生活随笔為你收集整理的Android 第十八课 强大的滚动控件 RecyclerView的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: python grasshopper_G
- 下一篇: Android 第十九课 大喇叭--广