[SideSheet] Modal SideSheet Width

[reinhardt1053]

Description: Currently there is no way to change the Modal SideSheet width. It works for Standard and Coplanar Side Sheets.

Expected behavior: Modal SideSheet Dialog should respect the content layout width

Android API version: 33

Material Library version: 1.8.0

Device: Pixel C

[dsn5ft]

@afohrman I'm thinking this is because of the hardcoded android:layout_width in m3_side_sheet_dialog.xml:

material-components-android/lib/java/com/google/android/material/sidesheet/res/layout/m3_side_sheet_dialog.xml

Line 44 in a16f180

android:layout_width="@dimen/m3_side_sheet_width"

I think we could consider moving that android:layout_width into the sideSheetModalStyle so that it can be overridden by the client. It should work because the sideSheetModalStyle is always set directly in that layout. What do you think?

[dsn5ft]

Or we could come up with a different API, because setting the width from sideSheetModalStyle might not be very natural, especially if there are multiple side sheets in the same app that need different widths.

[danielrust]

@dsn5ft any traction on this?

[dsn5ft]

I'll look into moving the width/height into sideSheetModalStyle so it can at least be customized somehow.

[akeeaggarwal]

@dev210202
App is crashing after updating to "1.12.0-alpha03" with below logs

FATAL EXCEPTION: main
Process: com.example.debug, PID: 24717
android.view.InflateException: Binary XML file line #44 in com.example.debug:layout/m3_side_sheet_dialog: Could not inflate Behavior subclass com.google.android.material.sidesheet.SideSheetBehavior
Caused by: java.lang.RuntimeException: Could not inflate Behavior subclass com.google.android.material.sidesheet.SideSheetBehavior

[afohrman]

@akeeaggarwal thanks for reporting this! The breakage is likely because layout_width and layout_height are set in the style as of 3b278d7. This shouldn't break unless you've set a style explicitly on the modal bottom sheet that doesn't inherit from the Material3 style, and if that style doesn't set the layout_width and layout_height.

I did take a look at your code though, and it seems like you're using a modal style rather than the standard one here and here. From what I can tell, it seems like you're trying to get a standard side sheet, in which case you'd want the style="@style/Widget.Material3.SideSheet" style. You can take a look at the side sheet catalog demo to figure out which one you're looking for and for implementation tips.

[akeeaggarwal]

@afohrman Thanks for your prompt response. Can you take a look on below implementation and suggest what I am doing wrong.

This is how I am creating sidesheet by creating its object and setting the view from xml layout file -

SideSheetDialog(ctx, R.style.SideSheet)

This is my style -

<style name="SideSheet" parent="ThemeOverlay.Material3.SideSheetDialog"> shapeAppearance"= @null enforceMaterialTheme = false android:layout_width" = 400dp </style>

1. I dont want the round corner
2. And want the custom width with status bar

But application is crashing. Can you suggest what I am doing wrong here?