Viewpager实现图片轮播
//-------------主布局文件-------------------------------------
<LinearLayout 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"
android:orientation="vertical" >
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="200dp">
<android.support.v4.view.ViewPager
android:layout_width="fill_parent"
android:layout_height="200dp"
android:id="@+id/vp_viewpager"></android.support.v4.view.ViewPager>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="@+id/ll_dot"
android:gravity="center"
android:layout_alignBottom="@+id/vp_viewpager"></LinearLayout>
</RelativeLayout>
</LinearLayout>
//---------------在res下新建一个drawable文件夹，在文件夹下创建XML文件 选中shape-----分别为dot_focuse.xml 和 dot_normal.xml-------------------------------
//-------------dot_focuse.xml 中-----------------------------
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="9dp"/>
<solid android:color="#fff"/>
</shape>
//-----------------dot_normal.xml 中------------------------
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="9dp"/>
<solid android:color="#88000000"/>
</shape>
//--------------------创建一个适配器类------------------------
package com.example.tuisong;
import java.util.List;
import com.nostra13.universalimageloader.core.DisplayImageOptions;
import com.nostra13.universalimageloader.core.ImageLoader;
import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;
import android.content.Context;
import android.os.Handler;
import android.support.v4.view.PagerAdapter;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
public class MyPagerAdapter extends PagerAdapter{
private List<ImageView> viewlist;
private Context context;
private Handler handler;
public MyPagerAdapter(List<ImageView> viewlist, Context context,
Handler handler) {
super();
this.viewlist = viewlist;
this.context = context;
this.handler = handler;
}
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0==arg1;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
//通过控件集合获取imageView 添加到容器中，并作为key 返回
ImageView imageView=viewlist.get(position%viewlist.size());
imageView.setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
// 当按下的时候，停止轮播
case MotionEvent.ACTION_DOWN:
// 移除所有的回调和消息
handler.removeCallbacksAndMessages(null);
break;
//抬起
case MotionEvent.ACTION_UP:
handler.sendEmptyMessageDelayed(0, 2000);
break;
// 取消的时候，继续开始录播
case MotionEvent.ACTION_CANCEL:
handler.sendEmptyMessageDelayed(0, 2000);
break;
default:
break;
}
//触摸事件不被消费，true 消费该触摸事件
return true;
}
});
//添加view
container.addView(imageView);
//设置图片显示整个布局
imageView.setScaleType(ScaleType.FIT_XY);
//返回Imageview
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
//移除当前view
container.removeView((View) object);
}
}
//-----------------主activity中-----------------------------------------------
package com.example.tuisong;
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.ArrayList;
import java.util.List;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import com.lidroid.xutils.BitmapUtils;
import com.nostra13.universalimageloader.core.DisplayImageOptions;
import com.nostra13.universalimageloader.core.ImageLoader;
import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.app.Activity;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.Log;
import android.view.Menu;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
public class MainActivity extends Activity {
private String[] imageUrls = new String[] {
"http://pic8.nipic.com/20100701/5290458_114840036316_2.jpg",
"http://pic2.nipic.com/20090424/1468853_230119053_2.jpg",
"http://img3.3lian.com/2013/s1/20/d/57.jpg",
"http://pic39.nipic.com/20140226/18071023_164300608000_2.jpg",
"http://a0.att.hudong.com/15/08/300218769736132194086202411_950.jpg" };
private List<ImageView> viewList;//轮播图片的集合
private List<ImageView> dotList;//小圆点的集合
private ViewPager vp_viewpager;
private LinearLayout ll_dot;
private Handler handler=new Handler(){
public void handleMessage(android.os.Message msg) {
switch (msg.what) {
case 0:
// 先去获取到当前条目索引
int currentItem=vp_viewpager.getCurrentItem();
// 条目索引+1
currentItem++;
// 条目索引+1
vp_viewpager.setCurrentItem(currentItem);
// 条目索引+1,调用发送延迟消息的方法
sendDelayMessage();
break;
default:
break;
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//找到控件viewpager
vp_viewpager = (ViewPager) findViewById(R.id.vp_viewpager);
//找到控件Linearlayoout
ll_dot = (LinearLayout) findViewById(R.id.ll_dot);
// 初始化图片
initViewList();
// 初始化小圆点
initDots();
//设置适配器
MyPagerAdapter adapter=new MyPagerAdapter(viewList, this, handler);
vp_viewpager.setAdapter(adapter);
// 设置初始的展示条目
vp_viewpager.setCurrentItem(viewList.size()*1000000);
// 设置延时切换
sendDelayMessage();
// 监听viewPager的一个滑动事件
vp_viewpager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int arg0) {
// 遍历小点的集合
for (int i = 0; i < dotList.size(); i++) {
// 如果当前的索引值和i相等
if (arg0%dotList.size()==i) {
// 设置小点为亮色
dotList.get(i).setImageResource(R.drawable.dot_focuse);
}else{
// 否则暗色
dotList.get(i).setImageResource(R.drawable.dot_normal);
}
}
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
});
}
//----------------------
//发送延迟消息
private void sendDelayMessage() {
handler.sendEmptyMessageDelayed(0, 2000);
}
// 初始化小圆点
private void initDots() {
// 创建一个装小点控件的集合
dotList=new ArrayList<ImageView>();
dotList.clear();
for (int i = 0; i < imageUrls.length; i++) {
ImageView imageView=new ImageView(this);
if (i==0) {
// 如果是第一张，默认给一个亮的小点
imageView.setImageResource(R.drawable.dot_focuse);
}else{
// 如果不是滴一个，默认给一个暗的小点
imageView.setImageResource(R.drawable.dot_normal);
}
// 设置小点的默认宽高为20dp 宽、高
LayoutParams params=new LayoutParams(10, 10);
// 设置小点的间距 左 、上、右、下
params.setMargins(5, 0, 5, 0);
ll_dot.addView(imageView,params);
// 往小点集合中添加view
dotList.add(imageView);
}
}
/*// 初始化图片 使用的是第三方的xuitls，需要导入xuitlsjar包
private void initViewList() {
// 先使用xutils的工具
BitmapUtils bitmapUtils=new BitmapUtils(this);
viewList=new ArrayList<ImageView>();
for (int i = 0; i < imageUrls.length; i++) {
// 创建imageView 并通过工具类将图片设置到控件上
ImageView imageView=new ImageView(this);
bitmapUtils.display(imageView, imageUrls[i]);
viewList.add(imageView);
}
}*/
// 初始化图片,使用的是第三方的ImageLoader，需要导入ImageLoader.jar包
private void initViewList() {
viewList=new ArrayList<ImageView>();
for (int i = 0; i < imageUrls.length; i++) {
// 创建imageView 并通过工具类将图片设置到控件上
ImageView imageView=new ImageView(this);
ImageLoader.getInstance().init(
ImageLoaderConfiguration.createDefault(this));
DisplayImageOptions options = new DisplayImageOptions.Builder()
.cacheInMemory(true).cacheOnDisk(true).build();
ImageLoader.getInstance().displayImage(
imageUrls[i], imageView, options);
viewList.add(imageView);
}
}
}
