1.不断画圆
1.MainActivity
画圆.gif
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
2.TestView
public class TestView extends View {
int StartAngle=0;
int angle;//每次增长之后的值
int speed=10;//增长速度
public TestView(Context context) {
super(context);
}
public TestView(Context context, AttributeSet attrs) {
super(context, attrs);
setBackgroundColor(Color.GRAY);
}
/**
*
* @param widthMeasureSpec 父控件预测的这个控件的最大宽度
* @param heightMeasureSpec 父控件预测的这个控件的最大高度
*/
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//固定的尺寸-自己设定宽高
//setMeasuredDimension(100,100);
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
/*
//创建定时器 每个0.5s画一次
final Timer t =new Timer();
t.schedule(new TimerTask() {
@Override
public void run() {
angle+=speed;
if(angle>360){
angle=360;
t.cancel();//关闭定时器
}
invalidate(); //告诉系统调用onDraw方法实现绘制
}
},0,100);
*/
//属性动画
//ObjectAnimator
//ValueAnimator 监听动画过程中值的改变过程
//angle 0-360
ValueAnimator va=ValueAnimator.ofInt(0,360);
va.setDuration(1000);
va.setRepeatCount(ValueAnimator.INFINITE);//重复
va.setRepeatMode(ValueAnimator.RESTART);//往回重复
va.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
//获取某一刻的值
angle=(int)valueAnimator.getAnimatedValue();
//刷新
invalidate();
}
});
//启动动画
va.start();
}
/**
* 如果自定义的视图
* 形状无规则
* 用特定的方式显示内容
* 完成特定功能
* @param canvas 默认提供的一个画布
* 将需要的内容画到画布上 统一 渲染到界面上GPU
* 缺点：如果频繁绘制 内存吃紧
*
* 能够使用系统的就不要自己控制
*/
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//画一条线
/*
//1.准备画笔
Paint mpaint=new Paint(Paint.ANTI_ALIAS_FLAG);
mpaint.setColor(Color.BLACK);//画笔颜色
mpaint.setStrokeWidth(20);//画笔粗细
mpaint.setAntiAlias(true);//抗锯齿
mpaint.setStyle(Paint.Style.STROKE);//设置空心
/*
//2.画线
canvas.drawLine(100,100,500,800,mpaint);
*/
//3.画圆
/*
canvas.drawArc(50,100,350,400,0,180,true,mpaint);
*/
drawPieChart(canvas,Color.MAGENTA,(float) (angle/360.0));
}
//画饼状图
private void drawPieChart(Canvas canvas,int Color,float rate){
Paint paint=new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color);
//画扇形
canvas.drawArc(50,100,350,400,0,
360*rate,true,paint);
StartAngle+=(360*rate);
}
/*
@Override
public boolean onTouchEvent(MotionEvent event) {
if(event.getAction()==MotionEvent.ACTION_DOWN){
//点击屏幕 画一点
angle+=speed;
//控制最大值
if(angle>360){
angle=360;
}
//告诉系统调用onDraw方法实现绘制
invalidate();
}
return true;
}
*/
}
2.画进度条
点击进度条.gif
1.MainActivity
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
MaterView mv=findViewById(R.id.mater);
if(event.getAction()==MotionEvent.ACTION_DOWN){
//更改进度值：在原有的进度上加0.05
mv.setProgress((float) (mv.getProgress()+0.05));
}
return true;
}
}
2. MaterView
public class MaterView extends View {
private Paint bgPaint; //背景画笔
private Paint progressPaint;//进度画笔
private Paint textPaint;//文字画笔
private float progress;//进度
public MaterView(Context context) {
super(context);
}
public MaterView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
//初始化
private void init(){
//画笔
bgPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
bgPaint.setColor(Color.BLACK);
bgPaint.setStyle(Paint.Style.STROKE);//设置空心
bgPaint.setStrokeWidth(40);
bgPaint.setStrokeCap(Paint.Cap.ROUND);//设置两端的类型
progressPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
progressPaint.setColor(Color.MAGENTA);
progressPaint.setStyle(Paint.Style.STROKE);//设置空心
progressPaint.setStrokeWidth(40);
progressPaint.setStrokeCap(Paint.Cap.ROUND);//设置两端的类型
textPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
textPaint.setColor(Color.BLACK);
textPaint.setTextSize(100);
}
/**
* 固定不变的不要放在onDraw方法里面
* 这个方法可能会被调用多次
* @param canvas
*/
@Override
protected void onDraw(Canvas canvas) {
//画初始圆
//确定矩形区域
RectF frame=new RectF(50,100,getWidth()-50,getWidth()-50);
//计算进度对应的角度
int angle= (int) (progress*300);
//画一个弧
canvas.drawArc(frame,120,300,false,bgPaint);
canvas.drawArc(frame,120,angle,false,progressPaint);
String text=(int)(progress*100)+"%";
//计算文字的宽度
int width= (int) textPaint.measureText(text);
//计算文字的矩阵 FontMetrics
Paint.FontMetricsInt fo=textPaint.getFontMetricsInt();
//计算向下移动的距离 ascent/2
int space=-fo.ascent/2;
//画文字
canvas.drawText( text,getWidth()/2-width/2,getWidth()/2+space,textPaint);
}
public float getProgress() {
return progress;
}
public void setProgress(float progress) {
this.progress = progress;
//刷新 重绘
if(progress<=1.001){
invalidate();
}
}
}
3.画贝塞尔曲线
image.png
1. MainActivity
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
2.WavaView
public class WavaView extends View {
public WavaView(Context context) {
super(context);
}
public WavaView(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
protected void onDraw(Canvas canvas) {
//创建一个路径
Path mPath=new Path();
mPath.moveTo(50,500);
//画贝塞尔曲线
/*
mPath.cubicTo(50,500,200,300,350,500);
mPath.cubicTo(350,500,500,700,650,500);
*/
mPath.quadTo(200,300,350,500);
mPath.quadTo(500,700,650,500);
/*
//设置路径的起始点
mPath.moveTo(50,500);
//划线
mPath.lineTo(400,500);
//画笔
*/
Paint mpaint =new Paint(Paint.ANTI_ALIAS_FLAG);
mpaint.setColor(Color.BLACK);
mpaint.setStrokeWidth(10);
mpaint.setStyle(Paint.Style.STROKE);
//绘制
canvas.drawPath(mPath,mpaint);
}
}
4.心得
了解学习了画笔的使用
