FrameLayout适配异常：被NavigationBar遮挡且导航栏点击尺寸变化

Hey there! Let's work through this NavigationBar issue you're having—sounds like two main pain points: your FrameLayout getting blocked by the NavigationBar, and weird size shifts when tapping the nav bar. Let's break this down step by step.

First: Fixing the FrameLayout Overlap Issue #

The RelativeLayout approach probably failed because of incorrect layout hierarchy or missing constraints. Here are two reliable fixes:

1. Use ConstraintLayout (Recommended)

ConstraintLayout makes it easy to pin views to each other without overlap. Try this structure:

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <!-- Your content FrameLayout, pinned above the nav bar -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/bottom_nav" />

    <!-- NavigationBar pinned to the bottom -->
    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_nav"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:menu="@menu/your_nav_menu" />

</androidx.constraintlayout.widget.ConstraintLayout>

The android:fitsSystemWindows="true" on the root layout ensures your views respect system UI (like the nav bar) instead of underlapping it.

2. Manual Window Insets Handling

If you need more control, use ViewCompat to adjust padding dynamically:

ViewCompat.setOnApplyWindowInsetsListener(content_frame) { view, insets ->
    val navBarHeight = insets.getInsets(WindowInsetsCompat.Type.navigationBars()).bottom
    view.setPadding(view.paddingLeft, view.paddingTop, view.paddingRight, navBarHeight)
    insets
}

This adds padding to the bottom of your FrameLayout equal to the nav bar's height, so content never gets covered.

Second: Fixing the NavigationBar Size Shift on Tap #

That weird size change almost always comes from inconsistent padding or background states in your nav items. Here's how to fix it:

1. Check Your Nav Item Layout (If Custom)
   If you're using a custom layout for nav items, make sure the padding and dimensions are identical for selected/unselected states. Example:

<!-- res/layout/custom_nav_item.xml -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical"
    android:padding="8dp"> <!-- Fixed padding for all states -->

    <ImageView
        android:id="@+id/nav_icon"
        android:layout_width="24dp"
        android:layout_height="24dp" />

    <TextView
        android:id="@+id/nav_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="12sp" />
</LinearLayout>

2. Normalize the Nav Bar's Background
   Avoid using drawables that change size when selected. Use a color selector instead:

<!-- res/drawable/nav_item_bg.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/nav_selected" android:state_selected="true" />
    <item android:color="@color/nav_normal" />
</selector>

Then apply it to your nav bar:

bottom_nav.itemBackground = ContextCompat.getDrawable(this, R.drawable.nav_item_bg)

This keeps the nav bar's height consistent, even when tapping items.

Quick Checks to Rule Out Other Issues #

• Double-check your theme: If you have android:windowTranslucentNavigation="true" set, remove it or pair it with fitsSystemWindows="true" to avoid underlap.
• Make sure your NavigationBar isn't wrapped in a layout that has wrap_content height and dynamic padding—this can cause unexpected resizing.

Give these steps a try, and your layout should behave as expected!

内容的提问来源于stack exchange，提问作者Soul