Android 底部导航切换页面(FragmentLayout+BottomNavigationView)

效果图:
Android 底部导航切换页面(FragmentLayout+BottomNavigationView)_第1张图片

文件目录:

Android 底部导航切换页面(FragmentLayout+BottomNavigationView)_第2张图片

第一步:创建底部导航菜单项


<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/immerse"
        android:enabled="true"
        android:icon="@drawable/immerse_20_inactive"
        android:title="@string/botton_nav1"/>
    <item
        android:id="@+id/test"
        android:enabled="true"
        android:icon="@drawable/test_20_inactive"
        android:title="@string/botton_nav2"/>
    <item
        android:id="@+id/person"
        android:enabled="true"
        android:icon="@drawable/person_20_inactive"
        android:title="@string/botton_nav3"/>
menu>

Android 底部导航切换页面(FragmentLayout+BottomNavigationView)_第3张图片

第二步:创建底部导航和子页面布局


<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:id="@+id/linearLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavigationView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:itemIconTint="@color/bottom_navigation_color_selector"
        app:itemTextColor="@color/bottom_navigation_color_selector"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_navigation_menu" />

    <FrameLayout
        android:id="@+id/home_fragment"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@color/white"
        app:layout_constraintBottom_toTopOf="@+id/bottomNavigationView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
androidx.constraintlayout.widget.ConstraintLayout>

Android 底部导航切换页面(FragmentLayout+BottomNavigationView)_第4张图片

第三步:创建ImmerseFragment,PersonFragment,TestFragment(会同步创建子页面.xml)
Android 底部导航切换页面(FragmentLayout+BottomNavigationView)_第5张图片

第四步:控制显示

package com.example.immersetests;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentTransaction;

import android.annotation.SuppressLint;
import android.os.Bundle;
import android.view.MenuItem;
import android.widget.FrameLayout;
import android.widget.Toast;

import com.example.immersetests.ui.ImmerseFragment;
import com.example.immersetests.ui.PersonFragment;
import com.example.immersetests.ui.TestFragment;
import com.google.android.material.bottomnavigation.BottomNavigationView;

public class MainActivity extends AppCompatActivity{

    private BottomNavigationView bottomNavigationView;
    private FrameLayout frameLayout;
    private ImmerseFragment immerseFragment;
    private PersonFragment personFragment;
    private TestFragment testFragment;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        immerseFragment = new ImmerseFragment();
        personFragment = new PersonFragment();
        testFragment = new TestFragment();

        frameLayout = findViewById(R.id.home_fragment);

        bottomNavigationView = findViewById(R.id.bottomNavigationView);
        bottomNavigationView.setOnNavigationItemSelectedListener(itemSelectedListener);

        switchFragment(personFragment);
    }

    private BottomNavigationView.OnNavigationItemSelectedListener itemSelectedListener = new BottomNavigationView.OnNavigationItemSelectedListener() {
        @Override
        public boolean onNavigationItemSelected(@NonNull MenuItem item) {
            switch (item.getItemId()) {
                case R.id.immerse:
                    switchFragment(immerseFragment);
                    return true;
                case R.id.test:
                    switchFragment(testFragment);
                    return true;
                case R.id.person:
                    switchFragment(personFragment);
                    return true;
            }
            return false;
        }
    };

    private void switchFragment(Fragment fragment){
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        transaction.replace(R.id.home_fragment, fragment).commitNow();
    }
}

Android 底部导航切换页面(FragmentLayout+BottomNavigationView)_第6张图片

你可能感兴趣的:(Android,android)