Android计步器小Demo

描述

android计步器的实现，自定义的一个弧形进度条，记步通过手机的传感器来实现，也就是说不支持传感器的机子（应该很老的了吧）就没有效果。看看效果图：

自定义View

public class StepView extends View {
   
   
    /**
     * 圆弧的宽度
     */
    private float borderWidth = dipToPx(10);
    /**
     * 画步数的数值的字体大小
     */
    private float numberTextSize = 0;
    /**
     * 步数
     */
    private String stepNumber = "0";
    /**
     * 开始绘制圆弧的角度
     */
    private float startAngle = 125;
    /**
     * 终点对应的角度和起始点对应的角度的夹角
     */
    private float angleLength = 290;
    /**
     * 所要绘制的当前步数的蓝色圆弧终点到起点的夹角
     */
    private float currentAngleLength = 0;
    /**
     * 动画时长
     */
    private int animationLength = 3000;

    /**
     * 当前运动类型
     */
    private String type = "Riding";

    /**
     * 当前活跃等级
     */
    private String level = "等级：轻度活跃";

    /**
     * 步数上方文字
     */
    private String today = "今日步数";

    /**
     * 单位km是否显示
     */
    private String unit = "Km";
    public StepView(Context context) {
        super(context);
    }
    public StepView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
    public StepView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }


    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        /**中心点的x坐标*/
        float centerX = (getWidth()) / 2;
        /**指定圆弧的外轮廓矩形区域*/
        RectF rectF = new RectF(0 + borderWidth, borderWidth, 2 * centerX - borderWidth, 2 * centerX - borderWidth);

        /**【第一步】绘制整体的灰色圆弧*/
        drawArcYellow(canvas, rectF);
        /**【第二步】绘制当前进度的蓝色圆弧*/
        drawArcRed(canvas, rectF);
        /**【第三步】绘制当前进度的白色数字*/
        drawTextNumber(canvas, centerX);
        /**【第四步】绘制"本次步数"的灰色文字*/
        drawTextStepString(canvas, centerX);
        /**【第五步】绘制当前记步类型*/
        drawTextType(canvas, centerX);
        /**【第六步】绘制当前等级类型*/
        drawTextLevel(canvas, centerX);
        /**【第七步】绘制骑行距离单位*/
        drawTextUnit(canvas, centerX);
    }



    /**
     * 1.绘制总步数的灰色圆弧
     *
     * @param canvas 画笔
     * @param rectF  参考的矩形
     */
    private void drawArcYellow(Canvas canvas, RectF rectF) {
        Paint paint = new Paint();
        /** 默认画笔颜色，灰色 */
        paint.setColor(getResources().getColor(R.color.near_black));
        /** 结合处为圆弧*/
        paint.setStrokeJoin(Paint.Join.MITER);
        /** 设置画笔的样式 Paint.Cap.Round ,Cap.SQUARE等分别为圆形、方形*/
        paint.setStrokeCap(Paint.Cap.BUTT);
        /** 设置画笔的填充样式 Paint.Style.FILL  :填充内部;Paint.Style.FILL_AND_STROKE  ：填充内部和描边;  Paint.Style.STROKE  ：仅描边*/
        paint.setStyle(Paint.Style.STROKE);

        float[] floats = {
  
  4,16,4,16};
        paint.setPathEffect(new DashPathEffect(floats, 0));

        /**抗锯齿功能*/
        paint.setAntiAlias(true);
        /**设置画笔宽度*/
        paint.setStrokeWidth(borderWidth);

        /**绘制圆弧的方法
         * drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter, Paint paint)//画弧，
         参数一是RectF对象，一个矩形区域椭圆形的界限用于定义在形状、大小、电弧，
         参数二是起始角(度)在电弧的开始，圆弧起始角度，单位为度。
         参数三圆弧扫过的角度，顺时针方向，单位为度,从右中间开始为零度。
         参数四是如果这是true(真)的话,在绘制圆弧时将圆心包括在内，通常用来绘制扇形；如果它是false(假)这将是一个弧线,
         参数五是Paint对象；
         */
        canvas.drawArc(rectF, startAngle, angleLength, false, paint);

    }

    /**
     * 2.绘制当前步数的蓝色圆弧
     */
    private void drawArcRed(Canvas canvas, RectF rectF) {
        Paint paintCurrent = new Paint();
        paintCurrent.setStrokeJoin(Paint.Join.MITER);
        paintCurrent.setStrokeCap(Paint.Cap.BUTT);//圆角弧度
        paintCurrent.setStyle(Paint.Style.STROKE);//设置填充样式
        paintCurrent.setAntiAlias(true);//抗锯齿功能
        paintCurrent.setStrokeWidth(borderWidth);//设置画笔宽度
        paintCurrent.setColor(getResources().getColor(R.color.colorPrimary));//设置画笔颜色
        float[] floats = {
  
  4,16,4,16};
        paintCurrent.setPathEffect(new DashPathEffect(floats, 0));
        canvas.drawArc(rectF, startAngle, currentAngleLength, false, paintCurrent);
    }

    /**
     * 3.圆环中心的步数
     */
    private<