ViewPager、RecycleView实现轮播图

1.ViewPager实现轮播图形效果。

   1）layout中，PageIndicatorView轮播的View

 <RelativeLayoutandroid:layout_width="match_parent"android:layout_height="200dp"android:orientation="vertical"><androidx.viewpager2.widget.ViewPager2android:id="@+id/viewpager"android:layout_width="match_parent"android:layout_height="match_parent" /><com.example.viewpager.indicator.PageIndicatorViewandroid:id="@+id/indicator1"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true" /></RelativeLayout>

   2）Activity中

 List<String> list = new ArrayList<>();for (int i = 0; i < 5; i++) {list.add("pos: " + i);}viewPager = findViewById(R.id.viewpager);indicator1 = findViewById(R.id.indicator1);//设置ViewPager是横向还是纵向滚动viewPager.setOrientation(ViewPager2.ORIENTATION_HORIZONTAL);viewPager.setAdapter(new MyPageAdapter2(this, list));indicator1.initIndicator(list.size());viewPager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {@Overridepublic void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {super.onPageScrolled(position, positionOffset, positionOffsetPixels);}@Overridepublic void onPageSelected(int position) {//当页面滑动时，切换指示器if (indicator1.getChildCount() > 0) {indicator1.setSelectedPage(position % indicator1.getChildCount());}}@Overridepublic void onPageScrollStateChanged(int state) {super.onPageScrollStateChanged(state);}});

2.RecycleView实现轮播效果：

  1）Layout中

  <RelativeLayoutandroid:layout_width="match_parent"android:layout_height="200dp"android:layout_marginTop="20dp"><androidx.recyclerview.widget.RecyclerViewandroid:id="@+id/recycle_view"android:layout_width="match_parent"android:layout_height="200dp"/><com.example.viewpager.indicator.PageIndicatorViewandroid:id="@+id/indicator2"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true" /></RelativeLayout>

2）Activity中：

   

   recyclerView = findViewById(R.id.recycle_view);indicator2 = findViewById(R.id.indicator2);indicator2.initIndicator(list.size());LinearLayoutManager manager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);recyclerView.setLayoutManager(manager);recyclerView.setAdapter(new MyPageAdapter2(this, list));recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {@Overridepublic void onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy) {super.onScrolled(recyclerView, dx, dy);int firstReal = manager.findFirstVisibleItemPosition();View viewFirst = manager.findViewByPosition(firstReal);float width = viewFirst.getWidth();if (width != 0 && viewFirst != null) {float right = viewFirst.getRight();float ratio = right / width;if (ratio > 0.8) {if (currentIndex != firstReal) {currentIndex = firstReal;indicator2.setSelectedPage(currentIndex);}} else if (ratio < 0.2) {if (currentIndex != firstReal + 1) {currentIndex = firstReal + 1;indicator2.setSelectedPage(currentIndex);}}}}});

3.滑动指示器：

public class PageIndicatorView extends LinearLayout {private Context mContext = null;private int dotSize = 5; // 指示器的大小（dp）private int margins = 5; // 指示器间距（dp）private List<View> indicatorViews = null; // 存放指示器public PageIndicatorView(Context context) {this(context, null);}public PageIndicatorView(Context context, AttributeSet attrs) {this(context, attrs, 0);}public PageIndicatorView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init(context);}private void init(Context context) {this.mContext = context;setGravity(Gravity.CENTER);setOrientation(HORIZONTAL);dotSize = Utils.dip2px(dotSize);margins = Utils.dip2px( margins);}/*** 初始化指示器，默认选中第一页** @param count 指示器数量，即页数*/public void initIndicator(int count) {if (indicatorViews == null) {indicatorViews = new ArrayList<>();} else {indicatorViews.clear();removeAllViews();}View view;LayoutParams params = new LayoutParams(dotSize, dotSize);params.setMargins(margins, margins, margins, margins);for (int i = 0; i < count; i++) {view = new View(mContext);view.setBackgroundResource(R.drawable.indicator_normal);addView(view, params);indicatorViews.add(view);}if (indicatorViews.size() > 0) {indicatorViews.get(0).setBackgroundResource(R.drawable.indicator_active);}}/*** 设置选中页** @param selected 页下标，从0开始*/public void setSelectedPage(int selected) {for (int i = 0; i < indicatorViews.size(); i++) {if (i == selected) {indicatorViews.get(i).setBackgroundResource(R.drawable.indicator_active);} else {indicatorViews.get(i).setBackgroundResource(R.drawable.indicator_normal);}}}}

  两个小圆点代码：

<shape xmlns:android="http://schemas.android.com/apk/res/android"android:shape="oval"><solid android:color="#fffc9d16" />
</shape>

<shape xmlns:android="http://schemas.android.com/apk/res/android"android:shape="oval"><solid android:color="#FFD9D9D9" />
</shape>

代码下载：

https://download.csdn.net/download/niuyongzhi/88408862