前兩天公司需求,實現進度條動畫,本來想在網上找找有沒有類似的拿來用,想偷懶都不行。就簡單自定義
View
進度條動畫。實現很簡單。
動畫預覽
- 使用在公司專案效果預覽
- 簡潔效果預覽
程式碼實現
動畫效果很簡單,使用
ObjectAnimator
屬性動畫來實現,這個官方提供一些Api使用,具體可以檢視官方文件。如果以後需要實現更復雜的動畫,可以以此為例進行自定義。這裡我會對基礎自定義View
動畫實現簡單的說明,具體說明在程式碼註釋。如果你們需要的效果跟我的類似,你可以直接把ProgressView檔案拷貝下來使用,需要的屬性不夠用的話可以直接在裡面修改新增。
看程式碼才是王道
- 自定義
View
-ProgressView
程式碼(只展示主要程式碼)
public class ProgressView extends View {
private void initView() {
//初始化畫筆
paint = new Paint(Paint.ANTI_ALIAS_FLAG);
animator = new ObjectAnimator();
//設定動畫屬性
animator.setPropertyName("progress");
//設定執行動畫的View
animator.setTarget(this);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//畫筆屬性
paint.setAntiAlias(true); //設定畫筆為無鋸齒
paint.setColor(color); //設定畫筆顏色
paint.setStyle(Paint.Style.FILL);
paint.setStrokeWidth(1);
//圓角形狀設定到畫布
RectF rectF = new RectF(0, 0, progress, getHeight());
canvas.drawRoundRect(rectF, radius, radius, paint);
}
public void startAnim() {
if (animator.isRunning()) animator.end();
//設定進度陣列, 0 - max
animator.setFloatValues(0, progress);
//設定動畫時間
animator.setDuration(duration);
//動畫開啟
animator.start();
}
}
複製程式碼
xml
新增程式碼
<cn.luliangdev.devprogressview.ProgressView
android:id="@+id/progressview"
android:layout_width="wrap_content"
android:layout_height="30dp"/>
複製程式碼
- 程式碼使用程式碼
//設定顏色
progressview.setColor(getResources().getColor(R.color.colorAccent));
//設定圓角 預設無圓角
progressview.setRadius(6);
//設定進度條長度 預設px
progressview.setProgress(500);
//設定動畫時間
progressview.setDuration(500);
//開啟動畫
progressview.startAnim();
//動畫監聽
progressview.getAnimator().addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
//動畫開始
}
@Override
public void onAnimationEnd(Animator animation) {
//動畫結束
}
@Override
public void onAnimationCancel(Animator animation) {
//動畫取消
}
@Override
public void onAnimationRepeat(Animator animation) {
//動畫重複
}
});
複製程式碼
意見反饋
如果遇到問題或者好的建議,請反饋到:issue、927195249@qq.com 或者LiangLuDev@gmail.com
如果覺得對你有用的話,贊一下吧!