js轮播图片小圆点变化_实现图片轮播，并且带圆点 ，轮播时 圆点改变颜色；...

package com.example.day14;

import java.util.ArrayList;

import java.util.Timer;

import java.util.TimerTask;

import com.lidroid.xutils.BitmapUtils;

import android.os.Bundle;

import android.os.Handler;

import android.app.Activity;

import android.support.v4.view.PagerAdapter;

import android.support.v4.view.ViewPager;

import android.view.LayoutInflater;

import android.view.Menu;

import android.view.View;

import android.view.ViewGroup;

import android.widget.ImageView;

import android.widget.ImageView.ScaleType;

import android.widget.LinearLayout;

public class MainActivity extends Activity {

int count = 0;

int olddotindex = 0;

//图片数据

private String[] image_url = new String[]{

"http://pic8.nipic.com/20100701/5290458_114840036316_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"};

Handler handler=new Handler(){

public void handleMessage(android.os.Message msg) {

pager.setCurrentItem(count);

dots.get(olddotindex).setBackgroundResource(R.drawable.dot_nomal);

dots.get(count).setBackgroundResource(R.drawable.dot_focus);

olddotindex=count;

};

};

private ArrayList dots;

private LinearLayout la;

private ArrayList images;

private ViewPager pager;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

init();

}

private void init() {

// TODO Auto-generated method stub

pager = (ViewPager) findViewById(R.id.viewpager);

la = (LinearLayout) findViewById(R.id.yuandian);

//获得网络图片，配置给Veiwpager

getImageViewList();

//获得圆点

getDotList();

//设置第一个圆点为选中状态

dots.get(0).setBackgroundResource(R.drawable.dot_focus);

pager.setAdapter(new myvpAdapter());

//通过定时器，制作自动划动效果

Timer timer=new Timer();

timer.schedule(new TimerTask() {

@Override

public void run() {

// TODO Auto-generated method stub

count++;

if (count==4) {

count=0;

}

handler.sendEmptyMessage(count);

}

}, 3000, 2000);

}

//获得圆点

private void getDotList() {

dots = new ArrayList();

//循环图片数组，创建对应数量的dot

for (int i = 0; i < image_url.length; i++) {

View view=LayoutInflater.from(this).inflate(R.layout.dot, null);//加载布局；

//得到布局中的dot点组件

View dot=view.findViewById(R.id.dotview);

//收集dot;

dots.add(dot);

//把布局添加到线性布局

la.addView(view);

}

}

//获得网络图片，配置给Veiwpager

private void getImageViewList() {

images = new ArrayList();

BitmapUtils bitmapUtils=new BitmapUtils(this);

//加载图片；

for (int i = 0; i < image_url.length; i++) {

ImageView imageView=new ImageView(this);

imageView.setScaleType(ScaleType.FIT_XY);

bitmapUtils.display(imageView, image_url[i]);

images.add(imageView);

}

}

class myvpAdapter extends PagerAdapter{

@Override

public int getCount() {

// TODO Auto-generated method stub

return images.size();

}

@Override

public boolean isViewFromObject(View arg0, Object arg1) {

// TODO Auto-generated method stub

return arg0==arg1;

}

@Override

public void destroyItem(ViewGroup container, int position, Object object) {

// TODO Auto-generated method stub

ImageView im=images.get(position);

container.removeView(im);

}

@Override

public Object instantiateItem(ViewGroup container, int position) {

// TODO Auto-generated method stub

container.addView(images.get(position));

return images.get(position);

}

}

}

在res下建立一个drawable文件夹；

在drawable里面创建2个xml文件;

一个是dot_focus.xml;

一个是dot_nomal.xml;

acitivity_main.xml里的布局；

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity" >

android:id="@+id/viewpager"

android:layout_width="match_parent"

android:layout_height="match_parent"

/>

android:id="@+id/yuandian"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:gravity="center"

android:layout_alignParentBottom="true"

>

在layout里面建一个dot.xml;

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical" >

android:id="@+id/dotview"

android:layout_width="8dp"

android:layout_height="8dp"

android:layout_margin="10dp"

android:background="@drawable/dot_nomal"

/>