統計圖1--橫向帶數字的柱狀圖

借鑑了別人的進度條修改爲自己的統計圖

借鑑文章鏈接地址

http://www.apkbus.com/blog-914653-68359.html

https://github.com/CQBOBOZHU/NumberProgress

1、帶數字的進度條  NumberProgressView

先來效果圖

 

 

添加動畫方法：  private void setTvAnimation(final TextView view, final int mProgressBar) {

  ValueAnimator animator = ValueAnimator.ofInt(0, mProgressBar).setDuration(5000);

 

  animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

   @Override

   public void onAnimationUpdate(ValueAnimator valueAnimator) {

    view.setText(String.valueOf(valueAnimator.getAnimatedValue()));

   }

  });

  animator.start();

 }

使用方法：直接把控件傳進去就可以了

/開啓動畫

setAnimation(HProgress,2000);

 

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.Typeface;
import android.util.AttributeSet;
import android.view.View;

 

public class NumberProgressView extends View {

    /**
     * 進度條畫筆的寬度（dp）
     */
    private int paintProgressWidth = 30;

    /**
     * 文字百分比的字體大小（sp）
     */
    private int paintTextSize = 20;

    /**
     * 左側已完成進度條的顏色
     */
    private int paintLeftColor = 0xff67aae4;

    /**
     * 右側未完成進度條的顏色
     */
    private int paintRightColor = Color.WHITE;

    /**
     * 百分比文字的顏色
     */
    private int paintTextColor = 0xffff0077;

    /**
     * Contxt
     */
    private Context context;

    /**
     * 主線程傳過來進程 0 - 100
     */
    private long progress;

    /**
     * 得到自定義視圖的寬度
     */
    private int viewWidth;

    /**
     * 得到自定義視圖的Y軸中心點
     */
    private int viewCenterY;

    /**
     * 畫左邊已完成進度條的畫筆
     */
    private Paint paintleft = new Paint();

    /**
     * 畫右邊未完成進度條的畫筆
     */
    private Paint paintRight = new Paint();

    /**
     * 畫中間的百分比文字的畫筆
     */
    private Paint paintText = new Paint();

    /**
     * 要畫的文字的寬度
     */
    private int textWidth;

    /**
     * 畫文字時底部的座標
     */
    private float textBottomY;

    /**
     * 包裹文字的矩形
     */
    private Rect rect = new Rect();

    /**
     * 文字總共移動的長度（即從0%到100%文字左側移動的長度）
     */
    private int totalMovedLength;
    long maxProgress = Long.MAX_VALUE;
    public NumberProgressView(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.context = context;
        // 構造器中初始化數據
        initData();
    }

    /**
     * 初始化數據
     */
    private void initData() {

        //設置進度條畫筆的寬度
        int paintProgressWidthPx = TransformUtils.dp2px(paintProgressWidth);

        //設置百分比文字的尺寸
        int paintTextSizePx = TransformUtils.sp2px( paintTextSize);

        // 已完成進度條畫筆的屬性
        paintleft.setColor(paintLeftColor);
        paintleft.setStrokeWidth(paintProgressWidthPx);
        paintleft.setAntiAlias(true);
        paintleft.setStyle(Paint.Style.FILL);

        // 未完成進度條畫筆的屬性
        paintRight.setColor(paintRightColor);
        paintRight.setStrokeWidth(paintProgressWidthPx);
        paintRight.setAntiAlias(true);
        paintRight.setStyle(Paint.Style.FILL);

        // 百分比文字畫筆的屬性
        paintText.setColor(paintTextColor);
        paintText.setTextSize(paintTextSizePx);
        paintText.setAntiAlias(true);
        paintText.setTypeface(Typeface.DEFAULT_BOLD);

    }

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

    /**
     * 得到視圖等的高度寬度尺寸數據
     */
    private void getWidthAndHeight() {

        //得到包圍文字的矩形的寬高
        paintText.getTextBounds("000%", 0, "000%".length(), rect);
        textWidth = rect.width();
        textBottomY = viewCenterY + rect.height() / 2;

        //得到自定義視圖的高度
        int viewHeight = getMeasuredHeight();
        viewWidth = getMeasuredWidth();
        viewCenterY = viewHeight / 2;
        totalMovedLength = viewWidth - textWidth;

    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (maxProgress == 0) {
            maxProgress = Long.MAX_VALUE;
        }
        //得到float型進度
        float progressFloat = Long.valueOf(progress).floatValue() / Long.valueOf(maxProgress).floatValue();

        //當前文字移動的長度
        float currentMovedLentgh = totalMovedLength * progressFloat;

        //畫左側已經完成的進度條，長度爲從Veiw左端到文字的左側
        canvas.drawLine(0, viewCenterY, currentMovedLentgh, viewCenterY, paintleft);

        //畫右側未完成的進度條，這個進度條的長度不是嚴格按照百分比來縮放的，因爲文字的長度會變化，所以它的長度縮放比例也會變化
        if (progress < 10) {
            canvas.drawLine(currentMovedLentgh + textWidth * 0.5f, viewCenterY, viewWidth, viewCenterY, paintRight);
        } else if (progress < 100) {
            canvas.drawLine(currentMovedLentgh + textWidth * 0.75f, viewCenterY, viewWidth, viewCenterY, paintRight);
        } else {
            canvas.drawLine(currentMovedLentgh + textWidth, viewCenterY, viewWidth, viewCenterY, paintRight);
        }

        //畫文字(注意：文字要最後畫，因爲文字和進度條可能會有重合部分，所以要最後畫文字，用文字蓋住重合的部分)
        canvas.drawText(progress +"", currentMovedLentgh, textBottomY, paintText);
    }

    /**
     * @param progress 外部傳進來的當前進度
     */
    public void setProgress(long progress) {
        this.progress = progress;
        invalidate();
    }
    public void setMaxProgress(long maxProgress) {
        this.maxProgress = maxProgress;
    }
    public void setColor(String color) {
        paintleft = new Paint();
        paintleft.setColor(Color.parseColor(color));
        paintleft.setStrokeWidth(TransformUtils.dp2px(paintProgressWidth));
        paintleft.setAntiAlias(true);
        paintleft.setStyle(Paint.Style.FILL);
    }
}