在一个窗口里面添加tab便签,完成便签切换来实现页面的切换,这样的好处是可以在同一个窗口里面有多个页面,这些页面共享同一个窗口的资源,同使用多个窗口来实现这个功能来得更加流畅!!
主要产生的类文件有activity,n个view,adapter,自定义的ViewPager,n+1个布局文件
demo所用到文件
步骤:
创建activity
package com.example.myviewpager;import java.util.ArrayList;import java.util.List;import android.app.Activity;import android.content.Context;import android.graphics.Color;import android.os.Bundle;import android.support.v4.view.ViewPager;import android.view.View;import android.view.View.OnClickListener;import android.widget.TextView;/**
* 主窗口
* @author cgx
*
*/public class MainActivity extends Activity implements OnClickListener { private Context mContext; private MyViewPager mPager;// 页面内容
private MyViewPagerAdapter pagerAdapter = null; private TextView t1, t2, t3;// 页卡头标
private List<View> pageList = new ArrayList<View>(); private View1 mView1; private View2 mView2; private View3 mView3; @Override
protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mContext = this;
initViews();
initEvents();
initViewPager();
} private void initViews() { // TODO Auto-generated method stub
t1 = (TextView) findViewById(R.id.text1);
t2 = (TextView) findViewById(R.id.text2);
t3 = (TextView) findViewById(R.id.text3);
mPager = (MyViewPager) findViewById(R.id.vPager); // 设置ViewPager不允许滑动
//mPager.setCanScroll(false);
//一开始进入窗口的时候,默认第一个便签被选中
t1.setBackgroundColor(Color.parseColor("#FFFF00"));
t2.setBackgroundColor(Color.parseColor("#FFFFFF"));
t3.setBackgroundColor(Color.parseColor("#FFFFFF"));
} private void initEvents() { // TODO Auto-generated method stub
t1.setOnClickListener(this);
t2.setOnClickListener(this);
t3.setOnClickListener(this);
} private void initViewPager() { // TODO Auto-generated method stub
pageList.clear(); if (mView1 == null) {
mView1 = new View1(mContext);
} if (mView2 == null) {
mView2 = new View2(mContext);
} if (mView3 == null) {
mView3 = new View3(mContext);
}
pageList.add(mView1.getView());
pageList.add(mView2.getView());
pageList.add(mView3.getView());
pagerAdapter = new MyViewPagerAdapter(pageList); // 缓存页面,如果想全部都缓存的话,参数等于页卡数减一,系统默认参数为1,保存两个
mPager.setOffscreenPageLimit(2);
mPager.setAdapter(pagerAdapter); // 设置Page改变监听器
mPager.setOnPageChangeListener(onPageChangeListener);
} /**
* SimpleOnPageChangeListener.该监听是当我们的viewpager页面切换的时候会触发 在里面我们会去改变 tab的聚焦情况
* 。 因为实现上viewpager与actionbar是独立的,需要我们手动同步 。
*/
ViewPager.SimpleOnPageChangeListener onPageChangeListener = new ViewPager.SimpleOnPageChangeListener() { @Override
public void onPageSelected(int position) { /**
* setSelectedNavigationItem 方法用于设置ActionBar的聚焦tab .
* 在接下来我们判断了SLidingMenu的手势力模式, 如果ViewPager已经滑到了最左边,则我们把手势设置成全屏的,
* 这样更往左滑动的时候,就会打开Menu .
*/
initTab(position);
} // 初始化便签颜色
private void initTab(int position) { // TODO Auto-generated method stub
if (position == 0) {
t1.setBackgroundColor(Color.parseColor("#FFFF00"));
t2.setBackgroundColor(Color.parseColor("#FFFFFF"));
t3.setBackgroundColor(Color.parseColor("#FFFFFF"));
} else if (position == 1) {
t1.setBackgroundColor(Color.parseColor("#FFFFFF"));
t2.setBackgroundColor(Color.parseColor("#FFFF00"));
t3.setBackgroundColor(Color.parseColor("#FFFFFF"));
} else {
t1.setBackgroundColor(Color.parseColor("#FFFFFF"));
t2.setBackgroundColor(Color.parseColor("#FFFFFF"));
t3.setBackgroundColor(Color.parseColor("#FFFF00"));
}
}
}; @Override
public void onClick(View v) { // TODO Auto-generated method stub
switch (v.getId()) { case R.id.text1:// 点击第一个便签
mPager.setCurrentItem(0, false); break; case R.id.text2:// 点击第二个便签
mPager.setCurrentItem(1, false); break; case R.id.text3:// 点击第三个便签
mPager.setCurrentItem(2, false); break; default: break;
}
}
}自定义MyViewPager
package com.example.myviewpager;import android.content.Context;import android.support.v4.view.ViewPager;import android.util.AttributeSet;import android.view.MotionEvent;/**
* 自定义滑动翻页可控,可通过设置isCanScroll参数来控制是否允许滑动切换页面
*/public class MyViewPager extends ViewPager { /** 是否允许滑动翻页 ,默认可滑动*/
private boolean isCanScroll = true; public MyViewPager(Context context, AttributeSet attrs) { super(context, attrs);
} public MyViewPager(Context context) { super(context);
} public boolean isCanScroll() { return isCanScroll;
} /** 设置是否可以滑动翻页 */
public void setCanScroll(boolean isCanScroll) { this.isCanScroll = isCanScroll;
} @Override
public void scrollTo(int x, int y) { super.scrollTo(x, y);
} // 设置禁止滑动的关键
@Override
public boolean onTouchEvent(MotionEvent arg0) { if (!isCanScroll) return true; return super.onTouchEvent(arg0);
} @Override
public boolean onInterceptTouchEvent(MotionEvent arg0) { return super.onInterceptTouchEvent(arg0);
} @Override
public void setCurrentItem(int item, boolean smoothScroll) { super.setCurrentItem(item, smoothScroll);
} @Override
public void setCurrentItem(int item) { super.setCurrentItem(item);
}
}适配器:
package com.example.myviewpager;import java.util.List;import android.support.v4.view.PagerAdapter;import android.view.View;import android.view.ViewGroup;/**
* viewpager适配器
* */public class MyViewPagerAdapter extends PagerAdapter{
private List<View> mListViews;
public MyViewPagerAdapter(List<View> mListViews) {
this.mListViews = mListViews;//构造方法,参数是我们的页卡,这样比较方便 }
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(mListViews.get(position));//删除页卡 }
@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;//官方提示这样写 }
}第一个view
package com.example.myviewpager;import android.content.Context;import android.view.LayoutInflater;import android.view.View;/**
* 第一个
* @author cgx
*
*/public class View1 { private Context mContext; private View rootView; public View1(Context mContext) { // TODO Auto-generated constructor stub
this.mContext=mContext; //加载布局
rootView = LayoutInflater.from(mContext).inflate(
R.layout.view1_layout, null);
} public View getView(){ return rootView;
}
}activity布局文件
<LinearLayout 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:orientation="vertical" > <LinearLayout android:id="@+id/linearLayout1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#FFFFFF" > <TextView 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="20sp" /> <TextView 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="20sp" /> <TextView android:id="@+id/text3" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1.0" android:gravity="center" android:text="页卡3" android:textColor="#000000" android:textSize="20sp" /> </LinearLayout> <com.example.myviewpager.MyViewPager 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" /></LinearLayout>
View1的布局
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:background="#123456" ></LinearLayout>
由于用于演示,所以view的布局只是用不同的背景色来区分,开发中具体要展示的布局可以直接在view的布局文件里面改。demo中的view都是参考第一个来写的,类似
总结
实际开发中,虽然官方提供了很多api,真正等到要自己用的时候,还是自己在依照习惯再包装一层,成为自己的工具,这样以后就可以直接用了,上面的例子是我在实习期间总结的,鄙陋之处敬请原谅,也欢迎大家指出,一起学习(^_^)
代码链接:http://pan.baidu.com/s/1pJAF6Gz
原文链接:http://www.codeceo.com/article/android-viewpager-usage.html
点击查看更多内容
为 TA 点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦

