BottomSheetDialogFragment의 둥근 모서리


112

사용자 지정 BttomSheetDialogFragment가 있고 Bottom View 상단에 둥근 모서리를 갖고 싶습니다.

이것은 내가 바닥에서 나타나고 싶은 레이아웃을 팽창시키는 내 Custom 클래스입니다.

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의 기본 배경을 재정의하고 하단 뷰 위에 반투명 회색 색상이 없기 때문에


5
@RasoolGhana-이 링크를보십시오 : medium.com/halcyon-mobile/…
Mohit Charadva

답변:


231

사용자 정의 드로어 블 만들기 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사용하도록 재정의 합니다.

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">       
    <item name="bottomSheetDialogTheme">@style/AppBottomSheetDialogTheme</item>
</style>

<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/rounded_dialog</item>
</style>

그러면 앱의 모든 BottomSheetDialogs가 변경됩니다.


2
그것은 나를 위해 작동합니다. 또한 레이아웃 루트 요소에 따라 달라지는 것으로 나타났습니다. (I 둥근 모서리에 다른 방법을 시도 원인) 우선 내가 루트로 cardview 있었다, 그때 선형 레이아웃을 변경하고 지금은 완벽하게 작동
이반 Shafran을

1
Android API 17에서 충돌
Morteza Rastgoo 2019 년

1
맨 위 모서리 만 둥글게 된 배경에는 rounded_dialog& AppModalStyle이름을 사용하지 않을 것입니다. 이러한 배경은 맨 아래 시트 스타일에만 사용할 것으로 예상하기 때문입니다. 어떻습니까 bottomsheet_rounded_background&AppBottomSheetStyle
hmac

3
루트보기에서 배경을 지정하면이 설정이 무시됩니다
hmac

2
시트 레이아웃의 루트 요소에 배경이 없는지 확인하십시오!
MMK

81

새로운 Material Component 라이브러리를 사용하면 스타일 의 속성을 사용하여 구성 요소 의 모양사용자 정의 할 수 있습니다shapeAppearanceOverlay ( 참고 : 버전 1.1.0 필요 ).

그냥 사용 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>

여기에 이미지 설명 입력


앱 테마 BottomSheetDialogFragment를 추가하는 대신 이 메서드를 재정의하는 동일한 동작을 얻을 수 있습니다 bottomSheetDialogTheme.

@Override public int getTheme() {
    return R.style.CustomBottomSheetDialog;
  }

이 경우이 themeOverlay BottomSheetDialogFragment를 모든 앱이 아닌 단일에서만 사용 하고 있습니다.


확장 상태 에 대한 중요 참고 사항 :

펼쳐진 상태에서 BottomSheet 에는 평평한 모서리가 있습니다. github repo 에서 공식 댓글을 확인할 수 있습니다 .

우리 디자인 팀은 둥근 모서리는 스크롤 가능한 콘텐츠를 나타내고 평평한 모서리는 추가 콘텐츠가 없음을 나타냅니다. 따라서 그들은 우리가 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) {
          //In the EXPANDED STATE apply a new MaterialShapeDrawable with rounded cornes
          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 =

      //Create a ShapeAppearanceModel with the same shapeAppearanceOverlay used in the style
      ShapeAppearanceModel.builder(getContext(), 0, R.style.CustomShapeAppearanceBottomSheetDialog)
        .build();

      //Create a new MaterialShapeDrawable (you can't use the original MaterialShapeDrawable in the BottoSheet)
      MaterialShapeDrawable currentMaterialShapeDrawable = (MaterialShapeDrawable) bottomSheet.getBackground();
      MaterialShapeDrawable newMaterialShapeDrawable = new MaterialShapeDrawable((shapeAppearanceModel));
      //Copy the attributes in the new MaterialShapeDrawable
      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;
  }

2
@GabrieleMariotti는이 기술을 사용하여 시트의 어딘가를 탭했는데 닫히지 않으면 모서리가 애니메이션으로 표시됩니다. Android 머티리얼 컴포넌트에서 개발하고 있는지 확실하지 않지만, 그렇다면이 문제를 알고 계셨습니까? 1.1.0-alpha10을 사용하고 있었지만 beta2도 확인했습니다. 나는 그것이 내가 시트에 넣은 정확한 견해에 달려 있는지 확실하지 않습니다.
androidguy

1
이 문제를보고했습니다. issuetracker.google.com/issues/144859239 문제에 대한 추가 결과 나 해결책이있는 사람이 있으면 답장 해주세요. 감사!
androidguy

4
이 오류가 발생하고 v1.1.0-beta02에서 충돌이 발생합니다Could not inflate Behavior subclass com.google.android.material.bottomsheet.BottomSheetBehavior
hkchakladar

3
하단 시트 대화 상자가 확장되면 작동하지 않습니다. 어떤 생각?
José Carlos

4
이것은 완벽하고 최신 답변이었습니다. 답변으로 표시해야합니다
Vikas Acharya

38

(가) BottomSheetDialog모서리가 보이지 않는 이유는 기본 흰색 배경 색상을 설정하는 것입니다, 이것은 당신의 스타일을 재정 의하여 대화의 배경을 투명하게 할 필요가 그들에게 보여주기 위해서입니다 BottomSheetDialog.

이 스타일을 정의하십시오. res/values/styles/styles.xml

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

이 스타일을 BottomSheetDialog로 설정하십시오.

View view = getLayoutInflater().inflate(R.layout.chooser_bottom_sheet, null);
BottomSheetDialog dialog = new BottomSheetDialog(this,R.style.BottomSheetDialog); // Style here
dialog.setContentView(view);
dialog.show();

2
이렇게하면 다른 BottomSheetDialogs에서 다른 배경을 가질 수 있기 때문에 허용 된 답변보다 낫습니다
Luke

이제 곡선이 표시되지만 터치시 화면 전체에 투명한 색상이 표시됩니다. 하단 대화 상자의 흰색 만 표시됩니다. @Badr 어떤 수정이 있습니까?
Arnold Brown

여기서 일했습니다. 감사!
Michel Fernandes

그것이 제가 찾던 해결책입니다. 완전히 해킹되지 않았습니다.
Prateek Gupta

26

rounded_corners_shape라는 모양을 만듭니다.

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

</shape>

스타일을 정의하다

  <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/rounded_corners_shape</item>
    </style>

이 스타일을 사용자 지정 BottomSheetDialogFragment에서 이와 같이 사용하면 작동합니다!

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

      ...
    }

코드와 함께 설명을 추가하면 도움이 될 것입니다.
UditS

이것은 Fragments에 대한 테마를 설정하는 올바른 장소 입니다.
DYS

10

마지막 버전의 재료 구성 요소 를 사용하는 경우 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>

Gabriele Mariotti의 솔루션 도 비슷하고 작동하지만 이것은 더 간단합니다.


다른 비교가 훨씬 더 나은 솔루션입니다 설정 사용자 지정 당김에 기본이 밖으로 솔루션의 대부분 때문에
D-feverx

1
멋지네요. 이것은 또한 적용 BottomSheetDialog됩니까?
Jaden Gu

1
모두 참고 사항 :이 답변을 사용하면 사용 ShapeAppearance.MaterialComponents.LargeComponent하는 모든 구성 요소 가 Bottom Sheet뿐만 아니라 동일한 cornerSize 및 패밀리를 갖습니다. 스타일 요구 사항을 확인하고 모든 구성 요소 또는 개별 구성 요소 또는 위젯의 모양을 변경할 것인지 결정하십시오.
nitinkumarp

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);
    }

여기 하단 시트는 변경하려는 실제보기입니다.


내가이 일을하는 유일한 방법. BTW 내가 사용하고 BottomSheetDialogFragment그 논리는에 그래서 onCreateDialog방법
키릴 Starostin

8

의해 답변 코마 깨갱 에서 또 다른 질문 나를 위해 일한, 당신은 그것을 시도해야합니다.

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));

이것은 농구를 뛰어 넘지 않고 모든 DialogFragments에서 작동하기 때문에 올바른 솔루션이어야합니다.
jssingh

3
저에게는 둥근 모서리 뒤에 여전히 흰색 모서리가 있습니다. 따라서 드로어 블의 색상을 빨간색으로 변경하면 코드가 올바르게 작동하고 둥근 빨간색 직사각형이 생성되지만 그 뒤에는 기본 흰색 직사각형이 여전히 있습니다. "dialog.getWindow (). setBackgroundDrawable는 ..." 코드는 변경 내 대화 위 영역 "어두워"전체의 색상을 썼다, 그러나 다시, 그것은 그 두 개의 작은 코너를 벗어났습니다. 이 문제의 원인을 알고 있습니까?
Nick Dev

위의 설명에 추가하여 코드를 실행하려면 onCreateView () 의 코드 를 " getDialog () .getWindow () ..." 로 변경해야했습니다. 아마도 이것이 나를 위해 작동하지 않는 이유입니다.
Nick Dev

1
@NickDev이 솔루션이 코드에 적용되지 않는다고 생각되면 새 질문을 게시하고 해결책을 찾을 수있을 것입니다.
Variag

@Variag 문의 해 주셔서 감사합니다. 실제로 기본 하단 시트 모달 대화 상자를 그 뒤에 어두운 영역과 동일한 색상의 사각형으로 덮는 저렴한 해결 방법을 생각해 냈습니다. 그런 다음 그 위에 둥근 모서리가있는 두 번째 직사각형을 추가했습니다. 이상적은 아니지만 멋져 보입니다! 그럼에도 불구하고 도움을 주셔서 감사합니다.
Nick Dev

6
  1. 하단 시트의 배경으로 사용할 모양 드로어 블 ..을 만듭니다. 왼쪽 상단과 오른쪽 모서리의 반경에 적절한 값을 제공합니다.

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <corners
            android:topLeftRadius="24dp"
            android:topRightRadius="24dp" />
        <padding android:top="2dp" />
        <solid android:color="@color/white" />
    </shape>
    
  2. 이제 "Bottom sheet dialog fragment"에 대한 스타일을 만듭니다.

    <style name="BottomSheet" parent="@style/Widget.Design.BottomSheet.Modal">
            <item name="android:background">@drawable/drawable_bottomsheet_background</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" />
    
  3. 이제 스타일을 제공하는 BottomSheetDilogFragment를 확장하는 사용자 정의 클래스를 만듭니다.

    open class CustomRoundBottomSheet : BottomSheetDialogFragment() {
    
        override fun getTheme(): Int = R.style.BottomSheetDialogTheme
    
        override fun onCreateDialog(savedInstanceState: Bundle?): Dialog = BottomSheetDialog(requireContext(), theme)
    
    }
    
  4. 이제 둥근 모서리 하단 시트를 원할 때마다이 클래스를 사용하십시오. 예 :

    class 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)
        }
    
    } 
    

5

그것은 나를 위해 일했습니다

shape_rounded_dialog라는 모양을 만듭니다.

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

아래 스타일 추가

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

DialogFragment 클래스에서 getTheme 메서드 재정의는 Yourself 스타일도 반환합니다.

@Override
public int getTheme() {
    return R.style.AppBottomSheetDialogTheme;
}

4

이 답변은 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 ExtensionsonViewCreated()

그래서 배경을 설정하기 위해 약간 조정했습니다 onActivityCreated().

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

같은 문제를 겪은이 도움을 바랍니다


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에 어떤 스타일이 필요한지 고민하지 않았습니다.

둘째, 가능한 한 시도했지만 둥근 모서리를 갖는 데 사용되는 실제 프레임 레이아웃 (BottomSheetDialogFragment)을 가져올 수 없습니다. 이것을 이미지 Drawable로 설정하면 작동하지만 모양이나 @null. LinearLayout내가 사용했던 배경이 정의되어 있었기 때문 입니다. 이것은 스타일의 배경을 재정의했습니다. 그것을 제거하면 마침내 둥근 모서리가 생겼습니다.

또한 모서리를 둥글게 설정하기 위해 배경 모양을 설정할 필요가 없었습니다. @Gabriele Mariotti의 솔루션은 위의 변경 사항을 적용하자마자 작동했습니다. 그러나 원하는 배경색을 설정하려면 "backgroundTint"항목을 재정의해야했습니다.

추신 : 저는 Android 개발자를 처음 사용하며 대학 내부 용으로 만들어진 오래된 앱을 유지하고 있습니다. 저는 Android의 레이아웃 시스템이나 재료 라이브러리에 익숙하지 않습니다. 그래서 이것을 알아내는 데 3 일이 걸린 것 같아요. 나는 이것이 미래의 누군가에게 유용하기를 바랍니다.


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()메서드를 호출 합니다.

이제 드로어 블 폴더에 모양 파일을 만듭니다.

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

끝난!!


setMargins와 함께 어떤 뷰를 사용합니까?
tmm1

FrameLayout bottomSheet; 이것은 setDialogBorder () 메서드에 정의되어 있습니다. 이것은 실제로 Android의 하단 시트 대화 상자에 대한 기본보기입니다. 잘 작동합니다.
DalveerSinghDaiya

0

이 문제를 해결하는 또 다른 방법은 BottomSheetDialog를 확장하고 필요에 맞는 사용자 지정 클래스를 만드는 것입니다. 레이아웃 xml 파일에 대해 동일한 작업을 수행하고 필요한 배경 또는 기타 사용자 정의를 추가 할 수 있습니다. 또한 배경을 변경하는 동안 Android (android.support.design.R.id.design_bottom_sheet)에서 사용하는 ID 이름에 의존하지 않는다는 이점도 있습니다 (ID 이름 변경은 AFAIK가 거의 발생하지 않음).


0

모서리가 둥근 사용자 지정 드로어 블을 만들고 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);

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
}

0

둥근 모서리로 모양을 추가하고 루트 레이아웃의 배경으로 만듭니다.

<?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)
}

Contraintlayout, Framelyaout, Linearlayout, Relativelayout에 대한 작업.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.