自定义View练习题目整理

一、动态音频播放柱形图

1、效果图：

2、步骤

（1）、新建自定义View类，继承View
（2）、重写onDraw()方法，使用画笔和画布循环画一定数量的柱形

   @Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);//画柱形for (int i = 0; i < 10; i++){float mRandom = (float) Math.random();float currentHeight = mRectHeight*mRandom;canvas.drawRect((float) (mWidth*0.4/2+mRectWidth * i +offset),currentHeight, (float) (mWidth*0.4/2+mRectWidth*(i+1)),mRectHeight,mPaint1);}postInvalidateDelayed(800);}

（3）、重写onSizeChange()方法，实现柱形的渐变效果

    @Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);//实现音频柱的渐变效果mWidth = getWidth();mRectHeight = getHeight();mRectWidth = (int) (mWidth*0.6/10);mLinearGradient = new LinearGradient(0,0,mRectWidth,mRectHeight,Color.YELLOW,Color.BLUE, Shader.TileMode.CLAMP);mPaint1.setShader(mLinearGradient);}

（4）、在适合的xml布局文件中引入即可

<com.example.test.MyView1android:id="@+id/myView"android:layout_width="match_parent"android:layout_height="wrap_content"app:layout_constraintTop_toBottomOf="@+id/text"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent"/>

附：全部代码如下：

package com.example.test;import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.view.View;
import android.widget.TextView;import androidx.annotation.Nullable;public class MyView1 extends View {Paint mPaint1;  //画笔int mWidth = 200;int mHeight = 1000;int mRectWidth = 30; //柱形的宽度int mRectHeight = 200; //柱形的高度int offset = 5; //柱形之间的距离LinearGradient mLinearGradient;public MyView1(Context context) {super(context);init();}public MyView1(Context context, @Nullable AttributeSet attrs) {super(context, attrs);init();}public MyView1(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init();}private void init(){//初始化画笔和画笔的颜色、样式等mPaint1 = new Paint();mPaint1.setColor(getResources().getColor(R.color.purple_200));}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);//画柱形for (int i = 0; i < 10; i++){float mRandom = (float) Math.random();float currentHeight = mRectHeight*mRandom;canvas.drawRect((float) (mWidth*0.4/2+mRectWidth * i +offset),currentHeight, (float) (mWidth*0.4/2+mRectWidth*(i+1)),mRectHeight,mPaint1);}postInvalidateDelayed(800);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);//实现音频柱的渐变效果mWidth = getWidth();mRectHeight = getHeight();mRectWidth = (int) (mWidth*0.6/10);mLinearGradient = new LinearGradient(0,0,mRectWidth,mRectHeight,Color.YELLOW,Color.BLUE, Shader.TileMode.CLAMP);mPaint1.setShader(mLinearGradient);}
}

二、自定义大小的圆形

1、效果图

一个圆形

2、步骤

（1）新建自定义View类，继承View
（2）可设置自定义属性

    public MyView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);//自定义属性TypedArray a = context.obtainStyledAttributes(attrs,R.styleable.MyView);mColor = a.getColor(R.styleable.MyView_circle_color,Color.RED);a.recycle();init();}

values文件下面新建attrs.xml，可设置颜色，后续可设置给画笔

    public MyView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);//自定义属性TypedArray a = context.obtainStyledAttributes(attrs,R.styleable.MyView);mColor = a.getColor(R.styleable.MyView_circle_color,Color.RED);a.recycle();init();}

（3）重写onMeasure()，自定义绘制大小

    @Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);//宽测量模式int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);//宽测量大小int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);//高测量模式int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);//高测量大小int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);if (widthSpecMode == MeasureSpec.AT_MOST && heightSpecMode == MeasureSpec.AT_MOST){setMeasuredDimension(200,200);}else if (widthSpecMode == MeasureSpec.AT_MOST){setMeasuredDimension(200,heightSpecSize);}else if (heightSpecMode == MeasureSpec.AT_MOST){setMeasuredDimension(widthSpecSize,200);}else{setMeasuredDimension(widthMeasureSpec,heightMeasureSpec);}}

（4）重写onDraw()方法画圆形

    @Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);int width = getWidth()-getPaddingLeft()-getPaddingLeft();int height = getHeight()-getPaddingLeft()-getPaddingLeft();int radius = Math.min(width,height)/2;canvas.drawCircle((float) width/2+getPaddingLeft(),(float) height/2+getPaddingLeft(),radius,paint);}

（5）相应地方调用需注意设置wrap_content，因为想实现重写onDraw方法中的效果，需要自己支持wrap_content，并且padding也需要自己处理。

<com.example.test.MyViewandroid:id="@+id/myView"android:layout_width="match_parent"android:layout_height="wrap_content"android:padding="10dp"app:layout_constraintTop_toBottomOf="@+id/text"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent"/>

附：全部代码

package com.example.test;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;
import androidx.annotation.Nullable;public class MyView extends View {public int mColor = Color.RED;private Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);public MyView(Context context) {super(context);init();}public MyView(Context context, @Nullable AttributeSet attrs) {super(context, attrs);init();}public MyView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);//自定义属性TypedArray a = context.obtainStyledAttributes(attrs,R.styleable.MyView);mColor = a.getColor(R.styleable.MyView_circle_color,Color.RED);a.recycle();init();}//初始化画笔private void init(){paint.setColor(mColor);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);//宽测量模式int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);//宽测量大小int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);//高测量模式int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);//高测量大小int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);if (widthSpecMode == MeasureSpec.AT_MOST && heightSpecMode == MeasureSpec.AT_MOST){setMeasuredDimension(200,200);}else if (widthSpecMode == MeasureSpec.AT_MOST){setMeasuredDimension(200,heightSpecSize);}else if (heightSpecMode == MeasureSpec.AT_MOST){setMeasuredDimension(widthSpecSize,200);}else{setMeasuredDimension(widthMeasureSpec,heightMeasureSpec);}}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);int width = getWidth()-getPaddingLeft()-getPaddingLeft();int height = getHeight()-getPaddingLeft()-getPaddingLeft();int radius = Math.min(width,height)/2;canvas.drawCircle((float) width/2+getPaddingLeft(),(float) height/2+getPaddingLeft(),radius,paint);}}