欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android 利用ViewPager实现图片可以左右循环滑动效果附代码下载

程序员文章站 2023-12-16 11:47:22
首先给大家展示靓照,对效果图感兴趣的朋友可以继续往下阅读哦。 viewpager这个小demo实现的是可以左右循环滑动图片,下面带索引,滑到最后一页在往右滑动就要第一...

首先给大家展示靓照,对效果图感兴趣的朋友可以继续往下阅读哦。

Android 利用ViewPager实现图片可以左右循环滑动效果附代码下载

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

 1.    首先看一些layout下的xml

<framelayout xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent" 
 android:orientation="vertical" > 
 <android.support.v4.view.viewpager 
 android:id="@+id/viewpager" 
 android:layout_width="fill_parent" 
 android:layout_height="wrap_content" /> 
 <relativelayout 
 android:layout_width="fill_parent" 
 android:layout_height="wrap_content" 
 android:orientation="vertical" > 
 <linearlayout 
 android:id="@+id/viewgroup" 
 android:layout_width="fill_parent" 
 android:layout_height="wrap_content" 
 android:layout_alignparentbottom="true" 
 android:layout_marginbottom="30dp" 
 android:gravity="center_horizontal" 
 android:orientation="horizontal" > 
 </linearlayout> 
 </relativelayout> 
</framelayout> 

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

package com.example.viewpagerdemo; 
import android.app.activity; 
import android.os.bundle; 
import android.support.v4.view.pageradapter; 
import android.support.v4.view.viewpager; 
import android.support.v4.view.viewpager.onpagechangelistener; 
import android.view.view; 
import android.view.viewgroup; 
import android.view.viewgroup.layoutparams; 
import android.widget.imageview; 
import android.widget.linearlayout; 
public class twoactivity extends activity implements onpagechangelistener{ 
 /** 
 * viewpager 
 */ 
 private viewpager viewpager; 
 /** 
 * 装点点的imageview数组 
 */ 
 private imageview[] tips; 
 /** 
 * 装imageview数组 
 */ 
 private imageview[] mimageviews; 
 /** 
 * 图片资源id 
 */ 
 private int[] imgidarray ; 
 @override 
 protected void oncreate(bundle savedinstancestate) { 
 super.oncreate(savedinstancestate); 
 setcontentview(r.layout.activity_main); 
 viewgroup group = (viewgroup)findviewbyid(r.id.viewgroup); 
 viewpager = (viewpager) findviewbyid(r.id.viewpager); 
 //载入图片资源id 
 imgidarray = new int[]{r.drawable.item01, r.drawable.item02, r.drawable.item03, r.drawable.item04, 
 r.drawable.item05,r.drawable.item06, r.drawable.item07, r.drawable.item08}; 
 //将点点加入到viewgroup中 
 tips = new imageview[imgidarray.length]; 
 for(int i=0; i<tips.length; i++){ 
 imageview imageview = new imageview(this); 
 imageview.setlayoutparams(new layoutparams(10,10)); 
 tips[i] = imageview; 
 if(i == 0){ 
 tips[i].setbackgroundresource(r.drawable.page_indicator_focused); 
 }else{ 
 tips[i].setbackgroundresource(r.drawable.page_indicator_unfocused); 
 } 
 linearlayout.layoutparams layoutparams = new linearlayout.layoutparams(new viewgroup.layoutparams(layoutparams.wrap_content, 
  layoutparams.wrap_content)); 
 layoutparams.leftmargin = 5; 
 layoutparams.rightmargin = 5; 
 group.addview(imageview, layoutparams); 
 } 
 //将图片装载到数组中 
 mimageviews = new imageview[imgidarray.length]; 
 for(int i=0; i<mimageviews.length; i++){ 
 imageview imageview = new imageview(this); 
 mimageviews[i] = imageview; 
 imageview.setbackgroundresource(imgidarray[i]); 
 } 
 //设置adapter 
 viewpager.setadapter(new myadapter()); 
 //设置监听,主要是设置点点的背景 
 viewpager.setonpagechangelistener(this); 
 //设置viewpager的默认项, 设置为长度的100倍,这样子开始就能往左滑动 
 viewpager.setcurrentitem((mimageviews.length) * 100); 
 } 
 /** 
 * 
 * @author xiaanming 
 * 
 */ 
 public class myadapter extends pageradapter{ 
 @override 
 public int getcount() { 
 return integer.max_value; 
 } 
 @override 
 public boolean isviewfromobject(view arg0, object arg1) { 
 return arg0 == arg1; 
 } 
 @override 
 public void destroyitem(view container, int position, object object) { 
 ((viewpager)container).removeview(mimageviews[position % mimageviews.length]); 
 } 
 /** 
 * 载入图片进去,用当前的position 除以 图片数组长度取余数是关键 
 */ 
 @override 
 public object instantiateitem(view container, int position) { 
 ((viewpager)container).addview(mimageviews[position % mimageviews.length], 0); 
 return mimageviews[position % mimageviews.length]; 
 } 
 } 
 @override 
 public void onpagescrollstatechanged(int arg0) { 
 } 
 @override 
 public void onpagescrolled(int arg0, float arg1, int arg2) { 
 } 
 @override 
 public void onpageselected(int arg0) { 
 setimagebackground(arg0 % mimageviews.length); 
 } 
 /** 
 * 设置选中的tip的背景 
 * @param selectitems 
 */ 
 private void setimagebackground(int selectitems){ 
 for(int i=0; i<tips.length; i++){ 
 if(i == selectitems){ 
 tips[i].setbackgroundresource(r.drawable.page_indicator_focused); 
 }else{ 
 tips[i].setbackgroundresource(r.drawable.page_indicator_unfocused); 
 } 
 } 
 } 
} 

喜欢的朋友直接下载代码哦。代码下载

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

destroyitem(view container, int position, object object)方法中不removeview

 @override 
 public void destroyitem(view container, int position, object object) { 
// ((viewpager)container).removeview(mimageviews[position % mimageviews.length]); 
 } 
instantiateitem(view container, int position)增加异常扑捉
[java] view plaincopy在code上查看代码片派生到我的代码片
@override 
 public object instantiateitem(view container, int position) { 
 try { 
 ((viewpager)container).addview(mimageviews[position % mimageviews.length], 0); 
 }catch(exception e){ 
 //handler something 
 } 
 return mimageviews[position % mimageviews.length]; 
 } 

以上代码给大家展示了android 利用viewpager实现图片可以左右循环滑动效果,希望大家喜欢。

上一篇:

下一篇: