Android 使用ViewPager实现左右循环滑动图片

2023-08-05 08:15:40

ViewPager这个小demo实现的是可以左右循环滑动图片，下面带索引，滑到最后一页在往右滑动就要第一页，第一页往左滑动就到最后一页，先上效果图，用美女图片是我一贯的作风，呵呵

Android 使用ViewPager实现左右循环滑动图片

1.    首先看一些layout下的xml

[html] view plain copy
 

Android 使用ViewPager实现左右循环滑动图片Android 使用ViewPager实现左右循环滑动图片

  1. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. android:layout_width="fill_parent"
  3. android:layout_height="fill_parent"
  4. android:orientation="vertical" >
  5. <android.support.v4.view.ViewPager
  6. android:id="@+id/viewPager"
  7. android:layout_width="fill_parent"
  8. android:layout_height="wrap_content" />
  9. <RelativeLayout
  10. android:layout_width="fill_parent"
  11. android:layout_height="wrap_content"
  12. android:orientation="vertical" >
  13. <LinearLayout
  14. android:id="@+id/viewGroup"
  15. android:layout_width="fill_parent"
  16. android:layout_height="wrap_content"
  17. android:layout_alignParentBottom="true"
  18. android:layout_marginBottom="30dp"
  19. android:gravity="center_horizontal"
  20. android:orientation="horizontal" >
  21. </LinearLayout>
  22. </RelativeLayout>
  23. </FrameLayout>

使用ViewPager首先需要引入android-support-v4.jar这个jar包。自己不要忘记加

[java] view plain copy
 

Android 使用ViewPager实现左右循环滑动图片Android 使用ViewPager实现左右循环滑动图片

  1. package com.example.viewpagerdemo;
  2. import android.app.Activity;
  3. import android.os.Bundle;
  4. import android.support.v4.view.PagerAdapter;
  5. import android.support.v4.view.ViewPager;
  6. import android.support.v4.view.ViewPager.OnPageChangeListener;
  7. import android.view.View;
  8. import android.view.ViewGroup;
  9. import android.view.ViewGroup.LayoutParams;
  10. import android.widget.ImageView;
  11. import android.widget.LinearLayout;
  12. public class TwoActivity extends Activity implements OnPageChangeListener{
  13. /**
  14. * ViewPager
  15. */
  16. private ViewPager viewPager;
  17. /**
  18. * 装点点的ImageView数组
  19. */
  20. private ImageView[] tips;
  21. /**
  22. * 装ImageView数组
  23. */
  24. private ImageView[] mImageViews;
  25. /**
  26. * 图片资源id
  27. */
  28. private int[] imgIdArray ;
  29. @Override
  30. protected void onCreate(Bundle savedInstanceState) {
  31. super.onCreate(savedInstanceState);
  32. setContentView(R.layout.activity_main);
  33. ViewGroup group = (ViewGroup)findViewById(R.id.viewGroup);
  34. viewPager = (ViewPager) findViewById(R.id.viewPager);
  35. //载入图片资源ID
  36. imgIdArray = new int[]{R.drawable.item01, R.drawable.item02, R.drawable.item03, R.drawable.item04,
  37. R.drawable.item05,R.drawable.item06, R.drawable.item07, R.drawable.item08};
  38. //将点点加入到ViewGroup中
  39. tips = new ImageView[imgIdArray.length];
  40. for(int i=0; i<tips.length; i++){
  41. ImageView imageView = new ImageView(this);
  42. imageView.setLayoutParams(new LayoutParams(10,10));
  43. tips[i] = imageView;
  44. if(i == 0){
  45. tips[i].setBackgroundResource(R.drawable.page_indicator_focused);
  46. }else{
  47. tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
  48. }
  49. LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT,
  50. LayoutParams.WRAP_CONTENT));
  51. layoutParams.leftMargin = 5;
  52. layoutParams.rightMargin = 5;
  53. group.addView(imageView, layoutParams);
  54. }
  55. //将图片装载到数组中
  56. mImageViews = new ImageView[imgIdArray.length];
  57. for(int i=0; i<mImageViews.length; i++){
  58. ImageView imageView = new ImageView(this);
  59. mImageViews[i] = imageView;
  60. imageView.setBackgroundResource(imgIdArray[i]);
  61. }
  62. //设置Adapter
  63. viewPager.setAdapter(new MyAdapter());
  64. //设置监听，主要是设置点点的背景
  65. viewPager.setOnPageChangeListener(this);
  66. //设置ViewPager的默认项, 设置为长度的100倍，这样子开始就能往左滑动
  67. viewPager.setCurrentItem((mImageViews.length) * 100);
  68. }
  69. /**
  70. *
  71. * @author xiaanming
  72. *
  73. */
  74. public class MyAdapter extends PagerAdapter{
  75. @Override
  76. public int getCount() {
  77. return Integer.MAX_VALUE;
  78. }
  79. @Override
  80. public boolean isViewFromObject(View arg0, Object arg1) {
  81. return arg0 == arg1;
  82. }
  83. @Override
  84. public void destroyItem(View container, int position, Object object) {
  85. ((ViewPager)container).removeView(mImageViews[position % mImageViews.length]);
  86. }
  87. /**
  88. * 载入图片进去，用当前的position 除以 图片数组长度取余数是关键
  89. */
  90. @Override
  91. public Object instantiateItem(View container, int position) {
  92. ((ViewPager)container).addView(mImageViews[position % mImageViews.length], 0);
  93. return mImageViews[position % mImageViews.length];
  94. }
  95. }
  96. @Override
  97. public void onPageScrollStateChanged(int arg0) {
  98. }
  99. @Override
  100. public void onPageScrolled(int arg0, float arg1, int arg2) {
  101. }
  102. @Override
  103. public void onPageSelected(int arg0) {
  104. setImageBackground(arg0 % mImageViews.length);
  105. }
  106. /**
  107. * 设置选中的tip的背景
  108. * @param selectItems
  109. */
  110. private void setImageBackground(int selectItems){
  111. for(int i=0; i<tips.length; i++){
  112. if(i == selectItems){
  113. tips[i].setBackgroundResource(R.drawable.page_indicator_focused);
  114. }else{
  115. tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
  116. }
  117. }
  118. }
  119. }

代码下载

上面的代码中，当只有3张图片或者2张图片的时候，滑动存在BUG问题的修改如下

  • destroyItem(View container, int position, Object object)方法中不removeView
[java] view plain copy
 

Android 使用ViewPager实现左右循环滑动图片Android 使用ViewPager实现左右循环滑动图片

  1. @Override
  2. public void destroyItem(View container, int position, Object object) {
  3. //          ((ViewPager)container).removeView(mImageViews[position % mImageViews.length]);
  4. }
  • instantiateItem(View container, int position)增加异常扑捉
[java] view plain copy
 

Android 使用ViewPager实现左右循环滑动图片Android 使用ViewPager实现左右循环滑动图片

  1. @Override
  2. public Object instantiateItem(View container, int position) {
  3. try {
  4. ((ViewPager)container).addView(mImageViews[position % mImageViews.length], 0);
  5. }catch(Exception e){
  6. //handler something
  7. }
  8. return mImageViews[position % mImageViews.length];
  9. }

Android 使用ViewPager实现左右循环滑动图片

上一篇：postgis几何操作函数集


下一篇：windows 上执行python pywin32.exe