android效果图之轮播

布局文件:viewpage.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"
    >


<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="130dp">
    <android.support.v4.view.ViewPager
        android:id="@+id/vp_home_viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    android.support.v4.view.ViewPager>
    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="20dp" >
        <LinearLayout
            android:id="@+id/ll"
            android:orientation="horizontal"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content">
        LinearLayout>
        <ImageView
            android:id="@+id/iv"
            android:src="@drawable/circle_bg"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"/>
    RelativeLayout>
RelativeLayout>

LinearLayout>

资源文件:circle.xml

xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <size android:width="10dp"
        android:height="10dp"/>
    <solid
        android:color="#c0c0c0"/>

shape>
资源文件:circle_bg

xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval" >
    <size
        android:width="10dp"
        android:height="10dp"/>

    <solid
        android:color="#ff0000"/>

shape>

实现类:ViewPageActivity.class

public class ViewPageActivity extends Activity implements View.OnClickListener{
	
private ViewPager vp_home_viewpager;
private LinearLayout ll;
private ImageView iv;
//每次圆点移动的位移
private int move;
//图片资源
private int[] image =new int[]{R.mipmap.ic_launcher,R.mipmap.ic_launcher,
        R.mipmap.ic_launcher,R.mipmap.ic_launcher,R.mipmap.ic_launcher};
private List imagelist;
//判断是否需要自动播放
private boolean running = true;
//实现自动播放
private Handler handler = new Handler(){
    //每隔5秒自动实现vp_home_viewpagerposition1
    public void handleMessage(Message msg) {
        vp_home_viewpager.setCurrentItem(vp_home_viewpager.getCurrentItem()+1);
        System.out.println(vp_home_viewpager.getCurrentItem());
        if(running){
            handler.sendEmptyMessageDelayed(0, 3000);
        }
    };
};
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.viewpage);
		
//handler.sendEmptyMessage(1);
    for(int i = 0; i < image.length; i ++){
        ImageView imageView = new ImageView(getActivity());
        imageView.setImageResource(image[i]);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        imagelist.add(imageView);
        //根据图片的个数去放置相应数量的圆点3
        ImageView imageView2 = new ImageView(getActivity());
        imageView2.setImageResource(R.drawable.circle);
        //因为没有直接改变margin的方法,所以这里使用的LayoutParams来改变leftMargin
        LinearLayout.LayoutParams  layoutParams = new LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
        if(i > 0){
            layoutParams.leftMargin = 20;
        }
        imageView2.setLayoutParams(layoutParams);

        ll.addView(imageView2);
    }

    //布局加载完成节后运行
    iv.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {

        @Override
        public void onGlobalLayout() {
            // TODO Auto-generated method stub
            //内部子空间的距离获取
            move = ll.getChildAt(1).getLeft()-ll.getChildAt(0).getLeft();
        }
    });
    //添加监听时间
    vp_home_viewpager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {


        @Override
        public void onPageSelected(int arg0) {
            // TODO Auto-generated method stub

        }


        //滑动界面触发,这里控制标记点的改变就可以了
        //position第几幅图,offset滑动百分比
        @Override
        public void onPageScrolled(int position, float offset, int arg2) {
            // TODO Auto-generated method stub
            System.out.println(position);
            RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams)iv.getLayoutParams();
            if((position+1)%image.length != 0)
                layoutParams.leftMargin = (int)((position%image.length)*move+offset*move);
            iv.setLayoutParams(layoutParams);
        }

        @Override
        public void onPageScrollStateChanged(int arg0) {
            // TODO Auto-generated method stub

        }
    });


}

//添加适配器
//vp.setPageTransformer(true, arg1);
vp_home_viewpager.setAdapter(new PagerAdapter() {

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        // TODO Auto-generated method stub

        container.addView(imagelist.get((position+image.length)%(image.length)));
        //返回滑动到的图片
        return imagelist.get((position+image.length)%(image.length));
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        // TODO Auto-generated method stub
        //移除一张前图片
        container.removeView(imagelist.get((position+image.length)%(image.length)));
    }

    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {
        // TODO Auto-generated method stub
        return arg0 == arg1;
    }
    //使得ViewPager可以无限移动,设置边界为Integer.MAX_VALUE
    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return Integer.MAX_VALUE;
    }
});

//插入切换样式,这个随便一个地方拷贝一份即可,可以到官方拷贝
vp_home_viewpager.setPageTransformer(true, new ViewPager.PageTransformer() {
    @Override
    public void transformPage(View page, float position) {
        if(position<-1){

        } else if(position<=0){
            //第一个页面的变化【0-1            page.setPivotX(view.getMeasuredWidth());
            page.setPivotY(0);
            page.setScaleX(1+position);
        } else if(position<=1){
            //第二个页面的变化【1,0            page.setScaleX(0);
            page.setPivotX(0);
            page.setScaleX(1-position);
        } else {

        }
    }
});

handler.sendEmptyMessageDelayed(0, 3000);
}
}



你可能感兴趣的:(android效果图之轮播)