透明的各种形状的view，以及各种形状的imageview

根据前面写的几片透明形状的view的总结，实现了遮罩层各种形状的透明的view，以及各种形状的imageview

先上图：

正常view	带边框的view

如上图所示：途中左右两列为不同的两个控件，左侧的是ShapeShadeImageView，右侧的是ShapeImageView。

view	优势	劣势
ShapeShadeImageView	能在xml中直接能显示成需要显示的形状	其实大小并没有变化，是上面遮盖了一层，如果底部的背景色是渐变的话，能看出周边的轮廓
ShapeImageView	能直接裁剪成想要的图形大小，没有多余的部分	不能在xml中直接能显示成需要显示的形状

如下图所示：

当然，如果背景色统一的话，是可以设置成一致的，渐变的背景的话就能看出来了。

属性说明

<declare-styleable name="ShapeImageView">
        <attr name="borderWidth" format="dimension"/>//边框线的宽度
        <attr name="borderColor" format="color"/>//边框线的颜色
        <attr name="borderLine" format="enum">//边框线的属性，是虚线还是实线，默认实线
            <enum name="full" value="0"/>//实线
            <enum name="dotted" value="1"/>//虚线
        </attr>
        <attr name="borderDotted" format="dimension"/>//borderLine为dotted时，设置线条的长度
        <attr name="borderBlack" format="dimension"/>//borderLine为dotted时，设置线条间空格的长度
        <attr name="frameColor" format="color"/>//这个主要是ShapeShadeImageView边上的颜色，以便能与背景融合
        <attr name="shapeView" format="enum">//你想要的图形
            <enum name="circle" value="0"/>//圆
            <enum name="round" value="1"/>//圆角矩形
            <enum name="oval" value="2"/>//椭圆
            <enum name="rightAngleCircle" value="3"/>//这就是上面图片中尖角图形
        </attr>
        <attr name="shapeRadius" format="dimension"/>//圆形时，圆的半径，这个也可不设置，通过直接设置宽高，会自动计算，去掉margin和padding等长度
        <attr name="shapeHeight" format="dimension"/>//ShapeShadeView在round时设置圆角矩形的高度
        <attr name="rightAngleLocation">//图形为rightAngleCircle时的尖角位置，可以组合使用，以‘｜’隔开，如leftTop｜leftBottom｜rightTop
            <flag name="leftTop" value="0x03"/>
            <flag name="leftBottom" value="0x30"/>
            <flag name="rightTop" value="0x05"/>
            <flag name="rightBottom" value="0x50"/>
        </attr>
        <attr name="cornersX" format="dimension"/>//图形为圆角矩形时，设置的圆角
        <attr name="cornersY" format="dimension"/>//图形为圆角矩形时，设置的圆角
    </declare-styleable>

使用

使用起来也很简单：

椭圆：

<com.tqp.transparentView.ShapeShadeImageView
    android:id="@+id/shapeView3"
    android:layout_width="100dp"
    android:layout_height="150dp"
    android:src="@mipmap/ic_launcher"
    android:scaleType="centerCrop"
    app:shapeView="oval" />

带尖角的图形

<com.tqp.transparentView.ShapeImageView
    android:id="@+id/shapeImageView2"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:src="@mipmap/ic_launcher"
    android:scaleType="centerCrop"
    app:borderWidth="4dp"
    app:borderColor="@color/bright_red"
    app:shapeView="rightAngleCircle"
    app:rightAngleLocation="leftBottom|rightTop" />

带虚线边框的圆形图片

<com.tqp.transparentView.ShapeShadeImageView
    android:id="@+id/shapeView2"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:src="@mipmap/ic_launcher"
    android:scaleType="centerCrop"
    app:borderWidth="4dp"
    app:borderColor="@color/bright_red"
    android:layout_marginTop="10dp"
    app:shapeView="rightAngleCircle"
    app:rightAngleLocation="rightBottom|leftTop" />

上面的自定义view支持Android api14和api14以上。

引入库的方法

第一步，在项目所在的build.gradle中加入maven { url 'https://jitpack.io'}

allprojects {
    repositories {
       ...
        maven { url 'https://jitpack.io'}
    }
}

第二步，在app所在的build.gradle下的dependencies中依赖implementation 'com.github.tangqipeng:shapeTransparentView:1.4'就好。

这样就可以使用了

附加

shapeTransparentView中还有一个遮罩的view是ShapeShadeView，也支持上面的所有属性设置。