如何修复Relative Layout中聊天界面的视图重叠与发送栏消失问题

Let's break down what's causing your problem and how to fix it step by step:

Root Causes #

1. Invalid Constraint Properties: Your Toolbar uses app:layout_constraint... attributes, but its parent is a RelativeLayout—these constraints don't function here and can throw off layout calculations.
2. Unconfigured Soft Keyboard Behavior: Without the right windowSoftInputMode setting, the system won't resize your layout when the keyboard pops up, leading to the bottom send bar getting hidden and elements overlapping.
3. Unnecessary Layout Nesting: The nested ConstraintLayout inside your Toolbar adds unnecessary complexity that can cause unexpected layout glitches.

Step-by-Step Fixes #

1. Clean Up the Toolbar Layout #

Remove the invalid constraint attributes and simplify the Toolbar's inner structure (you don't need a nested ConstraintLayout just to center a TextView):

<Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:layout_marginStart="10dp"
    android:layout_marginTop="10dp"
    android:layout_marginEnd="10dp"
    android:layout_marginBottom="10dp"
    android:theme="@style/ThemeOverlay.AppCompat.Light">

    <TextView
        android:id="@+id/start_at_info"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="Start at"
        android:textSize="16sp"
        android:textStyle="bold" />

</Toolbar>

2. Set Correct Window Soft Input Mode #

Open your AndroidManifest.xml, find the activity hosting this ChatFragment, and add the adjustResize mode to ensure the layout shrinks when the keyboard appears:

<activity
    android:name=".YourChatActivity"
    android:windowSoftInputMode="adjustResize">
    <!-- Keep your existing activity attributes here -->
</activity>

This tells the system to resize your layout instead of overlapping it, keeping the bottom send bar visible and ensuring the RecyclerView only occupies its intended space.

3. Verify RecyclerView Positioning #

Double-check your RecyclerView maintains correct relative positioning (your existing attributes are correct, just confirm they stay intact):

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view_chat"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/chat_layout"
    android:layout_below="@+id/toolbar"
    android:background="#AEFFFFFF"
    tools:listitem="@layout/message_left" />

4. Anchor the Send Bar Properly #

Remove the invalid constraint attribute from your bottom LinearLayout—it only works in a ConstraintLayout parent, which you're not using here:

<LinearLayout
    android:id="@+id/chat_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="@color/white"
    android:gravity="center_horizontal"
    android:orientation="horizontal">

    <!-- Your attach button, EditText, and send button here -->

</LinearLayout>

Why This Works #

• By removing invalid constraints, we let RelativeLayout handle positioning as intended.
• adjustResize ensures the layout adapts to the soft keyboard, preventing the send bar from disappearing and the RecyclerView from overlapping the Toolbar.
• Simplifying the Toolbar layout eliminates unnecessary nesting that could cause layout conflicts.

Give these changes a test—your send bar should stay visible when typing, and messages will only occupy the RecyclerView space without overlapping the top Toolbar.

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