Android自定义View之自定义每个角形状的ImageView

时间：2022-08-31 00:11:36

前言：

在平常的项目中也许会遇见很多对页面展示有很多固定要求的控件View，各种美轮美奂的效果很是吸引人们的眼球！当然如果仅仅只是使用原生的一些控件来进行日常开发，一些基本的需求是完全可以满足的，可是针对一些拥有特殊属性的控件效果就远远不够了，这个时候就需要我们开发者来自己定义相应的View.

引入：

话不多说，先来看看效果图：
 

可以看到图中这个ImageView的四个角的显示是不规则的，而且可以随意的切换其展示的大小，用于完美的加载图片。好，效果图看了之后接下来就开始说说这个自定义控件是怎么实现的吧！
 

步骤：一共分为六步
 

步骤一：
 


  定义一个类继承与ImageView,然后定义出实现功能需要的一些变量 

 

 
 
private float mRadius;//圆心
private boolean mTopLeft;//左上
private boolean mTopRight;//右上
private boolean mBottomRight;//右下
private boolean mBottomLeft;//左下
//对应位置的坐标
private float mTopLeftRadius;
private float mTopRightRadius;
private float mBottomRightRadius;
private float mBottomLeftRadius;
private int mType;//类型   椭圆是2   圆 1
private Paint mPaint;//画笔
private Path mPath;//路径
private float[] mFloats;//画圆的数组
 然后在其构造方法里对这些变量进行相应的初始化 
 Android自定义View之自定义每个角形状的ImageView




步骤二：定义一个数组来确定是要针对那个角进行操作
 

 

步骤三：定义一个常量接口来确定需要画什么形状的角标
 

 

protected interface M_TYPE {
    int CIRCLE = 10;
    int ROUND = 11;
    int SROUND = 12;
}
 

步骤四：利用onMeasure方法对需要定义的控件进行重新测量以及利用onDraw方法滑出相应的圆角。此处代码相对比较多，我就不贴图，我会在文章末尾贴上源代码。
 

步骤五：在Values文件夹下的attrs文件里定义对应的属性，例如：
 

 

<attr name="radius" format="dimension"></attr>
<attr name="topleft" format="boolean"></attr>
<attr name="topright" format="boolean"></attr>
<attr name="bottomright" format="boolean"></attr>
<attr name="bottomleft" format="boolean"></attr>
<attr name="topleft_radius" format="dimension"></attr>
<attr name="topright_radius" format="dimension"></attr>
<attr name="bottomright_radius" format="dimension"></attr>
<attr name="bottomleft_radius" format="dimension"></attr>


步骤六：最后在需要使用到的布局文件里面引用并设置响应的属性 

 

<sz.hs.xp.demo1.MCustomImageView
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:layout_centerInParent="true"
    android:src="@mipmap/ai"
    android:scaleType="centerCrop"
    app:type="sround"
    app:radius="12dp"
    app:topleft="true"
    app:topright="false"
    app:bottomright="true"
    app:bottomleft="false"
    app:topleft_radius="12dp"
    app:topright_radius="12dp"
    app:bottomright_radius="48dp"
    app:bottomleft_radius="12dp"/>
最后大功告成！接下来贴上demo的 
源代码下载地址：http://download.csdn.net/detail/qq_34942689/9798470 

 

 

 

 

 

标签：
相关文章