Different corner radius values for a MaterialCardView

£可爱£侵袭症+ 提交于 2021-02-18 22:27:08

问题


Is is possible to have different values for each corner radius of a MaterialCardView? And if so how?

I tried something like the code below but it doesn't seem to have any effect

    float radius = getContext().getResources().getDimension(R.dimen.default_corner_radius);
    ShapePathModel leftShapePathModel = new ShapePathModel();
    leftShapePathModel.setTopLeftCorner(new RoundedCornerTreatment(radius));
    leftShapePathModel.setTopRightCorner(new RoundedCornerTreatment(radius));
    MaterialShapeDrawable bg = new MaterialShapeDrawable(leftShapePathModel);
    container.setBackground(bg);

where container is

@BindView(R.id.container) MaterialCardView container;

回答1:


You can use a custom style and the shapeAppearanceOverlay attribute.

  <style name="MyCardView" parent="@style/Widget.MaterialComponents.CardView">
    <item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay.MaterialCardView.Cut</item>
  </style>


  <style name="ShapeAppearanceOverlay.MaterialCardView.Cut" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSizeTopRight">8dp</item>
    <item name="cornerSizeTopLeft">8dp</item>
    <item name="cornerSizeBottomRight">0dp</item>
    <item name="cornerSizeBottomLeft">0dp</item>
  </style>

or you can apply a custom ShapeAppearanceModel to the corner of the card using something like:

float radius = getResources().getDimension(R.dimen.my_corner_radius);
cardView.setShapeAppearanceModel(
  cardView.getShapeAppearanceModel()
      .toBuilder()
      .setTopLeftCorner(CornerFamily.ROUNDED,radius)
      .setTopRightCorner(CornerFamily.ROUNDED,radius)
      .setBottomRightCornerSize(0)
      .setBottomLeftCornerSize(0)
      .build());




回答2:


I think you should be able to call ShapeAppearanceModel shape = ((MaterialShapeDrawable)container.getBackground()).getShapeAppearanceModel() on your MaterialCardView. From there you could call setTopLeftCorner() or the other methods to set corner treatments with different values. You may need to call container.invalidate() after you set the corners.




回答3:


My initial solution was correct but it was missing one line:

float radius = getContext().getResources().getDimension(R.dimen.default_corner_radius);
ShapePathModel leftShapePathModel = new ShapePathModel();
leftShapePathModel.setTopLeftCorner(new RoundedCornerTreatment(radius));
leftShapePathModel.setTopRightCorner(new RoundedCornerTreatment(radius));
MaterialShapeDrawable bg = new MaterialShapeDrawable(leftShapePathModel);
container.setBackground(bg);

If you add

container.invalidate()

as suggested by Cameron above it seems to work.




回答4:


Try This Also

     <style name="TopCornerCardview" parent="Widget.MaterialComponents.CardView">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSizeTopRight">@dimen/dp25</item>
        <item name="cornerSizeTopLeft">@dimen/dp25</item>
        <item name="cornerSizeBottomRight">0dp</item>
        <item name="cornerSizeBottomLeft">0dp</item>
        <item name="contentPadding">0dp</item>
    </style>

    <com.google.android.material.card.MaterialCardView
            style="@style/TopCornerCardview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/TopCornerCardview"
            app:cardBackgroundColor="@color/colorAccent"
            app:cardUseCompatPadding="true">

>
<!--views here-->
</com.google.android.material.card.MaterialCardView>


来源:https://stackoverflow.com/questions/54688737/different-corner-radius-values-for-a-materialcardview

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!