https://kotlinlang.org logo
#compose-android
Title
# compose-android
t

Tomas Gordian

03/21/2024, 11:12 AM
Hello,
Material3
ModalBottomSheet
in landscape mode on mobile has an extra right inset applied when using
Theme.SplashScreen
. It looks like it is the same size as the navigation bar inset.
Screenshot_20240321_115836.png
Minimum code to reproduce:
Copy code
class MainActivity : ComponentActivity() {
    @OptIn(ExperimentalMaterial3Api::class)
    override fun onCreate(savedInstanceState: Bundle?) {
        installSplashScreen()
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()

        setContent {
            Surface(
                color = Color.Green,
                modifier = Modifier.fillMaxSize()
            ) {
                val sheetState = rememberModalBottomSheetState()
                val coroutineScope = rememberCoroutineScope()

                LaunchedEffect(Unit) {
                    coroutineScope.launch {
                        sheetState.show()
                    }
                }

                ModalBottomSheet(
                    windowInsets = WindowInsets(0, 0, 0, 0),
                    sheetState = sheetState,
                    onDismissRequest = {},
                    modifier = Modifier.fillMaxHeight()
                ) {}
            }

        }
    }
}

<style name="Theme.MyTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
      <item name="android:navigationBarColor">@android:color/transparent</item>
      <item name="android:statusBarColor">@android:color/transparent</item>
</style>

<style name="Theme.MyLauncherTheme" parent="Theme.SplashScreen">
      <item name="windowSplashScreenBackground">@android:color/black</item>
      <item name="windowSplashScreenAnimatedIcon">@mipmap/ic_launcher_foreground</item>
      <item name="postSplashScreenTheme">@style/Theme.MyTheme</item>
    </style>
Is this a known issue or is there some workaround for this? Without
Theme.SplashScreen
it works correctly.
s

Stylianos Gakis

03/21/2024, 11:46 AM
The first
enableEdgeToEdge
is supposed to be called before
super.onCreate
btw, can you change that first and see if you get a different result?
What I think happens in your case is that your content is actually constrained to be padded by the navigation bar. Then you enable this, so you get the right inset values inside your code, and then it also applies the nav bar insets to your sheet too. Effectively double applying it. Just a hunch, from looking at the screenshot
t

Tomas Gordian

03/21/2024, 11:55 AM
That did not help unfortunately, still the same result.
s

Stylianos Gakis

03/21/2024, 11:59 AM
What does your code look like now? Do you still have this
windowInsets = WindowInsets(0, 0, 0, 0)
there?
t

Tomas Gordian

03/21/2024, 12:05 PM
Yes, I just tried to call
enableEdgeToEdge
before
super.onCreate
as you suggested. windowInsets are set to zero for other bugs with ModalBottomSheet. But even if I remove it, it has no effect on my issue.
s

Stylianos Gakis

03/21/2024, 12:08 PM
and what is your windowSoftInputMode in your manifest?
t

Tomas Gordian

03/21/2024, 12:18 PM
I dont have it set. I just tried couple of different modes, but it has no effect on the issue.
s

Stylianos Gakis

03/21/2024, 12:23 PM
Oh last question 😅 Does this also happen if you open the sheet after you were already in landscape mode? Or only if you were in portrait, opened the sheet, and then went to landscape? I had a bug with that behavior too. If not again then I’d ask you to make sure you are in latest version of the library, even try the latest alpha and see if there’s anything different there.
t

Tomas Gordian

03/21/2024, 12:43 PM
I tried both ways 😄 I also tried the latest material3 alpha. My setup should not be special, the bug is also reproducible when creating new project or in Now in Android app.
s

Stylianos Gakis

03/21/2024, 12:47 PM
t

Tomas Gordian

03/22/2024, 2:40 PM
Looks like it is already reported: https://issuetracker.google.com/issues/300280229
Update on the
ModalBottomSheet
issue: I noticed, that if I am using the
Theme.SplashScreen
, it has set:
<item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
I could override it in my theme to
never
and get rid of the extra right inset, but than I am getting black space on the left side:
s

Stylianos Gakis

03/22/2024, 3:43 PM
What if you specify nothing at all for that windowLayoutInDisplayCutoutMode? So just use the default one