新しいマテリアルコンポーネントライブラリを使用すると、スタイルの属性を使用してコンポーネントの形状をカスタマイズできshapeAppearanceOverlay
ます(注:バージョン1.1.0が必要です)。
メソッドをBottomSheetDialogFragment
オーバーライドしてから、onCreateView
下部シートダイアログのカスタムスタイルを定義するだけです。
アプリのテーマでbottomSheetDialogTheme
属性を定義しますstyles.xml
。
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
<item name="colorPrimary">@color/colorPrimary</item>
....
<item name="bottomSheetDialogTheme">@style/CustomBottomSheetDialog</item>
</style>
次に、でお気に入りの形状を定義するだけです shapeAppearanceOverlay
<style name="CustomBottomSheetDialog" parent="@style/ThemeOverlay.MaterialComponents.BottomSheetDialog">
<item name="bottomSheetStyle">@style/CustomBottomSheet</item>
</style>
<style name="CustomBottomSheet" parent="Widget.MaterialComponents.BottomSheet">
<item name="shapeAppearanceOverlay">@style/CustomShapeAppearanceBottomSheetDialog</item>
</style>
<style name="CustomShapeAppearanceBottomSheetDialog" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSizeTopRight">16dp</item>
<item name="cornerSizeTopLeft">16dp</item>
<item name="cornerSizeBottomRight">0dp</item>
<item name="cornerSizeBottomLeft">0dp</item>
</style>
BottomSheetDialogFragment
(bottomSheetDialogTheme
アプリのテーマにを追加する代わりに)でこのメソッドをオーバーライドする同じ動作を取得できます。
@Override public int getTheme() {
return R.style.CustomBottomSheetDialog;
}
この場合、このthemeOverlayは単一BottomSheetDialogFragment
のアプリでのみ使用しており、すべてのアプリで使用しているわけではありません。
拡張状態に関する重要な注意事項:
展開された状態では、BottomSheetの角は平らです。あなたはgithubリポジトリで公式コメントをチェックすることができます:
私たちのデザインチームは、丸い角はスクロール可能なコンテンツを示し、平らな角は追加のコンテンツがないことを示していると強く考えています。そのため、fitToContentsでこの変更を追加することを望んでいません。
この動作はによって提供され、BottomSheetBehavior
オーバーライドすることはできません。
ただし、回避策があります->免責事項:次のリリースで動作を停止する可能性があります!!
あなたは追加することができますBottomSheetCallback
にBottomSheetDialogFragment
:
@NonNull @Override public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {
Dialog dialog = super.onCreateDialog(savedInstanceState);
((BottomSheetDialog)dialog).getBehavior().addBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
@Override public void onStateChanged(@NonNull View bottomSheet, int newState) {
if (newState == BottomSheetBehavior.STATE_EXPANDED) {
MaterialShapeDrawable newMaterialShapeDrawable = createMaterialShapeDrawable(bottomSheet);
ViewCompat.setBackground(bottomSheet, newMaterialShapeDrawable);
}
}
@Override public void onSlide(@NonNull View bottomSheet, float slideOffset) {
}
});
return dialog;
}
@NotNull private MaterialShapeDrawable createMaterialShapeDrawable(@NonNull View bottomSheet) {
ShapeAppearanceModel shapeAppearanceModel =
ShapeAppearanceModel.builder(getContext(), 0, R.style.CustomShapeAppearanceBottomSheetDialog)
.build();
MaterialShapeDrawable currentMaterialShapeDrawable = (MaterialShapeDrawable) bottomSheet.getBackground();
MaterialShapeDrawable newMaterialShapeDrawable = new MaterialShapeDrawable((shapeAppearanceModel));
newMaterialShapeDrawable.initializeElevationOverlay(getContext());
newMaterialShapeDrawable.setFillColor(currentMaterialShapeDrawable.getFillColor());
newMaterialShapeDrawable.setTintList(currentMaterialShapeDrawable.getTintList());
newMaterialShapeDrawable.setElevation(currentMaterialShapeDrawable.getElevation());
newMaterialShapeDrawable.setStrokeWidth(currentMaterialShapeDrawable.getStrokeWidth());
newMaterialShapeDrawable.setStrokeColor(currentMaterialShapeDrawable.getStrokeColor());
return newMaterialShapeDrawable;
}