自定义View的简单案例（3） 记事本的实现

经过前面两个小案例的学习，下面我们来通过自定义控件实现记事本的效果的控件

talk is cheap ，show me  the code ! 废话不多说上代码：

首先新建类继承EditText：

此案例的重点是设置每行之间的间隔以及画每条间隔线

package demo.liuchen.com.android27_customview.MyEditTextCustom;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.widget.EditText;

import java.lang.reflect.UndeclaredThrowableException;

import demo.liuchen.com.android27_customview.R;

/**
 * Created by ${LC} on 2016/11/22.
 */

public class MyEditText extends EditText{
    private Paint paint;

    private  int padding;
    public MyEditText(Context context) {
        super(context);
        intiPaint();
    }


    public MyEditText(Context context, AttributeSet attrs) {
        super(context, attrs);
        intiPaint();

        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.myEditText);
        //获取重写属性
        padding = (int) typedArray.getDimension(R.styleable.myEditText_myedit_Padding,0);

        typedArray.recycle();
        /**
         * setPadding是editText中的方法用于规定EditText内部的间距
         * @param ：lefe ：规定文字内容的起点
         * @param ：top ：EditText内容上方在y轴的坐标
         * @param ：right: edittext内容右边距离边框的值
         * @param ：buttom：edtitext内容下方距离下边框的值
         * getLineHeight():获取文字内容两行之间的距离
         */

        setPadding(padding,10,padding,10);
    }

    private void intiPaint() {
        paint = new Paint();
        paint.setAntiAlias(true);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //获取edittext文字内容两行中间的距离
        int lineHeight = getLineHeight();
        //获取整个空间的宽度
        int width = getWidth();
        //获取整个控件的高度
        int height = getHeight();
        //一个edittext所需画出的总横线数
        int lineNums = height/lineHeight;

        /**
         * 画布方法:画一条线
         * @param startX：画的线的起点所在的x轴坐标
         * @param startY：画的线的起点所在的y轴坐标
         * @param stopX： 画的线的终点所在的x轴坐标
         * @param stopY： 画的线的终点所在的y轴坐标
         * @param Paint： 画笔
         *            可以改变lineNum添加行数
         */
        for (int i = 0; i < lineNums ; i++) {
            canvas.drawLine(padding,lineHeight*(i+1)+10,width-padding,lineHeight*(i+1)+10,paint);
        }
    }
}

在res的values文件夹下新建attrs文件，添加以下代码：

  <!--自定义edittext-->
    <declare-styleable name="myEditText">
        <attr name="myedit_Padding" format="dimension"/>
    </declare-styleable>

之后在layot文件中使用代码如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_my_edit_text"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="demo.liuchen.com.android27_customview.MyEditTextCustom.MyEditTextActivity">

    <demo.liuchen.com.android27_customview.MyEditTextCustom.MyEditText
        android:id="@+id/my_edittext"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@mipmap/note_bg"
        android:gravity="top"
        android:textSize="32sp"
        android:hint="衣带渐宽终不悔，含羞带笑把灯吹"
        app:myedit_Padding="15dp"/>



</RelativeLayout>

好了一个自定义记事本的小控件就好自己添加一个背景图片实现效果。效果如图所示：