BottomSheetDialogFragment

时间:2017-05-08 16:18:57

标签: android

我有一个自定义的BttomSheetDialogFragment,我希望在底部视图顶部有圆角

这是我的自定义类,它让我希望从底部显示我的布局

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"/>

但问题是,当我将此资源文件设置为我的布局根元素的背景时,角落仍未被舍入

我无法使用以下代码:

    this.getDialog().getWindow().setBackgroundDrawableResource(R.drawable.charge_layout_background);

因为它覆盖BottomSheetDialog的默认背景,并且在我的底视图上方不会有任何半透明的灰色

22 个答案:

答案 0 :(得分:65)

创建自定义可绘制的@RunWith(SpringRunner.class) @TestPropertySource(locations = "classpath:bootstrap-test.properties") @ContextConfiguration(classes = LogServiceTestConfig.class) public class DaemonLogServiceTest { @Autowired private LogService logService; @Before public void setUp() { ResultLog log = new ResultLog(); log.setNumberOfRowsProcessed(10); log.setLastCodOperProcessed(1000); log.setStatus(Status.SUCCESS.name()); } @Test public void whenOperationsProcessedThenLog() { logService.newActivity(10, 1000L, Status.SUCCESS); ResultLog log = logService.saveActivity(); Assert.assertNotNull(log); } }

rounded_dialog.xml

然后使用可绘制对象作为背景在<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="@android:color/white"/> <corners android:topLeftRadius="16dp" android:topRightRadius="16dp"/> </shape> 上覆盖bottomSheetDialogTheme

styles.xml

这将更改应用程序的所有BottomSheetDialogs。

答案 1 :(得分:13)

有了新的Material Component库,您就可以使用样式中的 shapeAppearanceOverlay 属性customize the shape来使用组件。

只需使用BottomSheetDialogFragment覆盖onCreateView方法,然后为“底表对话框”定义自定义样式即可。

在应用主题中的bottomSheetDialogTheme中定义styles.xml属性:

  <!-- Base application theme. -->
  <style name="AppTheme" parent="Theme.MaterialComponents.Light">
    <!-- Customize your theme here. -->
    <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>

enter image description here

它需要版本 1.1.0 (当前最新版本为1.1.0-beta02)。

答案 2 :(得分:12)

BottomSheetDialog正在设置默认的白色背景颜色,这就是角落不可见的原因。为了显示它们,您需要通过覆盖{{1的样式来使对话框的背景透明}}

BottomSheetDialog

中定义此样式
res/values/styles/styles.xml

并将此样式设置为BottomSheetDialog

<style name="BottomSheetDialog" parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/bottomSheetStyleWrapper</item>
</style>

<style name="bottomSheetStyleWrapper" parent="Widget.Design.BottomSheet.Modal">
    <item name="android:background">@android:color/transparent</item>
</style>

答案 3 :(得分:8)

我今天正在检查同样的事情,是的,您关于代码

是正确的
this.getDialog().getWindow().setBackgroundDrawableResource(R.drawable.charge_layout_background);

这适用于片段背景,所以你应该从对话框窗口获取底部视图,并在这里更改背景是代码

 @SuppressLint("RestrictedApi")
    @Override
    public void setupDialog(Dialog dialog, int style) {
        super.setupDialog(dialog, style);
        View rootView = getActivity().getLayoutInflater().inflate(R.layout.view_member_info,null,false);
        unbinder = ButterKnife.bind(this, rootView);
        adjustUIComponents();
        dialog.setContentView(rootView);
        FrameLayout bottomSheet = (FrameLayout) dialog.getWindow().findViewById(android.support.design.R.id.design_bottom_sheet);
        bottomSheet.setBackgroundResource(R.drawable.container_background);
    }

这里底部是您想要更改的实际视图。

答案 4 :(得分:7)

对我有用

创建一个名为shape_rounded_dialog的形状

const puppeteer = require('puppeteer');
(async () => {
  const browser = await puppeteer.launch({ headless: true });
  const page = await browser.newPage();
  await page.setViewport({ width: 1280, height: 800 })
  await page.goto('https://corp.freshersworld.com/employers/login?src=cplogout-cphmheadr-corp-   head');


await page.type('#LoginForm_username', 'raghul@corsj.net')
await page.type('#LoginForm_password', 'raghul@990')

await Promise.all([
  page.waitForNavigation(),
  page.click('#login_button'),


]);

await page.goBack()

await page.goto('https://corp.freshersworld.com/post-job?src=DASHJPHome');
await page.waitFor(1000);
await page.screenshot({ path: 'login.png', fullPage: true });





await browser.close();
})();

添加以下样式

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/color_white" />
<corners
    android:topLeftRadius="16dp"
    android:topRightRadius="16dp" />

在DialogFragment类中,方法重写getTheme也会返回您自己的样式。

<style name="AppBottomSheetDialogTheme" parent="Theme.MaterialComponents.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/CustomBottomSheetStyle</item>
</style>

<style name="CustomBottomSheetStyle" parent="Widget.Design.BottomSheet.Modal">
    <item name="android:background">@drawable/shape_rounded_dialog</item>
</style>

答案 5 :(得分:5)

来自Koma Yipanother question的答案为我工作,你应该尝试一下。

  

在drawable中创建一个xml,比如dialog_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/white"/>
    <corners android:radius="30dp" />
    <padding
        android:left="10dp"
        android:top="10dp"
        android:right="10dp"
        android:bottom="10dp" />
</shape>

将它放在你的布局xml根节点中:

  

将其设置为布局xml中的背景

android:background="@drawable/dialog_bg"

并在onCreateView()中提出:

  

将对话框的背景设置为透明

dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

答案 6 :(得分:2)

我知道这个问题已经有一个可以接受的答案。我想记录一下我遇到的问题以及最终如何使它起作用,因此它对将来的人很有用。

首先,我使用Theme.AppCompat.Light.DarkActionBar作为AppTheme的父对象。这意味着@Gabriele Mariotti解决方案始终因错误Could not inflate Behavior subclass com.google.android.material.bottomsheet.BottomSheetBehavior而崩溃。我通过简单地将父级更改为Theme.MaterialComponents.Light.DarkActionBar来解决此问题。这丝毫没有影响我们的主题,但是RTE消失了。您还可以通过简单地将所需项目包括到样式中来解决此问题。但是我不必费心弄清楚BottomSheetBehavior需要哪些样式。

第二,尽我所能,但是我无法获得实际的Frame布局(这是BottomSheetDialogFragment),它具有圆角。我意识到将其设置为Drawable即可,但是不能使用形状或@null。原来是因为我使用的LinearLayout定义了背景。这将覆盖样式中的任何背景。删除该标记最终导致圆角。

此外,我不需要将任何背景形状设置为圆角。我进行上述更改后,@ Gabriele Mariotti的解决方案便开始起作用。但是,要设置我想要的背景颜色,我必须覆盖“ backgroundTint”项。

PS:我是Android开发人员的新手,并且正在维护一个供我学院内部使用的旧应用程序。我对Android的布局系统或材质库不是很熟悉。我想这就是为什么我花了3天的时间才弄清楚这一点的原因。我希望这对以后的人有用。

答案 7 :(得分:2)

setupDialog() 是 RestrictedApi。自 material:1.3.0-beta01 起不涉及主题的最简单解决方案:

res/drawable/bs_background

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle">
  <corners
    android:topLeftRadius="16dp"
    android:topRightRadius="16dp" />
  <solid android:color="@color/dayNightBackground" />
</shape>
public class MyBsDialogFrag extends BottomSheetDialogFragment {

@Override
  public void onViewCreated(View view, Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    ((View) view.getParent()).setBackgroundResource(R.drawable.bs_background);
  }

}

答案 8 :(得分:2)

public class CustomDialogFragment extends BottomSheetDialogFragment {
  @Override
  public void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setStyle(STYLE_NORMAL, R.style. AppBottomSheetDialogTheme);
  }

  ...
}

<style name="AppBottomSheetDialogTheme"
       parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/AppModalStyle</item>
</style>

<style name="AppModalStyle" parent="Widget.Design.BottomSheet.Modal">
    <item name="android:background">@drawable/rail_bottom_sheet_dialog_bg</item>
</style>

答案 9 :(得分:1)

  1. 创建一个可绘制的形状..我们将其用作底页的背景。 为左上角和右上角的半径提供适当的值。

                  

  2. 现在为“底表对话框片段”创建样式

            @ drawable / drawable_bottomsheet_background     

    <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" />
    
  3. 现在创建一个自定义类,该类将扩展BottomSheetDilogFragment,在其中您可以提供样式。

打开类CustomRoundBottomSheet:BottomSheetDialogFragment(){

override fun getTheme(): Int = R.style.BottomSheetDialogTheme

override fun onCreateDialog(savedInstanceState: Bundle?): Dialog = BottomSheetDialog(requireContext(), theme)

}

  1. 现在,如果您要使用圆角底片,请使用此类。 例如

    BottomSheetSuccess类:CustomRoundBottomSheet(){

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.bottomsheet_shopcreate_success, container, false)
    }
    
    
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
    }
    

    }

答案 10 :(得分:1)

添加带有圆角的形状,使其成为根布局的背景

<?xml version="1.0" encoding="utf-8" ?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
 <corners
    android:topLeftRadius="@dimen/padding_margin_16_dp"
    android:topRightRadius="@dimen/padding_margin_16_dp" />
 <solid android:color="@color/white" />
</shape>

在BottomSheetDialogFragment上使背景透明

override fun onActivityCreated(savedInstanceState: Bundle?) {
    super.onActivityCreated(savedInstanceState)
    (view?.parent as View).setBackgroundColor(Color.TRANSPARENT)
}

它适用于约束布局,框架布局,线性布局,相对布局。

答案 11 :(得分:1)

如果您使用last version of material component,则只需覆盖ShapeAppearance.MaterialComponents.LargeComponent(因为底页使用此形状)并设置所需的值,例如:

 <style name="ShapeAppearance.YourApp.LargeComponent" parent="ShapeAppearance.MaterialComponents.LargeComponent">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">12dp</item>
 </style>

然后设置您的应用样式:

<item name="shapeAppearanceLargeComponent">@style/ShapeAppearance.YourApp.LargeComponent</item>

The solution of Gabriele Mariotti类似并且也可以使用,但是这一点更简单。

答案 12 :(得分:1)

具有弯曲形状和透视高度的底板对话框

    <!-- BottomSheet Dialog -->
<style name="BottomSheetDialog" parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/CustomBottomSheet</item>

</style>


<style name="CustomBottomSheet" parent="Widget.MaterialComponents.BottomSheet">
    <item name="shapeAppearanceOverlay">@style/CustomShapeAppearanceBottomSheetDialog</item>
    <item name="behavior_peekHeight">420dp</item>
</style>

<style name="CustomShapeAppearanceBottomSheetDialog" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSizeTopRight">20dp</item>
    <item name="cornerSizeTopLeft">20dp</item>
    <item name="cornerSizeBottomRight">0dp</item>
    <item name="cornerSizeBottomLeft">0dp</item>

</style>

答案 13 :(得分:1)

在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类的setDialogBorder(dialog)方法中调用setupDialog()方法。

现在在drawable文件夹中创建一个shape文件。

<?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"

完成!!

答案 14 :(得分:0)

首先创建一个名为 res/drawablerounded_background.xml :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle">
  <corners
    android:topLeftRadius="32dp"
    android:topRightRadius="32dp" />
  <solid android:color="#D81B60" />
</shape>

然后,使用 setBackgroundResource()

将此 drawable 设置为对话框的根视图

最后覆盖 onCreateDialog() 以设置样式为 android.R.style.Theme_Translucent_NoTitleBar 的主题以具有透明的对话框窗口背景。

public class MyDialogFragment extends BottomSheetDialogFragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater,
                             @Nullable ViewGroup container,
                             @Nullable Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.layout_bottom_sheet, container, false);

        view.setBackgroundResource(R.drawable.rounded_background);
        return view;
    }


    public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {
        return new BottomSheetDialog(requireContext(),
                android.R.style.Theme_Translucent_NoTitleBar); // To have transparent dialog window background.
    }


}

结果:

enter image description here

答案 15 :(得分:0)

如果您需要 setFitContents=true,我尝试通过挂钩 onStateChanged 来解决此问题,但是一旦对话框达到 EXPANDED 状态,它就会从直角闪烁到圆角。挺烦人的。

有一种替代解决方法,它不会导致闪烁,不需要使用私有 API,并且更具可读性(恕我直言)。

查看BottomSheetBehavior的代码我们发现:

  /** True if Behavior has a non-null value for the @shapeAppearance attribute */
  private boolean shapeThemingEnabled;

事实证明,如果禁用形状主题,则不会使用 MaterialShapeDrawable。我们在 BottomSheetBehavior.onLayout() 中找到了这一点:

// Only set MaterialShapeDrawable as background if shapeTheming is enabled, otherwise will
// default to android:background declared in styles or layout.
if (shapeThemingEnabled && materialShapeDrawable != null) {
  ViewCompat.setBackground(child, materialShapeDrawable);
}

默认为 android:background 正是我们所需要的,因为这意味着完全控制背景的呈现方式。

我们可以通过创建单独的样式并将 shapeAppearanceshapeAppearanceOverlay 设置为 null 来禁用材质主题:

<style name="Theme.YourApp.NoShapeBottomSheetDialog" parent="Theme.MaterialComponents.BottomSheetDialog">
  <item name="bottomSheetStyle">@style/Theme.YourApp.NoShapeButtonSheet</item>
</style>

<style name="Theme.YourApp.NoShapeButtonSheet" parent="Widget.MaterialComponents.BottomSheet.Modal">
  <item name="shapeAppearance">@null</item>
  <item name="shapeAppearanceOverlay">@null</item>
</style>

扩展 BottomSheetDialogFragment 并覆盖 onCreateDialog

public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {
  return new BottomSheetDialog(requireContext(),
                R.style.Theme_Grupin_NoShapeBottomSheetDialog);
}

底页现在是裸露的,根本没有任何背景。所以我们可以添加任何我们想要的背景,不再触发任何动画。

答案 16 :(得分:0)

简单的解决方案:

class TopRoundedCornersFragment : BottomSheetDialogFragment() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setStyle(STYLE_NORMAL, R.style.AppBottomSheetDialogTheme)
    }
}

在styles.xml中

<style name="BottomSheetStyle" parent="Widget.Design.BottomSheet.Modal">
    <item name="android:background">@drawable/bottom_sheet_dialog_bg</item>
</style>

<style name="AppBottomSheetDialogTheme" parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/BottomSheetStyle</item>
</style>

最后,创建一个圆角可绘制的顶部资源(bottom_sheet_dialog_bg.xml)

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <solid android:color="@android:color/white" />
    <corners
        android:topLeftRadius="4dp"
        android:topRightRadius="4dp" />

</shape>

答案 17 :(得分:0)

完整的解决方案:

将以下style属性添加到style.xml。

<style name="AppBottomSheetDialogTheme"
    parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/AppModalStyle</item>
</style>

<style name="AppModalStyle"
    parent="Widget.Design.BottomSheet.Modal">
    <item name="android:background">@drawable/bottom_sheet_background</item>
</style>

然后使用 AppBottomSheetDialogTheme 从您的代码创建一个底部工作表对话框。

private fun openBottomSheetTermsCondition() {
    val mBottomSheetDialog = BottomSheetDialog(requireContext(),R.style.AppBottomSheetDialogTheme)
    val sheetView = layoutInflater.inflate(R.layout.bottom_sheet_travel_advice_terms, null)
    mBottomSheetDialog.setContentView(sheetView)
    sheetView.tv_head.setOnClickListener {
        mBottomSheetDialog.dismiss()
    }

    sheetView.webView.loadDataWithBaseURL(null,getString(R.string.privacy_policy_body_html),"text/html", "utf-8", null)
    mBottomSheetDialog.show()
}

我使用下面的drawable舍入底部工作表背景。

    <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:topLeftRadius="@dimen/bottom_sheet_corner_radius"
        android:topRightRadius="@dimen/bottom_sheet_corner_radius" />
    <solid android:color="@color/white" />
</shape>

底页xml bottom_sheet_travel_advice_terms.xml

    <?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:behavior_hideable="false"
    app:behavior_peekHeight="@dimen/bottom_sheet_peek_height"
    app:cardCornerRadius="@dimen/spacing_normal"
    app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/spacing_small">

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/begin_horizontal_guideline"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            app:layout_constraintGuide_begin="@dimen/activity_vertical_margin" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/begin_vertical_guideline"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_begin="@dimen/activity_horizontal_margin" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/end_vertical_guideline"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_end="@dimen/activity_horizontal_margin" />

        <View
            android:id="@+id/sheet_header_shadow"
            android:layout_width="match_parent"
            android:layout_height="@dimen/spacing_tiny"
            android:layout_marginStart="10dp"
            android:layout_marginEnd="10dp"
            android:background="@drawable/bottom_sheet_header_shadow"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <androidx.appcompat.widget.AppCompatTextView
            android:id="@+id/tv_head"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:drawablePadding="@dimen/spacing_normal"
            android:fontFamily="sans-serif-medium"
            android:gravity="start"
            android:padding="@dimen/spacing_small"
            android:text="@string/term_and_condition"
            android:textColor="@color/greyish_brown"
            android:textSize="20sp"
            app:drawableLeftCompat="@drawable/ic_close_black_24dp"
            app:layout_constraintEnd_toEndOf="@id/end_vertical_guideline"
            app:layout_constraintStart_toStartOf="@id/begin_vertical_guideline"
            app:layout_constraintTop_toBottomOf="@+id/begin_horizontal_guideline" />

        <View
            android:id="@+id/line_separation"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_marginTop="@dimen/spacing_small"
            android:background="@color/blue_gray"
            app:layout_constraintTop_toBottomOf="@+id/tv_head" />

        <WebView
            android:id="@+id/webView"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            app:layout_constraintEnd_toEndOf="@id/end_vertical_guideline"
            app:layout_constraintStart_toStartOf="@id/begin_vertical_guideline"
            app:layout_constraintTop_toBottomOf="@id/line_separation" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.cardview.widget.CardView>

答案 18 :(得分:0)

您必须更改bottom sheet theme才能获得最佳回合布局

创建自定义可绘制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上覆盖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
}

答案 19 :(得分:0)

此答案仅适用于在为布局设置带圆角背景的drawable后将背景颜色设置为Color.TRANSPARENT的问题。

除了覆盖Color.TRANSPARENT解决方案外,没有任何答案可以将背景颜色设置为setupDialog()

@Override
public void setupDialog(Dialog dialog, int style) {
    super.setupDialog(dialog, style);
    View contentView = View.inflate(getContext(), 
R.layout.fragment_bottom_sheet, null);
    dialog.setContentView(contentView);
    ...
    ((View) contentView.getParent()).setBackgroundColor(ContextCompat.getColor(getContext(), android.R.color.transparent));
}

但是您在此处设置对话框的contentView不是view onViewCreated()onCreateView()中充气时View Bindings。它打破了标准流程,因此可能会出现问题,例如您无法在Kotlin Android Extensions中使用onViewCreated() - onActivityCreated()

所以我稍微调整一下来设置override fun onActivityCreated(savedInstanceState: Bundle?) { super.onActivityCreated(savedInstanceState) (view?.parent as View).setBackgroundColor(Color.TRANSPARENT) } 中的背景:

globals

希望这个有同样麻烦的帮助

答案 20 :(得分:0)

创建一个带圆角的自定义drawable,并将其设置为BottomSheetDialogFragment布局根目录的背景

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">

<solid android:color="@color/colorPrimary" />

<corners
    android:bottomLeftRadius="0dp"
    android:bottomRightRadius="0dp"
    android:topLeftRadius="12dp"
    android:topRightRadius="12dp" />

</shape>

然后只需将以下代码添加到BottomSheetDialogFragment类

即可
@Override
public void setupDialog(Dialog dialog, int style) {
    super.setupDialog(dialog, style);
    View contentView = View.inflate(getContext(), 
R.layout.fragment_bottom_sheet, null);
    dialog.setContentView(contentView);

    CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) ((View) contentView.getParent())
            .getLayoutParams();
    CoordinatorLayout.Behavior behavior = params.getBehavior();
    ((View) contentView.getParent()).setBackgroundColor(ContextCompat.getColor(getContext(), android.R.color.transparent));
}

您甚至可以使用参数来设置下面的边距

params.setMargins(50, 0, 50, 0);

答案 21 :(得分:0)

解决此问题的另一种方法是扩展BottomSheetDialog并创建一个适合您需求的自定义类。您可以对布局xml文件执行相同操作,并添加所需的背景或任何其他自定义。这也有一个好处,你不会依赖于Android(android.support.design.R.id.design_bottom_sheet)使用的id名称,同时改变背景(虽然id名称的更改很少发生AFAIK)。 / p>