Android 自定义View

最新推荐文章于 2023-10-09 17:41:38 发布

老虎从不发威-新歌

最新推荐文章于 2023-10-09 17:41:38 发布

阅读量469

点赞数

分类专栏：自定义

自定义专栏收录该内容

19 篇文章

订阅专栏

1、自定义View的属性

2、在View的构造方法中获得我们自定义的属性

3、重写onMesure

4、重写onDraw

我把3用[]标出了，所以说3不一定是必须的，当然了大部分情况下还是需要重写的。

1、自定义View的属性，首先在res/values/ 下建立一个attrs.xml ，在里面定义我们的属性和声明我们的整个样式。

<?xml version="1.0" encoding="utf-8"?>  
<resources>  
  
    <attr name="titleText" format="string" />  
    <attr name="titleTextColor" format="color" />  
    <attr name="titleTextSize" format="dimension" />  
  
    <declare-styleable name="CustomTitleView">  
        <attr name="titleText" />  
        <attr name="titleTextColor" />  
        <attr name="titleTextSize" />  
    </declare-styleable>  
  
</resources>

我们定义了字体，字体颜色，字体大小3个属性，format是值该属性的取值类型:

一共有：string,color,demension,integer,enum,reference,float,boolean,fraction,flag;不清楚的可以google一把。

然后在布局中声明我们的自定义View

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <com.example.administrator.myqwer.view.CustomTitleView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        custom:titleText="3712"
        android:padding="10dp"
        custom:titleTextColor="#ff0000"
        android:layout_centerInParent="true"
        custom:titleTextSize="40sp" />
</RelativeLayout>

一定要引入

xmlns:custom="http://schemas.android.com/apk/res-auto"

它会自动检测自定义属性我这里用的是Studio

2、在View的构造方法中，获得我们的自定义的样式

package com.example.administrator.myqwer.view;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
import android.graphics.Rect;

import com.example.administrator.myqwer.R;

import java.util.HashSet;
import java.util.Random;
import java.util.Set;

/**
 * Created by Administrator on 2017/4/6.
 */

public class CustomTitleView extends View {

    /**
     *  文本
     * @param context
     */
       private String mTitleText;

    /**
     *   文本的颜色
     * @param context
     */
    private int mTitleTextColor;
    /**
     * 文本的大小
     */
    private int mTitleTextSize;

    /**
     * 绘制时控制文本绘制的范围
     */
    private Rect mBound;
    private Paint mPaint;

    public CustomTitleView(Context context) {
        this(context, null);
    }

    public CustomTitleView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    /**
     *   获得我自定义的样式属性
     * @param context
     * @param attrs
     * @param defStyleAttr
     */
    public CustomTitleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        /**
         * 获得我们所定义的自定义样式属性
         */
        TypedArray a = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CustomTitleView, defStyleAttr, 0);
        int n = a.getIndexCount();
        for (int i=0;i<n;i++){
            int attr = a.getIndex(i);
            switch (attr){
                case R.styleable.CustomTitleView_titleText:
                    mTitleText=a.getString(attr);
                    break;
                case R.styleable.CustomTitleView_titleTextColor:
                    mTitleTextColor=a.getColor(attr, Color.BLACK);
                    break;
                case R.styleable.CustomTitleView_titleTextSize:
                    mTitleTextSize=a.getDimensionPixelSize(attr,(int) TypedValue.applyDimension(
                            TypedValue.COMPLEX_UNIT_SP, 16, getResources().getDisplayMetrics()));
                    break;
            }
        }
        //回收
        a.recycle();

        /**
         * 获得绘制文本的宽和高
         */
        mPaint = new Paint();
        mPaint.setTextSize(mTitleTextSize);

        mBound=new Rect();
        mPaint.getTextBounds(mTitleText,0,mTitleText.length(),mBound);
        /**
         *  点击随机数
         */
        this.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                mTitleText = randomText();
                postInvalidate();
                /**
                 * 使用postInvalidate()刷新界面

                 使用postInvalidate则比较简单，不需要handler，直接在线程中调用postInvalidate即可。
                 */
            }
        });


    }

    private String randomText(){
        /**
         *   随机函数——Random
         */
        Random random = new Random();
        Set<Integer> set = new HashSet<>();
        /**
         * 随机数的位数
         */
        while (set.size()<4){
            /**
             * 10以内的数
             */
            int randomInt = random.nextInt(10);
            set.add(randomInt);
        }
        StringBuffer sb = new StringBuffer();
        /**
         * 拼接
         */
        for (Integer i : set)
        {
            sb.append("" + i);
        }

        return sb.toString();
    }


    /**
     * 尺寸 位置
     */

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        /**
         * 宽高
         */

        int width=0;
        int height=0;

        /**
         * 设置宽高
         */
        int specMode = MeasureSpec.getMode(widthMeasureSpec);//得到模式
        int specSize = MeasureSpec.getSize(widthMeasureSpec);//得到尺寸
        switch (specMode){
            case MeasureSpec.EXACTLY://精确尺寸,明确指定了
                width=getPaddingLeft()+getPaddingRight()+specSize;
                break;

            case MeasureSpec.AT_MOST://最大尺寸,一般为WARP_CONTENT
                width=getPaddingLeft()+getPaddingRight()+mBound.width();
                break;

        }
        /**
         * 设置高度
         */

        specMode = MeasureSpec.getMode(heightMeasureSpec);//获取到模式
        specSize = MeasureSpec.getSize(heightMeasureSpec);//获取到尺寸
        switch (specMode)
        {
            case MeasureSpec.EXACTLY:// 明确指定了
                height = getPaddingTop() + getPaddingBottom() + specSize;
                break;
            case MeasureSpec.AT_MOST:// 一般为WARP_CONTENT
                height = getPaddingTop() + getPaddingBottom() + mBound.height();
                break;
        }

        /**
         * 设置测量尺寸
         */
        setMeasuredDimension(width, height);

    }

    /**
     * 画布
     * @param canvas
     *
     *   Canvas画布
     *   Paint画笔
     */
    @Override
    protected void onDraw(Canvas canvas) {
//        super.onDraw(canvas);
        mPaint.setColor(Color.GRAY);//设置背景颜色

        /**
         *    第一个参数距离y轴参数
         *    第二个参数距离x轴参数
         *    第三个参数右边框到y轴的距离
         *    第四个参数最下边框到x的距离
         */
        canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), mPaint);

        mPaint.setColor(mTitleTextColor);
        /**
         * canvas.drawText(text, x, y, paint)，第一个参数是我们需要绘制的文本，第四个参数是我们的画笔，这两个不用多说，主要是第二和第三个参数的含义，
         * 这两个参数在不同的情况下的值还是不一样的，x默认是这个字符串的左边在屏幕的位置，如果设置了paint.setTextAlign(Paint.Align.CENTER);那就是字符的中心，
         * y是指定这个字符baseline在屏幕上的位置，大家记住了，不要混淆，y不是这个字符中心在屏幕上的位置，而是baseline在屏幕上的位置。
         */
        canvas.drawText(mTitleText, getWidth() / 2 - mBound.width() / 2, getHeight() / 2 + mBound.height() / 2, mPaint);
    }
}

我们重写了3个构造方法，默认的布局文件调用的是两个参数的构造方法，所以记得让所有的构造调用我们的三个参数的构造，我们在三个参数的构造中获得自定义属性。

3、我们重写onDraw，onMesure调用系统提供的：

系统帮我们测量的高度和宽度都是MATCH_PARNET，当我们设置明确的宽度和高度时，系统帮我们测量的结果就是我们设置的结果，当我们设置为WRAP_CONTENT,或者MATCH_PARENT系统帮我们测量的结果就是MATCH_PARENT的长度。

所以，当设置了WRAP_CONTENT时，我们需要自己进行测量，即重写onMesure方法”：

重写之前先了解MeasureSpec的specMode,一共三种类型：

EXACTLY：一般是设置了明确的值或者是MATCH_PARENT

AT_MOST：表示子布局限制在一个最大值内，一般为WARP_CONTENT

UNSPECIFIED：表示子布局想要多大就多大，很少使用