我有一个自定义的bittomsheetdialogfragment，我想在底部视图的顶部有圆角
这是我的自定义类，它膨胀了我想要从底部显示的布局
View mView;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
mView = inflater.inflate(R.layout.charge_layout, container, false);
initChargeLayoutViews();
return mView;
}
我还有这个XML资源文件作为背景:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<corners android:topRightRadius="35dp"
android:topLeftRadius="35dp"
/>
<solid android:color="@color/white"/>
<padding android:top="10dp"
android:bottom="10dp"
android:right="16dp"
android:left="16dp"/>
</shape>
问题是，当我把这个资源文件设置为我的布局的根元素的背景，角仍然不是圆角。
我不能使用以下代码:
this.getDialog().getWindow().setBackgroundDrawableResource(R.drawable.charge_layout_background);
因为它覆盖了底部对话框的默认背景，底部视图上方不会有任何半透明的灰色。
我找到了一个简单的解决办法。
使用com.google.android.material:material:1.6.1
class MyBottomSheet: BottomSheetDialogFragment() {
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
disableShapeAnimation()
}
@SuppressLint("RestrictedApi", "VisibleForTests")
private fun disableShapeAnimation() {
try {
val dlg = dialog as BottomSheetDialog
dlg.behavior.disableShapeAnimations()
} catch (ex: Exception) {
Log.e("BaseBottomSheet", "disableShapeAnimation Exception:", ex)
}
}
}
在你的BottomsheetDialogFragment类中添加这两个方法。
public void setDialogBorder(Dialog dialog) {
FrameLayout bottomSheet = (FrameLayout) dialog.getWindow().findViewById(android.support.design.R.id.design_bottom_sheet);
bottomSheet.setBackground(new ColorDrawable(Color.TRANSPARENT));
setMargins(bottomSheet, 10, 0, 10, 20);
}
private void setMargins(View view, int left, int top, int right, int bottom) {
if (view.getLayoutParams() instanceof ViewGroup.MarginLayoutParams) {
ViewGroup.MarginLayoutParams p = (ViewGroup.MarginLayoutParams) view.getLayoutParams();
p.setMargins(left, top, right, bottom);
view.requestLayout();
}
}
现在调用你的BottomsheetDialogFragment类的setupDialog()方法中的setDialogBorder(dialog)方法。
现在在可绘制文件夹中创建一个形状文件。
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="@color/white" />
<stroke
android:width="1dp"
android:color="@color/transparent" />
</shape>
现在在xml文件中设置父视图组对话框视图的背景。
android:background="@drawable/round_border_white"
完成了! !
你必须改变底部的主题，以实现顶部圆形布局
创建一个自定义绘制background_bottom_sheet_dialog_fragment.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:topLeftRadius="8dp"
android:topRightRadius="8dp" />
<padding android:top="0dp" />
<solid android:color="@color/white" />
</shape>
然后在styles.xml上使用drawable作为背景覆盖bottomSheetDialogTheme:
<!--Bottom sheet-->
<style name="BottomSheet" parent="@style/Widget.Design.BottomSheet.Modal">
<item
name="android:background">@drawable/background_bottom_sheet_dialog_fragment
</item>
</style>
<style name="BaseBottomSheetDialog"
parent="@style/Theme.Design.Light.BottomSheetDialog">
<item name="android:windowIsFloating">false</item>
<item name="bottomSheetStyle">@style/BottomSheet</item>
</style>
<style name="BottomSheetDialogTheme" parent="BaseBottomSheetDialog" />
这将改变你的底页的背景布局
BottomSheetDialog
class SheetFragment() : BottomSheetDialogFragment() {
lateinit var binding: SheetFragmentBinding;
override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
val dialog = super.onCreateDialog(savedInstanceState) as BottomSheetDialog;
val view = View.inflate(context, R.layout.fragment_bottom_sheet, null);
binding = DataBindingUtil.bind(view)!!;
binding.viewModel = SheetFragmentVM();
dialog.setContentView(view);
var bottomSheetBehavior = BottomSheetBehavior.from(view.parent as View);
bottomSheetBehavior.setPeekHeight(BottomSheetBehavior.PEEK_HEIGHT_AUTO);
bottomSheetBehavior.setBottomSheetCallback(object :
BottomSheetBehavior.BottomSheetCallback() {
override fun onStateChanged(bottomSheet: View, newState: Int) {
if (BottomSheetBehavior.STATE_EXPANDED == newState) {
// do on STATE_EXPANDED
}
if (BottomSheetBehavior.STATE_COLLAPSED == newState) {
// do on STATE_COLLAPSED
}
if (BottomSheetBehavior.STATE_HIDDEN == newState) {
dismiss()
}
}
override fun onSlide(bottomSheet: View, slideOffset: Float) {
// do on slide
}
})
return dialog
}
正如在其他答案中指出的，当state为BottomSheetBehavior时。STATE_EXPANDED角将被压平。
你可以通过设置BottomSheetBehavior的peekHeight属性并使用自定义样式来克服这个问题。
abstract class BaseBottomSheetFragment : BottomSheetDialogFragment(){
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
if (state == BottomSheetBehavior.STATE_EXPANDED) {
val displayMetrics = DisplayMetrics()
requireActivity().windowManager!!.defaultDisplay!!.getMetrics(displayMetrics)
(dialog as BottomSheetDialog).behavior.peekHeight = displayMetrics.heightPixels
} else {
(dialog as BottomSheetDialog).behavior.state = state
}
}
override fun getTheme(): Int {
return R.style.CustomBottomSheetDialog
}
}
CustomBottomSheetDialog风格
<style name="CustomBottomSheetDialog" parent="@style/ThemeOverlay.MaterialComponents.BottomSheetDialog">
<item name="bottomSheetStyle">@style/CustomBottomSheet</item>
<item name="materialButtonStyle">@style/CustomMaterialButtonStyle</item>
</style>
<style name="CustomMaterialButtonStyle" parent="@style/Widget.MaterialComponents.Button">
<item name="cornerRadius">@dimen/dialog_bottom_radius</item>
</style>
<style name="CustomBottomSheet" parent="Widget.MaterialComponents.BottomSheet">
<item name="shapeAppearanceOverlay">@style/CustomShapeAppearanceBottomSheetDialog</item>
</style>
<style name="CustomShapeAppearanceBottomSheetDialog" parent="">
<item name="android:background">@android:color/transparent</item>
<item name="backgroundTint">@android:color/transparent</item>
<item name="cornerFamily">rounded</item>
<item name="cornerSizeTopRight">@dimen/dialog_bottom_radius</item>
<item name="cornerSizeTopLeft">@dimen/dialog_bottom_radius</item>
<item name="cornerSizeBottomRight">0dp</item>
<item name="cornerSizeBottomLeft">0dp</item>
</style>
