自定义带动画效果的ProgressBar

最近项目上有个需求,让在原来的横向ProgressBar的基础上添加一个动画小人,让小人跟着那个进度条移动位置!
然后自己就做了一个,但是不知道这个编辑器要怎么传视频,而且gif弄了半天也没弄好,就传张截图代替吧!截图上的小人是会动的!
自定义带动画效果的ProgressBar_第1张图片

这个是demo的截图,点击开始按钮后,小人会蹦蹦跳跳的往前移动!

实现原理:
1.未采用继承ProgressBar或者直接继承view的方式去写,而是采用了自定义view最简单的组合控件的方式,就是把一个ImageView和一个ProgressBar进行了组合.

2.在自定义的view中提供public方法setProgress,在该方法内部一方面改变ProgressBar的进度,另一方法更改小人的位置!

原理就是这么简单!

package com.example.myprogressbar;

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.RelativeLayout;

public class MyProgress extends RelativeLayout {

    private View mProgressBar_layout;
    private ImageView progress_imageview;
    private ProgressBar progressBar;
    private int max = 100;//默认ProgressBar的最大值为100
    private int mProgress = 0;
    private int left;
    private int top;
    private int right;
    private int bottom;

    public MyProgress(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context);
    }

    public MyProgress(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

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

    private void init(Context context) {
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        mProgressBar_layout = inflater.inflate(R.layout.progressbar_layout, null);
        progress_imageview = (ImageView) mProgressBar_layout.findViewById(R.id.progress_imageview);
        AnimationDrawable background = (AnimationDrawable) progress_imageview.getBackground();
        background.start();
        progressBar = (ProgressBar) mProgressBar_layout.findViewById(R.id.progressBar);
        this.addView(mProgressBar_layout);
    }

    @Override
    protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        this.left = left;
        this.top = top;
        this.right = right;
        this.bottom = bottom;
        int iv_height = progress_imageview.getMeasuredHeight();
        int iv_width = progress_imageview.getMeasuredWidth();
        int iv_bottom = progress_imageview.getBottom();

        int progress_left = progressBar.getLeft();
        int progress_width = progressBar.getMeasuredWidth();
        progress_imageview.layout(progress_left + mProgress * (progress_width - iv_width) / max, iv_bottom - iv_height, progress_left + mProgress * (progress_width - iv_width) / max + iv_width, iv_bottom);
    }

    /**
     * 设置ProgressBar的进度及小人的位置
     * 
     * @param progress
     */
    @SuppressLint("WrongCall")
    public void setProgress(int progress) {
        if (progress > max) {
            this.mProgress = max;
        } else {

            this.mProgress = progress;
        }
        this.onLayout(true, left, top, right, bottom);
        progressBar.setProgress(mProgress);
    }

    /**
     * 获取当前ProgressBar的进度
     * 
     * @return
     */
    public int getProgress() {
        return mProgress;
    }

    /**
     * 设置ProgressBar的最大值
     * 
     * @param max
     */
    public void setMax(int max) {
        this.max = max;
    }
}

点击下载源码

你可能感兴趣的:(Android)