ViewPager,它是google SDk中自带的一个附加包的一个类,可以用来实现屏幕间的切换,这个附加包是android-support-v4.jar.
现在来看看它的实现过程:
1、界面设计很简单,第一行三个头标,第二行页卡内容展示。
xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
android:id="@+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="100.0dip"
android:background="#FFFFFF" >
android:id="@+id/text1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="页卡1"
android:textColor="#000000"
android:textSize="22.0dip" />
android:id="@+id/text2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="页卡2"
android:textColor="#000000"
android:textSize="22.0dip" />
android:id="@+id/vPager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1.0"
android:background="#000000"
android:flipInterval="30"
android:persistentDrawingCache="animation" />
2、我们要展示两个页卡,所以还需要两个页卡内容的界面设计布局:
xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
android:id="@+id/text1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="页卡1"
android:textColor="#000000"
android:textSize="22.0dip" />
xmlns:umadsdk="http://schemas.android.com/apk/res/com.LoveBus"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
android:id="@+id/text1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:gravity="center"
android:text="页卡1"
android:textColor="#000000"
android:textSize="22.0dip" />
3、定义好了布局文件,我们来看看代码:
我们的ViewPager实现需要下面这几个
private TextView t1, t2; // 页卡头标
private ViewPager mPager; //页卡内容
private List listViews; // Tab页面列表
我们首先来看页卡头标t1,t2,就是显示tab选项卡的那两项,当然你可以在这里设置它的背景,选中及不选中背景不同来区分,要更好的效果还可以模拟手机新浪微博中
的这种效果
可以直接在背景图片中设置。
然后我们再看重点ViewPager,它的表现类似ListView,只不过它是横向滑动的,既然和ListView相似,那么必有相同之处,它的实现也要Item View适配器来装配,
它装配的是每个选项卡对应的视图,即:
listViews = new ArrayList();
LayoutInflater mInflater = getLayoutInflater();
listViews.add(mInflater.inflate(R.layout.lay1, null));
listViews.add(mInflater.inflate(R.layout.lay2, null));
listViews.add(mInflater.inflate(R.layout.lay3, null));
mPager.setAdapter(new MyPagerAdapter(listViews));
public class MyPagerAdapter extends PagerAdapter{
private List mListViews;
/**
*
*@desc 构造方法,参数是每页要显示的视图
*
*/
public MyViewPagerAdapter(List mListViews) {
this.mListViews = mListViews;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(mListViews.get(position));//删除页卡
}
/**
*
*@desc 实例化页卡
*
*/
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(mListViews.get(position), 0);
return mListViews.get(position);
}
@Override
public int getCount() {
return mListViews.size();//返回页卡的数量
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0==arg1;//官方提示这样写
}
}
设置了适配器之后是可以显示了,但像ListView那样我们还需要点击事件,不同的是,这里是选中和页面改变事件:
viewPager.setCurrentItem(0);
viewPager.setOnPageChangeListener(new MyOnPageChangeListener());
我的博客其它文章列表
http://my.oschina.net/helu