Android---------使用ViewPager无线轮播获得接口的图片(小圆点无线轮播图片)

1.页面布局(先是定义一个viewpager,下面定义五个imageview小圆点)

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.viewpagerdemo.MainActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="20dp"
        android:gravity="center"
        >
     <ImageView
         android:id="@+id/point1"
         android:tag="0"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginRight="5dp"

         />
        <ImageView
            android:id="@+id/point2"
            android:tag="1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dp"

            />
        <ImageView
            android:id="@+id/point3"
            android:tag="2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dp"

            />
        <ImageView
            android:id="@+id/point4"
            android:tag="3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dp"

            />
        <ImageView
            android:id="@+id/point5"
            android:tag="4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dp"

            />
    </LinearLayout>
</RelativeLayout>

 注意:把选中状态的小圆点和未选中状态的小圆点复制到工程中

2.主界面
//无线轮播加载网络图片
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
   // private int [] imageId ={R.drawable.a1,R.drawable.a2,R.drawable.a3,
          //  R.drawable.a4,R.drawable.a5};
    //定义一个有图片接口的数组
    private String [] images={"http://l2.51fanli.net//tuan//images//1//5806eac956808.jpg",
            "http://l2.51fanli.net//tuan//images//b//580991bb30560.jpg",
            "http://l0.51fanli.net//tuan//images//b//58115f2593dc3.jpg",
            "http://l2.51fanli.net//tuan//images//0//57923840b054d.jpg",
            "http://l2.51fanli.net//tuan//images//e//58101e11ab164.jpg"};
    private ImageView [] points;
    private ViewPager mViewPager;
    private ImagesAdapter mAdapter;
    //定义点的位置坐标
    private int indexPoint = 0;
    private Handler mHandler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            //点所在的位置为当前展示的页面
            mViewPager.setCurrentItem(indexPoint);
            indexPoint++;
            //对点的坐标取模,不会超过4(0-4)
            indexPoint=indexPoint%images.length;
           send();
        }
    };
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initView();
        //定义一个存放五个点的数组,并找到他们的ID
        points=new ImageView[5];
        points[0]=(ImageView)findViewById(R.id.point1);
        points[1]=(ImageView)findViewById(R.id.point2);
        points[2]=(ImageView)findViewById(R.id.point3);
        points[3]=(ImageView)findViewById(R.id.point4);
        points[4]=(ImageView)findViewById(R.id.point5);
        //遍历五个点然后给每个点设置点击事件
        for(ImageView image:points){
            image.setOnClickListener(this);
        }
        //调用更新点的方法
        updatePoint(indexPoint);
        send();
    }
    //更新点的方法
    private void updatePoint(int position) {
        //先把所有点初始化原来的样式
        for(ImageView image:points){
            image.setImageResource(R.drawable.nor);
        }
        //点所在的位置设置为选中的样式
        points[position].setImageResource(R.drawable.sel);
    }

    //圆点的点击事件(点击某个点会跳转到对应的页面)
    @Override
    public void onClick(View v) {
        mHandler.removeCallbacksAndMessages(null);
        int index =Integer.valueOf( v.getTag().toString());
        mViewPager.setCurrentItem(index,false);
        indexPoint=index+1;
        send();
    }

    public void send(){
        new Thread(){
            @Override
            public void run() {
                //无线轮播点与点间隔时间为2秒,发送到主线程
                mHandler.sendEmptyMessageDelayed(indexPoint,2000);
            }
        }.start();
    }


    private void initView() {
        mViewPager=(ViewPager)findViewById(R.id.viewpager);
        //给viewpager设置适配器
        mAdapter=new ImagesAdapter();
        mViewPager.setAdapter(mAdapter);
        //viewpager的页面监听
        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                updatePoint(position);
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }

    //内部类 ImagesAdapter(适配器)
    class ImagesAdapter extends PagerAdapter{

        @Override
        public int getCount() {

            return images.length;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {

            return view==object;
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            ImageView imageView=new ImageView(MainActivity.this);
//            imageView.setImageResource(imageIds[position]);

            //加载图片
            Glide.with(MainActivity.this)
                    .load(images[position])
                    .placeholder(R.drawable.nor)
                    .into(imageView);
            container.addView(imageView);
            return imageView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((View) object);
        }
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        mHandler.removeCallbacksAndMessages(null);
    }


}



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值