Android 自定义View(一): 自定义TextView

28 阅读2分钟

效果图:

自定义TextView 的构造函数写法有两种:

第一种比较推荐写法:

class CustomTextView @JvmOverloads constructor(context: Context, attributeSet: AttributeSet? = null, defStyleAttr: Int = 0) : View(context, attributeSet, defStyleAttr) {

第二种写法:

class CustomTextView : View {
    constructor(context: Context) : super(context)
    constructor(context: Context, attrs: AttributeSet?) : super(context, attrs)
    constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int) : super(context, attrs, defStyleAttr)
    constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int, defStyleRes: Int) : super(context, attrs, defStyleAttr, defStyleRes)

接下来就是创建 Paint和初始化一些配置

private var paintText: Paint = Paint()//创建Paint
paintText.isAntiAlias = true  //设置抗锯齿
paintText.color = Color.BLUE  //设置颜色
paintText.textSize = 40F      //设置字体大小

在 onMeasure 中测量文字的宽高

override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec)    
//测量文字的宽高    
paintText.getTextBounds(textStr, 0, textStr.length, rectText)
rectBorder.left = 0  //文字边框的左边坐标
FrectBorder.top = 0  //文字边框的上坐标
FrectBorder.bottom = rectText.height().toFloat()  +30 //文字边框的下坐标
rectBorder.right = rectText.width().toFloat()    +30  //文字边框的右坐标

测量结束以后开始绘制

override fun onDraw(canvas: Canvas?) { 
   super.onDraw(canvas)
    canvas?.drawText(textStr, 0F + 10, rectText.height().toFloat()+ 10, paintText) //绘制文字
    canvas?.drawRoundRect(rectBorder, 15F, 15F, paintTextRect) //绘制文字的边框
   canvas?.drawCircle(600.0F, 600F, 100F, paintCircle) //绘制圆形
}

以上操作总结如下:

首先继承View自定义view  

需要重写  onMeasure 和 onDraw 两个方法,onMeasure是测量,onDraw是绘制

绘制实心图形(矩形、圆形等)默认 Paint 的style 属性是  

FILL : 实心的图形

STROKE :空心描边的图形,需要设置 strokeWidth 属性是边框的宽度 color :边框的颜色

FILL_AND_STROKE : 实心描边

如何确定文字的绘制位置:

如果不指定的话,文字默认绘制在空间的左上角位置

获取到文字的显示宽高 getTextBounds 后,可以根据 width()和 height()得到文字显示的宽高,

然后再根据边框间隙多少设置文字显示的位置和边框的显示位置