采用ViewPage+PagerAdapter组合做左右滑屏

项目代码已上传到资源，见：https://download.csdn.net/download/bigc2001/14825498。

实现的效果是：

1，页面布局

采用ConstraintLayout根布局，页面内部主要区域为ViewPager，下方贴近底部放置一排Radio，在这排Radio之上放置一排View用于显示色块。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@id/viewSpace0"
        app:layout_constraintTop_toTopOf="parent" />

    <View
        android:id="@+id/viewSpace0"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="@color/tab_space_normal"
        app:layout_constraintBottom_toTopOf="@id/radioGroup1"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@id/viewSpace1" />

    <View
        android:id="@+id/viewSpace1"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="@color/tab_space_normal"
        app:layout_constraintBottom_toTopOf="@id/radioGroup1"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintLeft_toRightOf="@id/viewSpace0"
        app:layout_constraintRight_toLeftOf="@id/viewSpace2" />

    <View
        android:id="@+id/viewSpace2"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="@color/tab_space_normal"
        app:layout_constraintBottom_toTopOf="@id/radioGroup1"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintLeft_toRightOf="@id/viewSpace1"
        app:layout_constraintRight_toRightOf="parent" />

    <RadioGroup
        android:id="@+id/radioGroup1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintBottom_toBottomOf="parent">

        <RadioButton
            android:id="@+id/radio1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/radio_select_background"
            android:button="@null"
            android:gravity="center_horizontal|center"
            android:text="仪表盘"
            android:textColor="@color/color_radio_font" />

        <RadioButton
            android:id="@+id/radio2"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/radio_select_background"
            android:button="@null"
            android:gravity="center_horizontal|center"
            android:text="保养记录"
            android:textColor="@color/color_radio_font" />

        <RadioButton
            android:id="@+id/radio3"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/radio_select_background"
            android:button="@null"
            android:gravity="center_horizontal|center"
            android:text="设置"
            android:textColor="@color/color_radio_font" />
    </RadioGroup>

</androidx.constraintlayout.widget.ConstraintLayout>

样式文件中使用的颜色定义都可以在下载包里找到。

2，主Activity

在onCreate方法里设置单选事件，用于加载不同的界面（同时支持左右滑动、下方单选按钮点击）；在onCreate事件里设置滑动屏幕的布局、设置适配器；设置页面变更监听用于切换底部Radio和色块的显示效果。

package csdn.bigc2001.elm327sii;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;

import java.util.ArrayList;

/**
 * 使用ViewPage+PagerAdapter做左右滑屏
 */
public class MainActivity extends AppCompatActivity {
    private static final String tag = "+>MainActivity";
    private ViewPager viewPager;
    private PagerAdapter pagerAdapter;
    private ArrayList<View> listPages = new ArrayList<>();
    private RadioGroup radioGroup1;
    private RadioButton[] radioTabs = new RadioButton[3];
    private View viewSpace0, viewSpace1, viewSpace2;
    private boolean fromPageBegin = false;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        this.radioGroup1 = this.findViewById(R.id.radioGroup1);
        radioTabs[0] = this.findViewById(R.id.radio1);
        radioTabs[1] = this.findViewById(R.id.radio2);
        radioTabs[2] = this.findViewById(R.id.radio3);
        viewSpace0 = this.findViewById(R.id.viewSpace0);
        viewSpace1 = this.findViewById(R.id.viewSpace1);
        viewSpace2 = this.findViewById(R.id.viewSpace2);
        //设置单选事件
        radioGroup1.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                int index = -1;
                if (checkedId == R.id.radio1) index = 0;
                else if (checkedId == R.id.radio2) index = 1;
                else if (checkedId == R.id.radio3) index = 2;
                if (index >= 0) {
                    setSpaceFollowChecked(index);
                    if (!fromPageBegin) showPage(index);//防止蛇咬尾巴
                    setTitle(((RadioButton) group.getChildAt(index)).getText());//将选择项的文字复制到标题上
                }
            }
        });
        //设置滑屏页面
        this.viewPager = this.findViewById(R.id.viewPager);
        LayoutInflater inflater = getLayoutInflater();
        View viewPanel = inflater.inflate(R.layout.layout_panel, null);
        listPages.add(viewPanel);
        listPages.add(inflater.inflate(R.layout.layout_4s, null));
        listPages.add(inflater.inflate(R.layout.layout_config, null));
        pagerAdapter = new PagerAdapter() {
            @Override
            public int getCount() {
                return listPages.size();
            }

            @Override
            public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
                //Log.d(tag, view.getClass().getName() + "---1 " + object.getClass().getName());
                return view == object;
            }

            //销毁页面
            @Override
            public void destroyItem(ViewGroup arg0, int arg1, Object arg2) {
                //Log.d(tag, "destroyItem-->" + arg0 + "  >> " + arg1 + "  >> " + arg2);
                arg0.removeView(listPages.get(arg1));
            }

            //加载页面
            @Override
            public Object instantiateItem(ViewGroup arg0, int arg1) {
                Log.d(tag, arg1 + " --------- instantiateItem ----------- " + arg0.getClass().getName());
                arg0.addView(listPages.get(arg1));
                return listPages.get(arg1);
            }
        };
        this.viewPager.setAdapter(pagerAdapter);
        this.viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            //滑动页面
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                //Log.d(tag, "onPageScrolled？" + position);
            }

            //显示一个页面
            @Override
            public void onPageSelected(int position) {
                //Log.d(tag, "onPageSelected？" + position);
                fromPageBegin = true;
                pageSelected(position);
            }

            //滑动状态更改
            @Override
            public void onPageScrollStateChanged(int state) {
                //Log.d(tag, "onPageScrollStateChanged？" + state);
            }
        });
        //设置第一个页面的点击效果
        viewPanel.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Log.d(tag, "==点击了1");
            }
        });
    }

    @Override
    protected void onStart() {
        super.onStart();
        pageSelected(0);
    }

    //控制滑屏显示第几个
    private void showPage(int index) {
        this.viewPager.setCurrentItem(index);
    }

    //让单选选中第几个、FLAG点亮第几个
    private void pageSelected(int index) {
        radioTabs[index].setChecked(true);
        setSpaceFollowChecked(index);
        fromPageBegin = false;//是否是滑屏过来的
        //Log.d(tag, "--a---");
    }

    //点亮FLAG
    private void setSpaceFollowChecked(int index) {
        for (int i = 0; i < radioTabs.length; i++) {
            int id = this.getResources().getIdentifier("viewSpace" + i, "id", this.getPackageName());
            View view = findViewById(id);
            if (i == index)
                view.setBackgroundColor(getResources().getColor(R.color.tab_space_checked));
            else view.setBackgroundColor(getResources().getColor(R.color.tab_space_normal));
        }
    }
}

3，遇到的问题

每个界面显示、不显示的时候，处理一些事务，例如打开蓝牙串口、关闭串口等操作，但是找不到方法，它只有加载和取消加载； 而加载事件不是在显示的时候才加载，而是有它自己的加载逻辑例如显示第一个界面的时候会自动加载后一个界面，显示第一个界面的时候会加载第二个界面；如果前面已加载并且临近显示的界面，它不会销毁。这个问题如果换为Framgent就迎刃而解了，因为Framgent有自己的生命周期。Fragment版本也已经完成，见https://blog.csdn.net/bigc2001/article/details/112863326。