关于自定义View的入门简单心得--一个简单的圆形背景显示文字View

自定义入门体验

本人也是刚入安卓的小白，自定义控件是成功大牛的必经之路，今天写点自己学习到的知识吧。先通过一个简单的圆形背景显示文字View开始，因为比较简单所以直接上代码。

public class CenterInCirText extends View {
private int itemWidth;
private int itemHeight;
private int raduis;
private String text;
private int bgColor = Color.BLACK;
private float textSize = 30;
private int textColor = Color.WHITE;

public void setTextSize(float textSize) {
    this.textSize = textSize;
    invalidate();
}

public void setBgColor(int bgColor) {
    this.bgColor = bgColor;
}

public void setTextColor(int textColor) {
    this.textColor = textColor;
}

public void setTextContent(String str) {
    this.text = str;
    invalidate();
}

public CenterInCirText(Context context) {
    super(context);
    init(context, null);
}

public CenterInCirText(Context context, @Nullable AttributeSet attrs) {
    super(context, attrs);
    init(context, attrs);
}

public CenterInCirText(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init(context, attrs);
}

private void init(Context context, AttributeSet attrs) {
    if (attrs != null) {
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.CenterInCirText);
        textSize = array.getDimension(R.styleable.CenterInCirText_textSize, textSize);
        text = array.getString(R.styleable.CenterInCirText_centerText);
        bgColor = array.getColor(R.styleable.CenterInCirText_bgColor, bgColor);
        textColor = array.getColor(R.styleable.CenterInCirText_textColor, textColor);
        array.recycle();
    }

}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    itemWidth = getMeasuredWidth();
    itemHeight = getMeasuredHeight();
    if (itemWidth > itemHeight) {
        raduis = itemHeight / 2;
    } else {
        raduis = itemWidth / 2;
    }
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    RectF rect = new RectF(0, 0, itemWidth, itemHeight);//画一个矩形
    Paint mPaint = new Paint();

    //设置画笔的样式，空心STROKE
    mPaint.setStyle(Paint.Style.FILL);
    //设置抗锯齿
    mPaint.setAntiAlias(true);
    mPaint.setColor(bgColor);
    canvas.drawCircle(rect.centerX(), rect.centerY(), raduis, mPaint);

    mPaint.setColor(textColor);
    mPaint.setTextSize(textSize);
    mPaint.setStyle(Paint.Style.FILL);
    //该方法即为设置基线上那个点究竟是left,center,还是right  这里我设置为center
    mPaint.setTextAlign(Paint.Align.CENTER);

    Paint.FontMetrics fontMetrics = mPaint.getFontMetrics();
    float top = fontMetrics.top;//为基线到字体上边框的距离,即上图中的top
    float bottom = fontMetrics.bottom;//为基线到字体下边框的距离,即上图中的bottom

    int baseLineY = (int) (rect.centerY() - top / 2 - bottom / 2);//基线中间点的y轴计算公式

    canvas.drawText(text, rect.centerX(), baseLineY, mPaint);

}

}

因为比较简单而且也有注释，这边提下怎么能够在xml布局中直接设置该View的各种属性，如TextView中textSize，我们的做法先创建一个attrs文件，具体做法是在values新建，
<resources>
<declare-styleable name="CenterInCirText">
<attr name="centerText" format="string"/>
<attr name="textColor" format="color"/>
<attr name="textSize" format="dimension"/>
<attr name="bgColor" format="color"/>
</declare-styleable>
</resources>
这里定义了四个属性名，然后在构造函数调用init方法，这样我们就可以在xml文件中直接使用者四个属性从而改变view。要引入 xmlns:app=”http://schemas.android.com/apk/res-auto”。
<com.example.CenterInCirText
android:id="@+id/cit"
android:layout_width="150dp"
android:layout_height="100dp"
app:centerText="Test"
app:textSize="50sp"
app:textColor="#172eff"
app:bgColor="#ff003b"
android:layout_alignParentBottom="true"
android:layout_marginTop="10dp" />
这样我们就可以直接在布局文件中直接指定圆形背景颜色等属性，也可以通过setBgColor方法进行颜色设置，两种方式。
第一次尝试写，很多不如意的地方望见谅。