Android中使用ViewPager实现屏幕页面切换和页面轮播效果,androidviewpager
之前关于如何实现屏幕页面切换,写过一篇博文《Android中使用ViewFlipper实现屏幕切换》,相比ViewFlipper,ViewPager更适用复杂的视图切换,而且Viewpager有自己的adapter,这也让其适应复杂对象,实现数据的动态加载。
ViewPager是谷歌官方给我们提供的一个兼容低版本安卓设备的软件包,里面包囊了只有在安卓3.0以上可以使用的api。而viewpager就是其中之一,利用它,我们可以做很多事情,从最简单的导航,到页面菜单等等。
下面我们就展示下ViewPager可以实现的两种简单效果:
第一种:屏幕的页面的切换(与ViewFlipper的实现效果类似)
实现效果如下(4张视图(layout)):
第一步:在layout布局文件里加入主布局文件viewpager_layout.xml
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:orientation="vertical" android:layout_width="match_parent" 4 android:layout_height="match_parent"> 5 <android.support.v4.view.ViewPager 6 android:layout_width="match_parent" 7 android:layout_height="match_parent" 8 android:layout_gravity="center" 9 android:gravity="center" 10 android:id="@+id/vp"> 11 <android.support.v4.view.PagerTabStrip 12 android:layout_width="match_parent" 13 android:layout_height="wrap_content" 14 android:id="@+id/tap"> 15 </android.support.v4.view.PagerTabStrip> 16 </android.support.v4.view.ViewPager> 17 </LinearLayout>
注意事项:
<1、这里ViewPager和PagerTabStrip都要把包名写全了,不然会ClassNotFound
<2、API中说:在布局xml把PagerTabStrip当做ViewPager的一个子标签来用,不能拿出来,不然还是会报错
<3、在PagerTabStrip标签中可以用属性android:layout_gravity=TOP|BOTTOM来指定title的位置
<4、如果要显示出PagerTabStrip某一页的title,需要在ViewPager的adapter中实现getPageTitle(int)
第二步:在layout中建立要展示切换的视图文件(示例中共四个layout1/2/3/4.xml,这里写一个典型):
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 xmlns:app="http://schemas.android.com/apk/res-auto" 4 android:orientation="vertical" android:layout_width="match_parent" 5 android:layout_height="match_parent"> 6 <ImageView 7 android:layout_width="match_parent" 8 android:layout_height="match_parent" 9 android:src="@mipmap/a1" 10 android:scaleType="centerCrop" 11 android:id="@+id/iv1" /> 12 </LinearLayout>
第三步:Java中Activity的实现代码ViewPagerDemo.java(这里未设置pagerTabStrip的属性):
在Activity里实例化ViewPager组件,并设置它的Adapter(就是PagerAdapter,方法与ListView一样的)
实现一个PagerAdapter,覆盖以下方法:
instantiateItem(ViewGroup, int)//用来实例化页卡
destroyItem(ViewGroup, int, Object)//删除页卡
getCount() //返回页卡的数量
isViewFromObject(View, Object)//判断两个对象是否相等
getPageTitle(int position)//设置标签显示的标题
设置指示标签的属性
pagerTabStrip.setTabIndicatorColor();//指示器的颜色
pagerTabStrip.setBackgroundColor();//背影色
pagerTabStrip.setTextColor(Color.WHITE);//字体颜色
1 import android.os.Bundle; 2 import android.support.annotation.Nullable; 3 import android.support.v4.view.PagerAdapter; 4 import android.support.v4.view.ViewPager; 5 import android.support.v7.app.AppCompatActivity; 6 import android.view.View; 7 import android.view.ViewGroup; 8 import java.util.ArrayList; 9 /** 10 * Created by panchengjia on 2016/12/1. 11 */ 12 public class ViewPagerDemo extends AppCompatActivity { 13 private ViewPager vp; 14 //声明存储ViewPager下子视图的集合 15 ArrayList<View> views = new ArrayList<>(); 16 //显示效果中每个视图的标题 17 String[] titles={"一号美女","二号美女","三号美女","四号美女"}; 18 @Override 19 protected void onCreate(@Nullable Bundle savedInstanceState) { 20 super.onCreate(savedInstanceState); 21 setContentView(R.layout.viewpager_layout); 22 vp= (ViewPager) findViewById(R.id.vp); 23 initView();//调用初始化视图方法 24 vp.setAdapter(new MyAdapter());//设置适配器 25 } 26 //初始化视图的方法(通过布局填充器获取用于滑动的视图并存入对应的的集合) 27 private void initView() { 28 View v1 = getLayoutInflater().inflate(R.layout.layout1,null); 29 View v2 = getLayoutInflater().inflate(R.layout.layout2,null); 30 View v3 = getLayoutInflater().inflate(R.layout.layout3,null); 31 View v4 = getLayoutInflater().inflate(R.layout.layout4,null); 32 views.add(v1); 33 views.add(v2); 34 views.add(v3); 35 views.add(v4); 36 } 37 class MyAdapter extends PagerAdapter{ 38 @Override 39 public int getCount() { 40 return views.size(); 41 } 42 @Override 43 public boolean isViewFromObject(View view, Object object) { 44 return view==object; 45 } 46 //重写销毁滑动视图布局(将子视图移出视图存储集合(ViewGroup)) 47 @Override 48 public void destroyItem(ViewGroup container, int position, Object object) { 49 container.removeView(views.get(position)); 50 }