现在的位置: 首页 > 综合 > 正文

使用ViewPager实现左右循环滑动 总结

2013年11月28日 ⁄ 综合 ⁄ 共 4861字 ⁄ 字号 评论关闭

最近项目中要用到ViewPager,在使用中遇到了几个问题,总结下。

首先ViewPager用的时候有两种写法,在之前发的两个文章中分别介绍了。这里再说下,主要怕自己忘了,呵呵

1,

  1.  protected void onCreate(Bundle savedInstanceState) {  
  2.         super.onCreate(savedInstanceState);  
  3.         setContentView(R.layout.activity_main);  
  4.         ViewGroup group = (ViewGroup)findViewById(R.id.viewGroup);  
  5.         viewPager = (ViewPager) findViewById(R.id.viewPager);  
  6.           
  7.         //载入图片资源ID  
  8.         imgIdArray = new int[]{R.drawable.item01, R.drawable.item02, R.drawable.item03, R.drawable.item04,  
  9.                 R.drawable.item05,R.drawable.item06, R.drawable.item07, R.drawable.item08};  
  10.           
  11.           
  12.         //将点点加入到ViewGroup中  
  13.         tips = new ImageView[imgIdArray.length];  
  14.         for(int i=0; i<tips.length; i++){  
  15.             ImageView imageView = new ImageView(this);  
  16.             imageView.setLayoutParams(new LayoutParams(10,10));  
  17.             tips[i] = imageView;  
  18.             if(i == 0){  
  19.                 tips[i].setBackgroundResource(R.drawable.page_indicator_focused);  
  20.             }else{  
  21.                 tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);  
  22.             }  
  23.               
  24.             LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT,    
  25.                     LayoutParams.WRAP_CONTENT));  
  26.             layoutParams.leftMargin = 5;  
  27.             layoutParams.rightMargin = 5;  
  28.             group.addView(imageView, layoutParams);  
  29.         }  
  30.           
  31.           
  32.         //将图片装载到数组中  
  33.         mImageViews = new ImageView[imgIdArray.length];  
  34.         for(int i=0; i<mImageViews.length; i++){  
  35.             ImageView imageView = new ImageView(this);  
  36.             mImageViews[i] = imageView;  
  37.             imageView.setBackgroundResource(imgIdArray[i]);  
  38.         }  
  39.           
  40.         //设置Adapter  
  41.         viewPager.setAdapter(new MyAdapter());  
  42.         //设置监听,主要是设置点点的背景  
  43.         viewPager.setOnPageChangeListener(this);  
  44.         //设置ViewPager的默认项, 设置为长度的100倍,这样子开始就能往左滑动  
  45.         viewPager.setCurrentItem((mImageViews.length) * 100);  
  46.           
  47.     }  

第一种在onCreate方法中 setContentView(R.layout.activity_main);调用了xml布局,那么viewPager就要在onCreate中去

  1.  viewPager.setAdapter(new MyAdapter());  
  2.         //设置监听,主要是设置点点的背景  
  3.         viewPager.setOnPageChangeListener(this);  
  4.         //设置ViewPager的默认项, 设置为长度的100倍,这样子开始就能往左滑动  
  5.         viewPager.setCurrentItem((mImageViews.length) * 100);  
设置上面红的的代码,这样才能实现左右滑动!
2,
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

f = new File(Environment.getExternalStorageDirectory()+"/fsdnb/");
if(!f.exists()){
f.mkdir();
}

   // 2. 启动线程用于加载远程图片
new LoadImageThread().start();
}
class LoadImageThread extends Thread{
@Override
public void run() {
//3. 获取LayoutInflater,目的是方便后面得到xml布局文件进行装配
LayoutInflater inflater = getLayoutInflater(); 

//4. 创建图片view存储集合
imgViews = new ArrayList<View>();
//5. 通过网络方式下载4个图片,并最终放在集合中
for(int i = 0 ; i < paths.length ; i++){
ImageView iv = new ImageView(NetMainActivity.this);
Bitmap bitmap =
getHttpBitmap(paths[i],String.valueOf(i)+".jpg");
//从网上取图片
iv .setImageBitmap(bitmap);
imgViews.add(iv);
}
//6. 获取main.xml layout对象,他是装配其他图片布局的中心点
//   要记得,它里面声明了一个图片区域ViewPager,以及一个导航指示区域
main = (View)inflater.inflate(R.layout.main,null);

//7. 通过main layout对象获取图片区域ViewPager
viewPager = (ViewPager)main.findViewById(R.id.imagePages);
 

//8. 通过main layout对象获取导航指示区域
pointGroup = (ViewGroup)main.findViewById(R.id.pointGroup);
 


//9. 下面开始控制导航小圆点,有多少张img,就要做多大的小圆点数组
pointViews = new ImageView[imgViews.size()];  

//10. 根据图片集合的长度决定创建多少小圆点ImageView 
for (int i = 0; i < imgViews.size(); i++) {  
           imageView = new ImageView(NetMainActivity.this);  
           imageView.setLayoutParams(new LayoutParams(20,20));  
           imageView.setPadding(20, 0, 20, 0);  
           pointViews[i] = imageView;  
           
           if (i == 0) {  
               //默认选中第一张图片,加入焦点
           
 pointViews[i].setBackgroundResource(R.drawable.page_indicator_focused);  
           } else {  
           
 pointViews[i].setBackgroundResource(R.drawable.page_indicator);  
           }  
           // 把每一个导航小圆点都加入到ViewGroup中
           pointGroup.addView(pointViews[i]);  

       }  

handler.sendEmptyMessage(0); //表示下载完毕.
}
}

public
void handleMessage(Message msg) {

switch (msg.what) {
case 0: {

//11. 设置main布局为当前Activity内容
setContentView(main);
//12. 设置viewPager 图片切换Adapter,图片最终能够切换就是在Adapter中实现的
viewPager.setAdapter(new ViewPagerAdapter());  
//13. 设置viewPager 页面改变监听器,利用监听器改变小圆点焦点状态
viewPager.setOnPageChangeListener(new PointChangeListener()); 

//设置ViewPager的默认项, 设置为长度的100倍,这样子开始就能往左滑动  
       viewPager.setCurrentItem(imgViews.size()*100);  

break;
}
}
};
};

第二种方法,是我的图片远程从服务器下载,这样上来在OnCreat方法里我就调用了线程,但是在线程里不能处理UI,所以在下载完图片后,handle到UI去更新,就有了上面方法2的代码,(方法2的全部代码在http://blog.csdn.net/small5e4444/article/details/13059635)。
总结下,我在做项目的时候发现个问题,就是,我在onCreat方法中必须要加载xml布局,然后用方法2中远程加载图片的方法,handle中就不能像上面那么写了,方法2中的红色标记代码就要都放到handleMessage()方法中,并且删除 viewPager.setCurrentItem(imgViews.size()*100);
这句话才能正常运行。但是删除掉这句话后,就不能实现程序运行后上来就向左侧进行滑屏!
所以我觉得加载图片,要先判断本地有没有,不管有没有都要先加载本地的照片,然后调用远程下载照片,把方法1和方法2结合下运用。我还没有试验呢。。。。呵呵

抱歉!评论已关闭.