一個(gè)頁(yè)面顯示多個(gè)ViewPager的Item,如何在一個(gè)頁(yè)面上顯示ViewPager的多個(gè)item焦蘑?
一共有兩種解決方案:
第一種就是我們上文所說的clipChildren屬性盯拱,
第二種是clipToPadding屬性
只需要在父容器和ViewPager中都添加上clipChildren屬性,然后給ViewPager設(shè)置左右兩個(gè)margin例嘱,使其不致于把整個(gè)屏幕占滿狡逢,就是這么簡(jiǎn)單
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false"
tools:context="org.lenve.myviewpagercards.MainActivity">
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginLeft="60dp"
android:layout_marginRight="60dp"
android:clipChildren="false"></android.support.v4.view.ViewPager>
</RelativeLayout>
我們?cè)賮砜纯碫iewPager的Adapter:
public class MyVpAdater extends PagerAdapter {
private List<Integer> list;
private Context context;
public MyVpAdater(Context context, List<Integer> list) {
this.context = context;
this.list = list;
}
@Override
public int getCount() {
return list.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView iv = new ImageView(context);
iv.setImageResource(list.get(position));
container.addView(iv);
return iv;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setPageMargin(80);
viewPager.setOffscreenPageLimit(3);
MyVpAdater adater = new MyVpAdater(this, list);
viewPager.setAdapter(adater);
比我們一般使用ViewPager多了兩行代碼,
一個(gè)是setOffscreenPageLimit拼卵,這個(gè)是設(shè)置預(yù)加載的頁(yè)數(shù)奢浑,我們知道默認(rèn)情況下這個(gè)參數(shù)為1,也就是左右各預(yù)加載一頁(yè)腋腮,但是我們這里要讓左右各預(yù)加載兩頁(yè);
另外一個(gè)PageMargin就好說了雀彼,就是設(shè)置ViewPager中兩頁(yè)之間的距離。OK即寡,那我們來看看顯示效果:
image
第二種:(ViewPager結(jié)合CardView)
那就是clipToPadding徊哑,這個(gè)屬性是什么意思呢?它表示是否允許ViewGroup在ViewGroup的padding中進(jìn)行繪制嘿悬,默認(rèn)情況下該屬性的值為true实柠,即不允許在ViewGroup的padding中進(jìn)行繪制。
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="org.lenve.myviewpagercards2.MainActivity">
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="200dp"
android:clipToPadding="false"
android:paddingBottom="24dp"
android:paddingLeft="48dp"
android:paddingRight="48dp"
android:paddingTop="24dp"></android.support.v4.view.ViewPager>
</RelativeLayout>
ViewPager的Adapter如下:
public class MyAdapter extends PagerAdapter {
private List<Integer> list;
private Context context;
private LayoutInflater inflater;
public MyAdapter(Context context, List<Integer> list) {
this.context = context;
this.list = list;
inflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
return list.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
View view = inflater.inflate(R.layout.vp_item, container, false);
container.addView(view);
return view;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
調(diào)用
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
List<Integer> list = new ArrayList<>();
MyAdapter adapter = new MyAdapter(this, list);
viewPager.setAdapter(adapter);
viewPager.setPageMargin((int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_DIP, 48, getResources().getDisplayMetrics()));
viewPager.setPageTransformer(false, new ScaleTransformer(this));
轉(zhuǎn)載自:https://blog.csdn.net/u012702547/article/details/52334161