屏幕快照 2019-12-02 下午9.22.43.png
屏幕快照 2019-12-02 下午9.24.02.png
第一步：定义布局
这里的viewpage可以是轮播的布局，而LinearLayout是小白点的容器、外层采用相对布局来包裹，
<androidx.viewpager.widget.ViewPager
android:id="@+id/vp_food_guide"
android:layout_width="match_parent"
android:layout_height="200dp">
</androidx.viewpager.widget.ViewPager>
<LinearLayout
android:id="@+id/ll_food_carousel"
android:layout_width="match_parent"
android:layout_height="20dp"
android:gravity="center"
android:layout_alignBottom="@id/vp_food_guide"
>
</LinearLayout>
第二步：实现轮播的手动
1.初始化轮播图的数据
//这个集合用于装轮播图（Imageview）
mImageViewList = new ArrayList<>();
ImageView point;
//用于确定小圆点的格式 位置
LinearLayout.LayoutParams layoutParams;
// images是图片数组，图片数组的大小决定存储imageview集合的大小
for(int i = 0;i < images.length; i++){
ImageView imageView = new ImageView(getContext());
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
imageView.setImageResource(images[i]);
mImageViewList.add(imageView);
point = new ImageView(getContext());
//圆点的背景为一个指示器，根据可不可以点击显示不一样
point.setBackgroundResource(R.drawable.selector_food_carousel);
layoutParams = new LinearLayout.LayoutParams(35,35);
//leftMargin是小圆点之间的间距
if(i != 0){
layoutParams.leftMargin = 15;
//使小圆点不能接收触摸事件或点击
point.setEnabled(false);
}
ll_food_carousel.addView(point,layoutParams);
}
圆点指示器：selector_food_carousel：
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="false" android:drawable="@drawable/shape_point_gray"/>
<item android:state_enabled="true" android:drawable="@drawable/shape_bg_enable"/>
</selector>
2.定义一个pagerAdapter的子类，实现里面的四个方法
// 轮播适配器
class FoodCarouselAdapter extends PagerAdapter{
// 轮播的数量 ，为啥取这么大的数值呢，主要是因为自动轮播时会用到
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
//复用的条件
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object o) {
return view == o;
}
// 得到item布局
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
//主要这里的item采用取余的方式来得到，因为我们的getCount（）数值很大，但是轮播的图片就几张，不采用取余的方式的话就会下标越界，其中mImageViewList是存储轮播图片的集合
ImageView imageView = mImageViewList.get(position%mImageViewList.size());
container.addView(imageView);
return imageView;
}
//销毁布局
@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
container.removeView((View) object);
}
}
3.为viewpager设置适配器 、为轮播图设置监听，使小圆点跟随轮播图变化
vp_food_guide.setAdapter(new FoodCarouselAdapter());
//设置监听
vp_food_guide.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int i, float v, int i1) {
}
//其中beforepoint初始值为0或我们实现自动轮播时设置的值，这里主要通过改变圆点的状态来实现圆点变化的效果
@Override
public void onPageSelected(int i) {
int newPosition = i % mImageViewList.size();
ll_food_carousel.getChildAt(beforepoint).setEnabled(false);
ll_food_carousel.getChildAt(newPosition).setEnabled(true);
beforepoint = newPosition;
}
@Override
public void onPageScrollStateChanged(int i) {
}
});
这时候轮播已经可以手动轮播了
第三步：实现自动轮播,
思想：主要通过handler发送延迟消息来实现每隔几秒轮播一次
1.定义一个Handler的子类，实现handMessage方法
class myHandler extends Handler{
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
vp_food_guide.setCurrentItem(vp_food_guide.getCurrentItem() + 1);
mMyHandler.sendEmptyMessageDelayed(0,2000);
}
}
2.设置viewpage的位置，生成handler对象，发送延时消息
vp_food_guide.setCurrentItem(5000000);
mMyHandler = new myHandler();
vp_food_guide.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
return false;
}
});
//这里的设置监听在前面写小圆点变化时已经写过了，
vp_food_guide.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int i, float v, int i1) {
}
@Override
public void onPageSelected(int i) {
int newPosition = i % mImageViewList.size();
ll_food_carousel.getChildAt(beforepoint).setEnabled(false);
ll_food_carousel.getChildAt(newPosition).setEnabled(true);
beforepoint = newPosition;
}
@Override
public void onPageScrollStateChanged(int i) {
}
});
mMyHandler.sendEmptyMessageDelayed(0,2000);
3.当界面销毁是移除消息，因为我是在fragment里，所以就在onDestroyView里销毁了
@Override
public void onDestroyView() {
if(mMyHandler != null){
mMyHandler.removeMessages(0);
mMyHandler = null;
// ll_food_carousel.getChildAt(beforepoint).setEnabled(false);
Log.i("TAG","handler销毁");
}
super.onDestroyView();
}
