使用RadioButton做一个ViewPager的指示器

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"></androidx.viewpager.widget.ViewPager>

    <RadioGroup
        android:id="@+id/rg"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal">

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </RadioGroup>

</LinearLayout>

首先就是布局文件，一个ViewPager和RadioGroup，RadioGroup中放若干个RadioButton，然后在MainActivity中绑定控件，实现ViewPager的适配器，这里我用FragmentPagerAdapter，就先创一个Fragment

在Fragment中返回一个随机背景色的view，就不用新建太多Fragment来区分

public class BlankFragment extends Fragment {
    View view;

    public BlankFragment() {
        // Required empty public constructor
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        view = inflater.inflate(R.layout.fragment_blank, container, false);
        Random random = new Random();
        view.setBackgroundColor(Color.rgb(random.nextInt(255), random.nextInt(255), random.nextInt(255)));
        return view;
    }
}

在MainActivity中直接实现vp的适配器，并添加数据

		RadioButton radioButton; 
		List<Fragment> fragments = new ArrayList<>();
		==================================================
		vp = findViewById(R.id.vp);
        rg = findViewById(R.id.rg);
        radioButton= (RadioButton) rg.getChildAt(0);
        radioButton.setChecked(true);
		for (int i = 0; i < 8; i++) {
            fragments.add(new BlankFragment());
        }
        vp.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager(), 1) {
            @NonNull
            @Override
            public Fragment getItem(int position) {
                return fragments.get(position);
            }

            @Override
            public int getCount() {
                return fragments.size();
            }

            @Override
            public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
//                super.destroyItem(container, position, object);
            }
        });

添加ViewPager的监听事件，实现滑动时更改RadioButton的选中

        vp.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            }

            @Override
            public void onPageSelected(int position) {
                radioButton = (RadioButton) rg.getChildAt(position);
                radioButton.setChecked(true);
            }

            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });

看看目前的效果图（GIF图片）

然后添加RadioButton点击切换Fragment，我们使用RadioGroup的监听事件来实现，这一部也很简单，可以说一行代码就实现了

rg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup radioGroup, int i) {
                **vp.setCurrentItem(i - 1);**
                //这里有BUG，改成下面这句
                **vp.setCurrentItem((i - 1)%fragments.size);**
            }
        });

到此，基本上就实现了我们所需要的功能，同时自己还可以设置RadioButton的样式

最后的成品图如下