自定义控件——通过持续绘制实现简单动画——自定义饼图动画
自定义饼图动画
自定义饼图动画的具体实现步骤说明如下:
(1)在Java代码的widget目录下创建PieAnimation.java,该类继承了视图基类View,并重写onDraw方法,在onDraw方法中使用画笔对象绘制指定角度的扇形。
(2)在PieAnimation内部定义一个视图刷新任务,每次刷新操作都增大一点绘图角度,然后调用invalidate方法刷新视图界面。
(3)给PieAnimation补充一个start方法,用于控制饼图动画的播放操作。
===============================================================================================================
布局:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="5dp"> <!-- 自定义的饼图动画,需要使用全路径 --> <com.example.myapplication.widget.PieAnimation android:id="@+id/pa_circle" android:layout_width="match_parent" android:layout_height="350dp" /> </LinearLayout>
主代码:
package com.example.myapplication; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import com.example.myapplication.widget.PieAnimation; public class MainActivity extends AppCompatActivity implements View.OnClickListener { private PieAnimation pa_circle; // 声明一个饼图动画对象 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 从布局文件中获取名叫pa_circle的饼图动画 pa_circle = findViewById(R.id.pa_circle); pa_circle.setOnClickListener(this); // 设置饼图动画的点击监听器 pa_circle.start(); // 开始播放饼图动画 } @Override public void onClick(View v) { if (v.getId() == R.id.pa_circle) { if (!pa_circle.isRunning()) { // 判断饼图动画是否正在播放 pa_circle.start(); // 不在播放,则开始播放饼图动画 } } } }
PieAnimation
package com.example.myapplication.widget; import android.annotation.SuppressLint; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.RectF; import android.os.Handler; import android.os.Looper; import android.util.AttributeSet; import android.view.View; @SuppressLint("DrawAllocation") public class PieAnimation extends View { private Paint mPaint = new Paint(); // 创建一个画笔对象 private int mDrawingAngle = 0; // 当前绘制的角度 private Handler mHandler = new Handler(Looper.myLooper()); // 声明一个处理器对象 private boolean isRunning = false; // 是否正在播放动画 public PieAnimation(Context context) { this(context, null); } public PieAnimation(Context context, AttributeSet attrs) { super(context, attrs); mPaint.setColor(Color.GREEN); // 设置画笔的颜色 } // 开始播放动画 public void start() { mDrawingAngle = 0; // 绘制角度清零 isRunning = true; mHandler.post(mRefresh); // 立即启动绘图刷新任务 } // 是否正在播放 public boolean isRunning() { return isRunning; } // 定义一个绘图刷新任务 private Runnable mRefresh = new Runnable() { @Override public void run() { mDrawingAngle += 3; // 每次绘制时角度增加三度 if (mDrawingAngle <= 270) // 未绘制完成,最大绘制到270度 { invalidate(); // 立即刷新视图 mHandler.postDelayed(this, 70); // 延迟若干时间后再次启动刷新任务 } else // 已绘制完成 { isRunning = false; } } }; @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if (isRunning) // 正在播放饼图动画 { int width = getMeasuredWidth(); // 获得已测量的宽度 int height = getMeasuredHeight(); // 获得已测量的高度 int diameter = Math.min(width, height); // 视图的宽高取较小的那个作为扇形的直径 // 创建扇形的矩形边界 RectF rectf = new RectF((width - diameter) / 2, (height - diameter) / 2, (width + diameter) / 2, (height + diameter) / 2); // 在画布上绘制指定角度的图形。第四个参数为true绘制扇形,为false绘制圆弧 canvas.drawArc(rectf, 0, mDrawingAngle, true, mPaint); } } }