Skip to content

[NavigationView] strange rectangle appears when window overlaps with display cutout in edge-to-edge mode #4571

New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Open
manabu-nakamura opened this issue Feb 2, 2025 · 2 comments · May be fixed by #4572
Labels

Comments

@manabu-nakamura
Copy link
Contributor

manabu-nakamura commented Feb 2, 2025

Description: The strange rectangle appears when the window overlaps with the display cutout in edge-to-edge mode.
Test11
Image
(#3983 or #4576) Catalog app
Image

Expected behavior: The strange rectangle doesn't appear when the window overlaps with the display cutout in edge-to-edge mode.
Test11
Image
(#3983 or #4576) Catalog app
Image

Source code:

<androidx.drawerlayout.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true">
            <com.google.android.material.appbar.MaterialToolbar
                android:id="@+id/appBar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />
        </com.google.android.material.appbar.AppBarLayout>
    </androidx.coordinatorlayout.widget.CoordinatorLayout>
    <com.google.android.material.navigation.NavigationView
        android:layout_width="220dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/main" />
</androidx.drawerlayout.widget.DrawerLayout>
<resources>
    <style name="Theme.App" parent="Theme.Material3.DynamicColors.DayNight.NoActionBar">
        <item name="android:windowLayoutInDisplayCutoutMode">always</item>
    </style>
</resources>

Minimal sample app repro: Test11.zip

Android API version: 35

Material Library version: 1.13.0-alpha10

Device: Emulator 35.3.11

@manabu-nakamura
Copy link
Contributor Author

Workaround: put it into your app's res/values/styles.xml:

<style name="Widget.Design.ScrimInsetsFrameLayout" parent="">
    <item name="insetForeground">@android:color/transparent</item>
</style>

@michael-winkler
Copy link
Contributor

Screenshot_20250202-190059.png

This is also wrong. There should be padding on the left side that the display cutout will not overlap the content.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
Projects
None yet
2 participants