Android实现图片轮播效果

本文实例讲述了JaAndroid实现图片轮播效果代码，分享给大家供大家参考。具体如下：
运行效果截图如下：

具体代码如下：

首先看下一下布局文件：

<RelativeLayout 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" tools:context=".MainActivity" > <！-- 广告条的使用 --> <com.xuliugen.viewpager.MyViewPagerTransformerAnim android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="200dp" /> <！-- 广告条下边的文字 --> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignBottom="@id/viewpager" android:background="#33000000" android:orientation="vertical" > <TextViewandroid:id="@+id/image_desc"android:layout_width="match_parent"android:layout_height="wrap_content"android:gravity="center"android:text="@string/app_name"android:textColor="@android:color/white"android:textSize="16sp" /> <LinearLayoutandroid:id="@+id/point_group"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:layout_marginBottom="5dp"android:orientation="horizontal" > </LinearLayout> </LinearLayout></RelativeLayout>

效果很简单，从布局文件中我们看到使用了一个自定义的ViewPager动画，代码如下：

package com.xuliugen.viewpager;import java.util.HashMap;import java.util.Map;import android.content.Context;import android.support.v4.view.ViewPager;import android.util.AttributeSet;import android.view.View;import com.nineoldandroids.view.ViewHelper;/* * 自定义viewpager实现动画切换效果： ** 1、需要拿到当前切换的两个view ** 2、一个动画的梯度值 */public class MyViewPagerTransformerAnim extends ViewPager { private View mLeft; private View mRight; private float mTrans; private float mScale; private static final float MIN_SCALE = 0.6f; private Map<Integer, View> mChildren = new HashMap<Integer, View>（）; /* * 要有两个构造方法 */ public MyViewPagerTransformerAnim（Context context, AttributeSet attrs） { super（context, attrs）; } public MyViewPagerTransformerAnim（Context context） { super（context）; } /* * 设置put的方法 */ public void setViewForPosition（View view, int position） { mChildren.put（position, view）; } /* * remove的方法 */ public void removeViewFromPosition（Integer position） { mChildren.remove（position）; } /** * 重写的方法 */ @Override protected void onPageScrolled（int position, float offset, int offsetPixels） { // Log.e（"TAG", "position =" + position + ",offset = " + offset）; mLeft = mChildren.get（position）; mRight = mChildren.get（position + 1）; animStack（mLeft, mRight, offset, offsetPixels）;// 创建动画效果 super.onPageScrolled（position, offset, offsetPixels）; } private void animStack（View left, View right, float offset, int offsetPixels） { if （right ！= null） {// 从0-1页，offset:0`1mScale = （1 - MIN_SCALE） * offset + MIN_SCALE;mTrans = -getWidth（） - getPageMargin（） + offsetPixels;ViewHelper.setScaleX（right, mScale）;ViewHelper.setScaleY（right, mScale）;ViewHelper.setTranslationX（right, mTrans）; } if （left ！= null） {left.bringToFront（）; } }}

MainActivity.java

package com.xuliugen.viewpager;import java.util.ArrayList;import android.app.Activity;import android.os.Bundle;import android.os.Handler;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.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;public class MainActivity extends Activity { private ViewPager viewPager; private LinearLayout pointGroup; private TextView iamgeDesc; // 图片资源ID private final int[] imageIds = { R.drawable.a, R.drawable.b, R.drawable.c,R.drawable.d, R.drawable.e }; // 图片标题集合 private final String[] imageDescriptions = { "巩俐不低俗，我就不能低俗","扑树又回来啦！再唱经典老歌引万人大合唱", "揭秘北京电影如何升级", "乐视网TV版大派送", "热血屌丝的反杀" }; private ArrayList<ImageView> imageList; /** * 上一个页面的位置 */ protected int lastPosition; @Override protected void onCreate（Bundle savedInstanceState） { super.onCreate（savedInstanceState）; setContentView（R.layout.activity_main）; viewPager = （ViewPager） findViewById（R.id.viewpager）; pointGroup = （LinearLayout） findViewById（R.id.point_group）; iamgeDesc = （TextView） findViewById（R.id.image_desc）; iamgeDesc.setText（imageDescriptions[0]）; imageList = new ArrayList<ImageView>（）; for （int i = 0; i < imageIds.length; i++） {// 初始化图片资源ImageView image = new ImageView（this）;image.setBackgroundResource（imageIds[i]）;imageList.add（image）;// 添加指示点ImageView point = new ImageView（this）;LinearLayout.LayoutParams params = new LinearLayout.LayoutParams（ LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT）;params.rightMargin = 20;point.setLayoutParams（params）;point.setBackgroundResource（R.drawable.point_bg）;if （i == 0） {point.setEnabled（true）;} else {point.setEnabled（false）;}pointGroup.addView（point）; } viewPager.setAdapter（new MyPagerAdapter（））; // viewPager.setCurrentItem（Integer.MAX_VALUE/2 - // （Integer.MAX_VALUE/2%imageList.size（））） ; viewPager.setOnPageChangeListener（new OnPageChangeListener（） {@Override/*** 页面切换后调用 * position 新的页面位置*/public void onPageSelected（int position） {position = position % imageList.size（）;// 设置文字描述内容iamgeDesc.setText（imageDescriptions[position]）;// 改变指示点的状态// 把当前点enbale 为truepointGroup.getChildAt（position）.setEnabled（true）;// 把上一个点设为falsepointGroup.getChildAt（lastPosition）.setEnabled（false）;lastPosition = position;}@Override/*** 页面正在滑动的时候，回调*/public void onPageScrolled（int position, float positionOffset, int positionOffsetPixels） {}@Override/*** 当页面状态发生变化的时候，回调*/public void onPageScrollStateChanged（int state） {} }）; /** 自动循环： 1、定时器：Timer 2、开子线程 while true 循环 3、ColckManager 4、 用handler* 发送延时信息，实现循环*/ isRunning = true; // 设置图片的自动滑动 handler.sendEmptyMessageDelayed（0, 3000）; } /** * 判断是否自动滚动 */ private boolean isRunning = false; private Handler handler = new Handler（） { public void handleMessage（android.os.Message msg） {// 让viewPager 滑动到下一页viewPager.setCurrentItem（viewPager.getCurrentItem（） + 1）;if （isRunning） {handler.sendEmptyMessageDelayed（0, 3000）;} }; }; protected void onDestroy（） { isRunning = false; }; private class MyPagerAdapter extends PagerAdapter { @Override /*** 获得页面的总数*/ public int getCount（） {return Integer.MAX_VALUE; // 使得图片可以循环 } @Override /*** 获得相应位置上的view* container view的容器，其实就是viewpager自身* position 相应的位置*/ public Object instantiateItem（ViewGroup container, int position） {// System.out.println（"instantiateItem ::" + position）;// 给 container 添加一个viewcontainer.addView（imageList.get（position % imageList.size（）））;// 返回一个和该view相对的objectreturn imageList.get（position % imageList.size（））; } @Override /*** 判断 view和object的对应关系 */ public boolean isViewFromObject（View view, Object object） {if （view == object） {return true;} else {return false;} } @Override /*** 销毁对应位置上的object*/ public void destroyItem（ViewGroup container, int position, Object object） {// System.out.println（"destroyItem ::" + position）;container.removeView（（View） object）;object = null; } }}

另外我们看效果图可以看出，效果图下边的几个原点是变化的，所以我们需要一个selector，如下：

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/point_nomal" android:state_enabled="false"/> <item android:drawable="@drawable/point_focured" android:state_enabled="true"/></selector>

希望本文所述对大家学习Android软件编程有所帮助。