大圣归来 原生示例"/>
ViewPage 大圣归来 原生示例
VP简介
android-support-v4.jar 是谷歌官方给我们提供的一个兼容低版本安卓设备的软件包，里面包囊了只有在安卓3.0以上可以使用的api。而ViewPage就是其中之一，利用它，我们可以做很多事情，从最简单的导航，到页面菜单等等。
ViewPager类提供了多界面切换的新效果，新效果有如下特征：- <1>当前显示一组界面中的其中一个界面；
- <2>当用户通过左右滑动界面时，当前的屏幕显示当前界面和下一个界面的一部分；
- <3>滑动结束后，界面自动跳转到当前选择的界面中。
PageAdapter回调方法
PagerAdapter回调方法细节
- pagerAdapter是默认预加载前后共3张图片的
- 当显示第一页时，调用两次instantiateItem方法，分别加载第一页，预加载第二页，instantiateItem的参数position的值，先是0然后是1；
- 当滑动到第二页时，只调用一次instantiateItem方法，是因为本页已经在之前预加载过了，所以会直接从ViewGroup中取出第二页用于显示，同时会预加载第三页，所以这时instantiateItem的参数position的值为2
- 当滑动到第三页时，由于第三页也已经预加载过了，所以也会直接从ViewGroup中取出第三页用于显示，由于后面没有图片了，所以不会再调用instantiateItem方法
- 但注意，这时会调用destroyItem方法，销毁ViewGroup中的第一页照片，此时destroyItem的参数position的值为0
- 若getCount()返回为“0”，则viewpage上不会显示任何照片(也不报错)，也不能滑动（其实是没效果）
- 若getCount()返回为“1”，则viewpage上只显示第一张照片，也不能滑动(等于就是一个item了)
- 若getCount()返回为“2”，则viewpage上只显示前两张照片（只能在两者间滑动）
- 正常情况下，滑动到最后一张照片时不能再向前划到第一张，当然第一张图片时也不能向后划到最后一张
- getCount()的返回值要足够大(否则滑动到一定次数后向前就划不动了)
- 要保证首先加载的position足够大，可使用viewpage.setCurrentItem(3000000)设置
- 当然也要保证首先加载的是第一张图片，使用position=position % mList.size()替换所有用到的position参数的值
Activitypublic class MainActivity extends Activity implements OnTouchListener, OnPageChangeListener, OnClickListener, OnGlobalLayoutListener { public static final int MARGIN_BETWEEN_POINTS = 30; private ViewPager vp; private MyPagerAdapter mAdapter; private ArrayList<ItemBean> mList; private TextView image_desc;//图片的描述信息 private Button btn_start; //圆点 private RelativeLayout point;//所有小圆点的父控件 private LinearLayout ll_point_group;//三个小圆点的父控件 private View view_red_point;//小红点 private int mPointWidth;//小圆点间的距离 //利用消息机制自动滚动 private Handler mHandler = new Handler() { public void handleMessage(Message msg) { vp.setCurrentItem(vp.getCurrentItem() + 1);//让viewPager 滑动到下一页 mHandler.sendEmptyMessageDelayed(0, 3000);//接收到消息后再发一条消息，于是一个死循环诞生了 }; }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);//设置全屏 setContentView(R.layout.activity_main); vp = (ViewPager) findViewById(R.id.vp); point = (RelativeLayout) findViewById(R.id.point); ll_point_group = (LinearLayout) findViewById(R.id.ll_point_group); view_red_point = findViewById(R.id.view_red_point); btn_start = (Button) findViewById(R.id.btn_start); image_desc = (TextView) findViewById(R.id.image_desc); btn_start.setOnClickListener(this); mList = new ArrayList<ItemBean>(); mList.add(new ItemBean(R.drawable.guide_1, "欢迎使用大圣手机卫士", "1111111")); mList.add(new ItemBean(R.drawable.guide_2, "作者：包青天", "22222222")); mList.add(new ItemBean(R.drawable.guide_3, "QQ：909120849", "3333333")); mList.add(new ItemBean(R.drawable.guide_4, "2015-11-19", "444444")); // 初始化引导页的小圆点 for (int i = 0; i < mList.size(); i++) { View point = new View(this); point.setBackgroundResource(R.drawable.shape_point_gray); LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(20, 20);//设置圆点大小 params.leftMargin = MARGIN_BETWEEN_POINTS;// 为保证居中对齐，同时设置圆点的左右Margin值 params.rightMargin = MARGIN_BETWEEN_POINTS; point.setLayoutParams(params); ll_point_group.addView(point); } mAdapter = new MyPagerAdapter(this, mList); vp.setAdapter(mAdapter); vp.setOnPageChangeListener(this); vp.setOnTouchListener(this); vp.setCurrentItem(120);//求公倍数：1*2*3*4*5=120 mHandler.sendEmptyMessageDelayed(0, 3000);//3秒后发送空消息 //对小圆点父控件layout结束事件进行监听。 point.getViewTreeObserver().addOnGlobalLayoutListener(this); } //************************************************************************************************************************** @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { //参数为：当前条目位置，当前条目移动的百分比（每次都是0-100%），移动距离（每次都是0-item的width） position = position % mList.size(); //小红点动态移动的距离 int leftMargin; //最后一个条目时，不再继续向后移动 if (position == mList.size() - 1) { leftMargin = position * mPointWidth + MARGIN_BETWEEN_POINTS; } else { leftMargin = (int) (mPointWidth * positionOffset) + position * mPointWidth + MARGIN_BETWEEN_POINTS; } RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) view_red_point.getLayoutParams(); params.leftMargin = leftMargin; view_red_point.setLayoutParams(params); } @Override public void onPageSelected(int position) { position = position % mList.size(); image_desc.setText(mList.get(position).desscription); if (position == mList.size() - 1) btn_start.setVisibility(View.VISIBLE); else btn_start.setVisibility(View.GONE); } @Override public void onPageScrollStateChanged(int state) { } @Override // 当按下条目时停止切换 public boolean onTouch(View v, MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN://按下 mHandler.removeCallbacksAndMessages(null);// 删除Handler中的所有消息 break; case MotionEvent.ACTION_UP://抬起 mHandler.sendEmptyMessageDelayed(0, 3000); break; case MotionEvent.ACTION_CANCEL://事件取消，即按下后手指移到了其他地方才松开 mHandler.sendEmptyMessageDelayed(0, 3000); break; default: break; } return false;//代表事件没被消耗掉了，可以被其他控件继续获取到，一定要返回false，否则会导致ViewPager的滑动切换功能失效 } @Override public void onClick(View v) { Toast.makeText(MainActivity.this, "欢迎使用大圣手机卫士", Toast.LENGTH_SHORT).show(); } @Override public void onGlobalLayout() { //使用完必须撤销监听（只测量一次），否则，会一直不停的不定时的测量（一秒七八次左右），这比较耗性能 point.getViewTreeObserver().removeOnGlobalLayoutListener(this);//removeGlobalOnLayoutListener(this);废弃了 //获取小圆点间的距离，即小红点每次移动的距离 mPointWidth = ll_point_group.getChildAt(1).getLeft() - ll_point_group.getChildAt(0).getLeft(); } }
Adapterpublic class MyPagerAdapter extends PagerAdapter { private Context mContext; private ArrayList<ItemBean> mList;; public MyPagerAdapter(Context mContext, ArrayList<ItemBean> mList) { this.mContext = mContext; this.mList = mList; } //设置当前页面的标题 public CharSequence getPageTitle(int position) { position = position % mList.size(); return mList.get(position).titleString; } public int getCount() { return Integer.MAX_VALUE; } // 判断是否是同一条目 public boolean isViewFromObject(View view, Object object) { return view == object; } // 初始化要显示的条目 public Object instantiateItem(ViewGroup container, int position) { position = position % mList.size(); ImageView imageView = new ImageView(mContext); imageView.setImageResource(mList.get(position).imgId); container.addView(imageView);//一定将要显示的条目加入到ViewGroup的缓存容器中才可以显示 return imageView;//然后作为返回值返回 } //将要销毁的条目从ViewGroup的缓存容器中移除 public void destroyItem(ViewGroup container, int position, Object object) { position = position % mList.size(); container.removeView((View) object); } }
布局<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="" android:layout_width="match_parent" android:layout_height="match_parent" > <android.support.v4.view.ViewPager android:id="@+id/vp" android:layout_width="match_parent" android:layout_height="match_parent" > <android.support.v4.view.PagerTitleStrip android:id="@+id/pt_title" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </android.support.v4.view.ViewPager> <TextView android:id="@+id/image_desc" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerInParent="true" android:background="#30f0" android:gravity="center" android:text="我是描述信息" android:textColor="#f00" android:textSize="20sp" /> <Button android:id="@+id/btn_start" android:layout_width="200dp" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_marginBottom="100dp" android:background="@drawable/btn_bg_selector" android:text=" 开 始 体 验 " android:textSize="13sp" android:visibility="gone" /> <RelativeLayout android:id="@+id/point" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_marginBottom="20dp" > <LinearLayout android:id="@+id/ll_point_group" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" /> <View android:id="@+id/view_red_point" android:layout_width="20px" android:layout_height="20px" android:background="@drawable/shape_point_red" /> </RelativeLayout> </RelativeLayout>
来自为知笔记(Wiz)
附件列表
更多推荐
ViewPage 大圣归来 原生示例
发布评论