Kotlin: Support display cutouts (short edges) not working

Question

I'm trying to make a simple app where I have a scroll view displaying several card views in fullscreen mode, without the title nor status bar and in immersive sticky mode. I want to take advantage of the display cutout on my phone, (Android Galaxy Note 10 Lite) which is a simple camera notch. I read that I could implement this with a simple theme that renders information into the cutout areas.

Support display cutouts

However, once I add this feature to the theme xml file, the cutout does display part of the background (it is no longer dark), but it won't render the card view content into the cutout display.

As you can see on the images below, as I scroll down through the scroll view, the card view info stops displaying once it reaches the top part of the screen, where the camera notch starts. The pictures are from my Note 10 lite phone, but I also tried it with a Galaxy A10 and it did the same thing.

I would like to take advantage of this portion of the display just as other apps do, like youtube in full screen mode.

I will provide the code from the manifest xml, Main Activity kt and the theme xml. Please let me know if you need anything else.

Thank you.

before scrolling

after scrolling

Main Activity code

package com.example.cardviewlayout

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.main_layout)
    }
    // Use Immersive Sticky for fullscreen mode
    override fun onWindowFocusChanged(hasFocus: Boolean) {
        super.onWindowFocusChanged(hasFocus)
        if (hasFocus) hideSystemUI()
    }
    // Set Immersive Sticky for fullscreen mode
    private fun hideSystemUI() {
        window.decorView.systemUiVisibility = (View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY
                or View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
                or View.SYSTEM_UI_FLAG_FULLSCREEN)
    }
}

Manifest code

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.cardviewlayout">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.CardViewLayout">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

Theme code

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.CardViewLayout" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/purple_500</item>
        <item name="colorPrimaryVariant">@color/purple_700</item>
        <item name="colorOnPrimary">@color/white</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>

        <item name="android:windowLayoutInDisplayCutoutMode">
            shortEdges <!-- default, shortEdges, never -->
        </item>
    </style>
</resources>

question from:https://stackoverflow.com/questions/66056505/kotlin-support-display-cutouts-short-edges-not-working

Answer 1

Waitting for answers