Android_ViewPager+Fragment实现页面滑动和底部导航栏

1、Xml中底部导航栏由一个RadioGroup组成，其上是ViewPager。

 

 

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="horizontal"
    android:background="#FFFFFF"
    tools:context=".MainActivity">

    <LinearLayout
        android:id="@+id/main_toplinear"
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:background="@drawable/riple_btn_nocorner"
        android:gravity="center">

        <ImageView
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_margin="5dp"
            android:src="@drawable/icon"></ImageView>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="滴滴嗒小账本"
            android:textColor="#9E6E1E"
            android:textSize="25dp"></TextView>
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:layout_below="@+id/main_toplinear"
        android:background="#232"></View>
    <View
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:layout_above="@+id/main_radio_group"
        android:background="#232"></View>
    <RadioGroup
        android:id="@+id/main_radio_group"
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:layout_alignParentBottom="true"
        android:background="#EDDEF7"
        android:gravity="center"
        android:orientation="horizontal">

        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            android:text="记录"
            android:gravity="center"
            android:textSize="25dp"
            android:textColor="#9E6E1E"
            android:background="@drawable/radio"
            android:id="@+id/main_rd_cord"
            ></RadioButton>

        <RadioButton
            android:id="@+id/main_rd_inout"
            android:layout_width="5dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:textSize="25dp"
            android:textColor="#9E6E1E"
            android:text="收支"
            android:background="@drawable/radio"
            android:button="@null"></RadioButton>

        <RadioButton
            android:id="@+id/main_rd_my"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            android:gravity="center"
            android:textSize="25dp"
            android:textColor="#9E6E1E"
            android:background="@drawable/radio"
            android:text="我的"
            ></RadioButton>
    </RadioGroup>
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/main_viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/main_toplinear"
        android:layout_above="@id/main_radio_group"></androidx.viewpager.widget.ViewPager>
</RelativeLayout>

　　

2、编写几个页面的Fragment。

3、编写FragmentPagerAdapter，重写getItem和getCount方法。

 

package com.example.didida_corder;

import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentPagerAdapter;

public class MyFragPageAdapter extends FragmentPagerAdapter {
    private int PAGE_NUM = 3;
    private final int PAGE_CORD = 0;
    private final int PAGE_INOUT = 1;
    private final int PAGE_MY = 2;
    private CordFragment cordFragment = null;
    private MyItemFragment myItemFragment = null;
    private InOutFragment inOutFragment = null;

    public MyFragPageAdapter(@NonNull FragmentManager fm) {
        super(fm);
        cordFragment = new CordFragment();
        myItemFragment = new MyItemFragment();
        inOutFragment = new InOutFragment();
    }

    @NonNull
    @Override
    public Fragment getItem(int position) {
        switch (position) {
            case PAGE_CORD: {
                return cordFragment;
            }
            case PAGE_INOUT: {
                return inOutFragment;
            }
            case PAGE_MY: {
                return myItemFragment;
            }
            default:
                return null;
        }

    }

    @Override
    public int getCount() {
        return PAGE_NUM;
    }

}

 

　　

 

4、在MainActivity中实现ViewPager.OnPageChangeListener和RadioGroup.OnCheckedChangeListener接口。

 

package com.example.didida_corder;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Adapter;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener, RadioGroup.OnCheckedChangeListener{
    private MyFragPageAdapter myFragPageAdapter;
    private ViewPager viewPager;
    private TextView textView;
    private RadioGroup radioGroup;
    private RadioButton radioButton_crod;
    private RadioButton radioButton_inout;
    private RadioButton radioButton_myitem;
    private int PAGE_NUM = 3;
    private final int PAGE_CORD = 0;
    private final int PAGE_INOUT = 1;
    private final int PAGE_MY = 2;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        myFragPageAdapter=new MyFragPageAdapter(getSupportFragmentManager());
        bindViews();
        radioButton_crod.setChecked(true);
    }
    private void bindViews(){
        radioButton_crod=findViewById(R.id.main_rd_cord);
        radioButton_inout=findViewById(R.id.main_rd_inout);
        radioButton_myitem=findViewById(R.id.main_rd_my);
        radioGroup=findViewById(R.id.main_radio_group);
        radioGroup.setOnCheckedChangeListener(this);
        viewPager= findViewById(R.id.main_viewpager);
        viewPager.setAdapter(myFragPageAdapter);
        viewPager.addOnPageChangeListener(this);
        viewPager.setCurrentItem(0);
    }


    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {

    }

    @Override
    public void onPageScrollStateChanged(int state) {
       if (state==2){
           switch (viewPager.getCurrentItem()){
               case PAGE_CORD:
                   radioButton_crod.setChecked(true);
                   break;
               case PAGE_INOUT:
                   radioButton_inout.setChecked(true);
                   break;
               case PAGE_MY:
                   radioButton_myitem.setChecked(true);
                   break;
           }
       }
    }

    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
        switch (checkedId){
            case R.id.main_rd_cord:{
                viewPager.setCurrentItem(PAGE_CORD);
                break;
            }
            case R.id.main_rd_inout:{
                viewPager.setCurrentItem(PAGE_INOUT);
                break;
            }
            case R.id.main_rd_my:{
                viewPager.setCurrentItem(PAGE_MY);
                break;
            }
        }
    }
}