图片轮播和小圆点

ViewPager图片自动轮播加原点

 

Layout_Xml

activity_main.xml

<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" >

        <android.support.v4.view.ViewPager
            android:id="@+id/vp"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            />
        <LinearLayout 
            android:id="@+id/dotcontaint"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:layout_alignParentBottom="true"
            />
            
          
</RelativeLayout>

dot_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <View 
        android:id="@+id/dotView"
        android:layout_width="8dp"
        android:layout_height="8dp"
        android:layout_margin="10dp"
        android:background="@drawable/dot_nomal"
        />

</LinearLayout>

drawable_xml

dot_focus.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#ff0000"/>
    <corners android:radius="8dip"/>

</shape>

dot_nomal.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="#ffffff"/>
    <corners android:radius="8dip"/>

</shape>

MainActivity.java

package com.ch.day14_viewpagershape;

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 {
    private ViewPager vp;
    private LinearLayout dotcontaint;
    ArrayList<ImageView> imgs ;
    ArrayList<View> dots ;
    
    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 h = new Handler(){
        public void handleMessage(android.os.Message msg) {
            vp.setCurrentItem(count);//设置此次要显示的pager
            //切换选中的圆点
            dots.get(olddotindex).setBackgroundResource(R.drawable.dot_nomal);//设置上次选中的圆点为不选中
            dots.get(count).setBackgroundResource(R.drawable.dot_focus);//设置当前选中的圆点为选中
            olddotindex = count;
            
        };
    };
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        init();
    }
    
    public void init(){
        vp = (ViewPager) findViewById(R.id.vp);
        dotcontaint = (LinearLayout) findViewById(R.id.dotcontaint);
        
        //获得网络图片，配置给Veiwpager
        getImageViewList();
        //获得圆点
        getDotList();
        //设置第一个圆点为选中状态
        dots.get(0).setBackgroundResource(R.drawable.dot_focus);
        vp.setAdapter(new MyVpAdapger());//配置pager页
        //通过定时器，制作自动划动效果
        Timer timer = new Timer();
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                count++;//下一个页
                if(count == 4){
                    count = 0;
                }
                h.sendEmptyMessage(0x123);//在此线程中，不能操作ui主线程
            }
        }, 3000, 2000);
        
    }
    
    private void getDotList() {
        // TODO Auto-generated method stub
        dots = new ArrayList<View>();
        //循环图片数组，创建对应数量的dot
        for(int i=0;i<image_url.length;i++){
            View view = LayoutInflater.from(this).inflate(R.layout.dot_layout, null);//加载布局
            View dot = view.findViewById(R.id.dotView);//得到布局中的dot点组件
            //收集dot
            dots.add(dot);
            //把布局添加到线性布局
            dotcontaint.addView(view);
        }
        
    }

    class MyVpAdapger extends PagerAdapter{

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return imgs.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
//            super.destroyItem(container, position, object);
            ImageView img = imgs.get(position);
            container.removeView(img);
        }
        
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            // TODO Auto-generated method stub
            container.addView(imgs.get(position));
            return imgs.get(position);
        }
        
    }

    /**
     * 到网络获得图片信息，并赋值到ImageView中
     */
    private void getImageViewList() {
        // TODO Auto-generated method stub
        imgs = new ArrayList<ImageView>();
        BitmapUtils btUtil = new BitmapUtils(this);
        //加载图片
        for(int i=0;i<image_url.length;i++){
            ImageView img = new ImageView(this);
            img.setScaleType(ScaleType.FIT_XY);
            
            btUtil.display(img, image_url[i]);
            imgs.add(img);
        }
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }

}

 修改后的MainActivity页面（专业）

package com.ch.day14_viewpagershape;

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 {
    private ViewPager vp;
    private LinearLayout dotcontaint;
    ArrayList<ImageView> imgs ;
    ArrayList<View> dots ;
    
    int currentIndex = 0;
    int olderIndex = 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 h = new Handler(){
        public void handleMessage(android.os.Message msg) {
            vp.setCurrentItem(currentIndex);//设置此次要显示的pager
            //切换选中的圆点
            dots.get(olderIndex).setBackgroundResource(R.drawable.dot_nomal);//设置上次选中的圆点为不选中
            dots.get(currentIndex%image_url.length).setBackgroundResource(R.drawable.dot_focus);//设置当前选中的圆点为选中
            olderIndex = currentIndex%image_url.length;
            
        };
    };
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        init();
    }
    
    public void init(){
        vp = (ViewPager) findViewById(R.id.vp);
        dotcontaint = (LinearLayout) findViewById(R.id.dotcontaint);
        
        //获得网络图片，配置给Veiwpager
        getImageViewList();
        //获得圆点
        getDotList();
        //设置第一个圆点为选中状态
        dots.get(0).setBackgroundResource(R.drawable.dot_focus);
        vp.setAdapter(new MyVpAdapger());//配置pager页
        int currentItem = Integer.MAX_VALUE/2-Integer.MAX_VALUE/2%image_url.length;
        vp.setCurrentItem(currentItem);
        //通过定时器，制作自动划动效果
        Timer timer = new Timer();
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                currentIndex = vp.getCurrentItem()+1;//下一个页
            
                h.sendEmptyMessage(0x123);//在此线程中，不能操作ui主线程
            }
        }, 3000, 2000);
        
    }
    
    private void getDotList() {
        // TODO Auto-generated method stub
        dots = new ArrayList<View>();
        //循环图片数组，创建对应数量的dot
        for(int i=0;i<image_url.length;i++){
            View view = LayoutInflater.from(this).inflate(R.layout.dot_layout, null);//加载布局
            View dot = view.findViewById(R.id.dotView);//得到布局中的dot点组件
            //收集dot
            dots.add(dot);
            //把布局添加到线性布局
            dotcontaint.addView(view);
        }
        
    }

    class MyVpAdapger extends PagerAdapter{

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return Integer.MAX_VALUE;
        }

        @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
//            super.destroyItem(container, position, object);
//            ImageView img = imgs.get(position);
            container.removeView((View)object);
        }
        
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            // TODO Auto-generated method stub
            int item = position%image_url.length;
            container.addView(imgs.get(item));
            return imgs.get(item);
        }
        
    }

    /**
     * 到网络获得图片信息，并赋值到ImageView中
     */
    private void getImageViewList() {
        // TODO Auto-generated method stub
        imgs = new ArrayList<ImageView>();
        BitmapUtils btUtil = new BitmapUtils(this);
        //加载图片
        for(int i=0;i<image_url.length;i++){
            ImageView img = new ImageView(this);
            img.setScaleType(ScaleType.FIT_XY);
            
            btUtil.display(img, image_url[i]);
            imgs.add(img);
        }
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }

}