android自定义进度条

         好多天没写博客了，最近一直在忙手环的项目，当前项目是一个智能手环的项目，由于项目比较急，所以硬件部分是外包的，我们只负责软件的部分，这周也一直花费主要的心思在研究这些东西上面了，后面我会做一些蓝牙方面的东西，也会把他共享出来，这周做了蛮多的东西，项目上也做了很多的动画特效，今天拿一个比较常规，也比较常见的特效拿出来说下，也分析下类似与这种效果该怎么去写。

      首先看下UI给我发过来的效果图。

很明显这是一个fragment中一个listview的进度条，这个时候首先第一个就想到的是progressbar，但是我们在做项目的时候不能只是想到把这个界面给做出来，有时候项目可能不需要我们做一些特效，但是作为android开发的人员，要做的不仅仅是这样，应该尽量的把界面做的好看，需要加入一个动画。下面是我效果做完后的截图。

看起来效果不太好，由于手机在显示到电脑上的时候有点卡，但是效果已经出来了，第一步就是把背景弄出来，这个背景首先肯定是可以自定义出来的，但是有个更简单的办法，不要忘记了android有个非常强大的背景功能，像这种左边是方形的右边的圆形的，一个shape就搞定了。

下面shape的代码

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <solid android:color="#D3D3D3" />    <corners android:topLeftRadius="0dp"             android:topRightRadius="15dp"             android:bottomRightRadius="15dp"             android:bottomLeftRadius="0dp"/>    <stroke android:width="2dp" android:color="#D3D3D3" /></shape>

下面是每个listview中item的代码

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:orientation="vertical"              android:layout_width="match_parent"              android:layout_height="wrap_content"><com.eben.zhukeyunfu.Activity.view.ProgressView    android:background="@drawable/cycle_squal_biankuang"    android:id="@+id/progress"   android:layout_marginTop="10dp"   android:layout_marginRight="10dp"   android:layout_marginBottom="10dp"    android:layout_width="match_parent"    android:layout_height="30dp"/><TextView    android:id="@+id/number"    android:layout_marginLeft="10dp"    android:layout_gravity="center_vertical"    android:textColor="@color/white"    android:text="1"    android:layout_width="wrap_content"    android:layout_height="wrap_content"/>    <TextView        android:id="@+id/number2"        android:layout_marginLeft="50dp"        android:layout_gravity="center_vertical"        android:textColor="@color/white"        android:text="12′19″"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/>    <TextView        android:id="@+id/number3"        android:layout_marginRight="20dp"        android:layout_gravity="center_vertical|right"        android:textColor="@color/white"        android:text="30′19″"        android:layout_width="wrap_content"        android:layout_height="wrap_content"/></FrameLayout>

当然这个item上的文字也是不需要绘制的，直接framelayout包裹下就行了。

listview的代码

<ListView    android:divider="@null"    android:id="@+id/sport_list"    android:layout_width="match_parent"    android:layout_height="match_parent"></ListView>

接下来就是自定义progressView的代码：

package com.eben.zhukeyunfu.Activity.view;/* *  @项目名：  Zhukeyunfu  *  @包名：    com.eben.zhukeyunfu.Activity.view *  @文件名:   ProgressView *  @创建者:   huhai *  @创建时间:  2017/5/25 17:36 *  @描述：    TODO */import android.animation.ObjectAnimator;import android.animation.ValueAnimator;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Rect;import android.graphics.RectF;import android.util.AttributeSet;import android.util.Log;import android.view.View;import com.eben.zhukeyunfu.Activity.utils.WindowUtils;import com.eben.zhukeyunfu.R;public class ProgressView extends View {    private String TAG="ProgressView";    /**分段颜色*/    private static final int[] SECTION_COLORS = {Color.GREEN, Color.YELLOW, Color.RED};    /**进度条最大值*/    private float maxCount;    /**进度条当前值*/    private float currentCount;    /**画笔*/    private Paint mPaint;    private int   mWidth,mHeight;    private int mViewWidth;    private int mViewHeight;    private Rect mRect;    private int mScreenWidth;    private RectF mRectf;    private float progresscount;    public ProgressView(Context context, AttributeSet attrs,                              int defStyleAttr) {        super(context, attrs, defStyleAttr);        initView(context);    }    public ProgressView(Context context, AttributeSet attrs) {        super(context, attrs);        initView(context);        mScreenWidth = WindowUtils.screenWidth(context);        mRect = new Rect(0, 0,(int)(progresscount/maxCount)*mViewWidth, mViewHeight);    }    //开启动画效果    private void initanimator() {        ObjectAnimator animator = ObjectAnimator.ofFloat(null, "", 0, currentCount);        animator.setDuration(2000);        animator.setRepeatCount(0);        animator.start();        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                progresscount = (float)animation.getAnimatedValue();                invalidate();            }        });    }    public ProgressView(Context context) {        super(context);        initView(context);    }    private void initView(Context context) {        mPaint = new Paint();        mPaint.setAntiAlias(true);        mPaint.setColor(getResources().getColor(R.color.biaoti));        mPaint.setStyle(Paint.Style.FILL);//充满        mPaint.setAntiAlias(true);// 设置画笔的锯齿效果        mPaint.setStrokeCap(Paint.Cap.ROUND);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        //改变值        //mRect = new Rect(0, 0,(int)(progresscount/maxCount)*mViewWidth, mViewHeight);        mRect.set(0, 0,(int)((progresscount/100)*mViewWidth), mViewHeight);        Log.d(TAG,(int)((progresscount/100)*mViewWidth)+"----长度");        canvas.drawRect(mRect, mPaint);        canvas.drawCircle((int)((progresscount/100)*mViewWidth), mViewHeight/2, mViewHeight/2, mPaint);       }    private int dipToPx(int dip) {        float scale = getContext().getResources().getDisplayMetrics().density;        return (int) (dip * scale + 0.5f * (dip >= 0 ? 1 : -1));    }    /***     * 设置最大的进度值     * @param maxCount     */    public void setMaxCount(float maxCount) {        this.maxCount = maxCount;    }    /***     * 设置当前的进度值     * @param currentCount     */    public void setCurrentCount(float currentCount) {        this.currentCount = currentCount > maxCount ? maxCount : currentCount;       initanimator();        //invalidate();    }    public float getMaxCount() {        return maxCount;    }    public float getCurrentCount() {        return currentCount;    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {      /*特别注意，此处必须要自己进行测量，否则系统会默认讲 wrap_cotent与match_parent视为相同，也就是会填充整个布局*/        setMeasuredDimension(measure(widthMeasureSpec), measure(heightMeasureSpec));        getViewXY();        //计算百分比所占的位置    }    /*自己测量view的宽高*/    private int measure(int measureSpec) {        int result = 0;        //分别获取测量模式 和 测量大小        int specMode = MeasureSpec.getMode(measureSpec);        int specSize = MeasureSpec.getSize(measureSpec);        //如果是精确度模式，呢就按xml中定义的来        if (specMode == MeasureSpec.EXACTLY) {            result = specSize;            //如果是最大测量，就按照屏幕的宽度计算        }else if( specMode == MeasureSpec.AT_MOST) {            result = mScreenWidth;        }        return result;    }    /*获取自定义view的宽度*/    private void getViewXY() {        mViewWidth = getMeasuredWidth();        mViewHeight = getMeasuredHeight();    }}

代码中使用：

mSportList = (ListView) view.findViewById(R.id.sport_list);mAdapter=new Myadapter();mSportList.setAdapter(mAdapter);

class Myadapter extends BaseAdapter{    @Override    public int getCount() {        return data.length;    }    @Override    public Object getItem(int i) {        return null;    }    @Override    public long getItemId(int i) {        return 0;    }    @Override    public View getView(int i, View view, ViewGroup viewGroup) {        ViewHolder holder = null;        if (holder==null){            holder=new ViewHolder();            view= LayoutInflater.from(mContext).inflate(R.layout.sport_path_item, null);            holder.number= (TextView) view.findViewById(R.id.number);            holder.mProgressView= (ProgressView) view.findViewById(R.id.progress);            view.setTag(holder);        }        else {            holder = (ViewHolder) view.getTag();        }        holder.number.setText(data[i]);        holder.mProgressView.setMaxCount(100);        holder.mProgressView.setCurrentCount(dataProgress[i]);        return view;    }    class  ViewHolder {        TextView  number;        ProgressView mProgressView;    }}

由于是整个项目中的一部分，没办法把整个代码都放上来，但是你可以直接copy进去使用。好了就这么多了，其实很简单的，代码中已经做了很详细的注释，不清楚的请加q286384819，咱们一起探讨IOS、android的学习