BottomSheetDialogFragment In Tablet Landscape

1.5k views Asked by At

It is possible to change the width of a BottomSheetDialogFragment (material design) width? In tablet landscape mode, the width is match_parent. Thank you

1

There are 1 answers

1
ΓDΛ On BEST ANSWER

Bottom sheets look great on phones. But when putting them on tablets, they feel stretched out, especially in landscape mode. It’s due to the high ratio between peek height vs full tablet width. Details matter, and we want our tablet users as happy as phone users. Let’s customize bottom sheet width for tablets.

values-w820dp/dimens.xml

<resources>
  <dimen name="bottom_sheet_width">600dp</dimen>
</resources>

Fragment File

public class PopupSettingsFragment extends AppCompatDialogFragment {
  ...

  @Override
  public Dialog onCreateDialog(Bundle savedInstanceState) {
    return new CustomWidthBottomSheetDialog(getActivity(), getTheme());
  }

  static class CustomWidthBottomSheetDialog extends BottomSheetDialog {
    public CustomWidthBottomSheetDialog(@NonNull Context context, @StyleRes int theme) {
      super(context, theme);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      int width = getContext().getResources().getDimensionPixelSize(R.dimen.bottom_sheet_width);
      getWindow().setLayout(width > 0 ? width : ViewGroup.LayoutParams.MATCH_PARENT,
        ViewGroup.LayoutParams.MATCH_PARENT);
    }
  }
}

Source