安卓第三天---ViewPager控件实现滑动切换图片

先不说那么多,给个图片表示成功!
这是两张图片切换时截的图,不是错误哟!
在这里插入图片描述

首先上布局代码:
mian_activity.xml布局文件(csdn的xml文件显示有问题“<”符号,在不显示的地方我就用“《"代替了,请谅解)

<?xml version="1.0" encoding="utf-8"?>


<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width=“match_parent”
android:layout_height=“match_parent”></android.support.v4.view.ViewPager>
《LinearLayout
android:id="@+id/point_bar"
android:layout_width=“match_parent”
android:layout_height=“40dp”
android:layout_alignParentBottom=“true”
android:layout_marginBottom=“40dp”
android:gravity=“center”
android:orientation=“horizontal”
android:paddingLeft=“3dp”
android:paddingRight=“3dp” >
《/LinearLayout>
《/RelativeLayout>

下面是主界面的代码,主要包含了初始化控件,以及底部条形栏的设置
package com.leaves.autum.viewpagerdemo;

import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

private ViewPager viewPager;
private LinearLayout pointBar;
//把图片放入数据中
int[] imgs = new int[]{R.mipmap.beautiful0, R.mipmap.beautiful1,
        R.mipmap.beautiful2, R.mipmap.beautiful3, R.mipmap.beautiful4,
        R.mipmap.beautiful5, R.mipmap.beautiful6, R.mipmap.beautiful7, R.mipmap.beautiful8};


@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    //初始化控件
    viewPager = findViewById(R.id.view_pager);
    pointBar = findViewById(R.id.point_bar);

    List<View> list = new ArrayList<>();
    //设置ImageView,把图片存入每个ImageView,以便存入list
    for (int i = 0; i < imgs.length; i++) {
        ImageView imageView = new ImageView(this);
        imageView.setImageResource(imgs[i]);
        imageView.setId(imgs[i]);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        list.add(imageView);
    }
    //为viewPager设置适配器
    MyPagerAdapter myPagerAdapter = new MyPagerAdapter(list);
    viewPager.setAdapter(myPagerAdapter);
    //ViewPager配置页面改变监听器
    viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int i, float v, int i1) {
            //页面被滑动时所调用的方法
        }

        @Override
        public void onPageSelected(int i) {
            //页面被选择时调用的方法
            setPointBar(i);
        }

        @Override
        public void onPageScrollStateChanged(int i) {
            //页面滚动状态改变时所调用的方法
        }
    });
    //开始时设置小圆点坐标为第一个,否则在应用只会在调用onseleced()方法时才会出现底部栏
    setPointBar(0);
}

//设置底部圆点栏
private void setPointBar(int position) {
    //首先移除layout内所有的view,以防出bug
    pointBar.removeAllViews();
    for (int i = 0; i < imgs.length; i++) {
        final int n = i;
        final ImageView imageView = new ImageView(getBaseContext());
        //设置imageview
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(20, 20);
        params.setMargins(10, 0, 10, 0);
        imageView.setLayoutParams(params);
        if (position == i) {
            imageView.setImageResource(R.mipmap.green_point);
        } else {
            imageView.setImageResource(R.mipmap.blue_point);
            //为每个小圆点设置点击事件,以便于在点击时能切换图片
            imageView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    //在点击相对应的底部圆点时切换到对应的图片
                    viewPager.setCurrentItem(n);
                }
            });
        }
        pointBar.addView(imageView);
    }
}

}

下面是为ViewPager设置适配器
package com.leaves.autum.viewpagerdemo;

import android.support.annotation.NonNull;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;

import java.util.List;

public class MyPagerAdapter extends PagerAdapter {
private List list;

public MyPagerAdapter(List<View> list) {
    this.list = list;
}

@Ovrride
public int getCount() {
    return list.size();
}

@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object o) {
    return view == o;
}

@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
    View view = list.get(position);
    container.addView(view);
    return view;
}

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

}

然后呢图片的小圆点跟页面显示的图片都是自己配置的,放在mipmap文件夹下,尺寸大小要适配好,否则可能会出现错误
代码可能有点乱,有心者可以自己分离出代码封装成方法.
下面是具体的源码(没办法,系统最低收分为1分):
https://download.csdn.net/download/autumn_leavess/10778081

猜你喜欢

转载自blog.csdn.net/Autumn_leavess/article/details/83960607