ShapeableImageView的骚操作

<com.google.android.material.imageview.ShapeableImageView
        android:id="@+id/ivCoverIndexItem"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:padding="4dp"
        app:shapeAppearance="@style/rectRound8ImageStyle"
        app:strokeColor="#0098a7"
        app:strokeWidth="4dp"
        android:contentDescription="@null"
        android:scaleType="centerCrop"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

给图片添加描边

给图片添加描边的重点是strokeColor、strokeWidth和padding三个属性，定义了描边的宽度strokeWidth，一定要使用padding给描边留够足够的显示区域，不然描边会被截断。

 

---

给图片设置形状 

给图片设置形状的重点在于：app:shapeAppearance属性引用的样式问文件，以下展示几个示例形状的样式文件给大家参考。

圆角矩形图片、圆形图片，其区别在于cornerSize数值的定义

圆角矩形：

<style name="imgStyleRectRound8">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">8dp</item>
    </style>

圆形图片：

<style name="imgStyleCircle">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">50%</item>
    </style>

 

菱形图片

<style name="imgStyleDiamond">
        <item name="cornerFamily">cut</item>
        <item name="cornerSize">50%</item>
    </style>

 

矩形切角 

<style name="imgStyleRectCut8">
        <item name="cornerFamily">cut</item>
        <item name="cornerSize">8dp</item>
    </style>

 

扇形图片

<style name="imgStyleFan">
        <item name="cornerFamilyTopLeft">rounded</item>
        <item name="cornerSizeTopLeft">100%</item>
    </style>

 

叶形（纺锤形）

<style name="imgStyleLeaf">
        <item name="cornerFamilyTopLeft">rounded</item>
        <item name="cornerFamilyBottomRight">rounded</item>
        <item name="cornerSizeTopLeft">50%</item>
        <item name="cornerSizeBottomRight">50%</item>
    </style>

 

---