Android 自定义ProgressBar

最新推荐文章于 2024-04-06 07:21:07 发布
最新推荐文章于 2024-04-06 07:21:07 发布
阅读量816 收藏 1
点赞数
分类专栏： Android自定义View 文章标签： android 自定义View
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/King1425/article/details/52988060
版权

效果如图

这里写图片描述

调用代码如下

package com.example.MyProgressbar;

import com.ws.progressView.HorizontalProgress;
import com.ws.progressView.RoundProgress;

import android.app.Activity;
import android.app.ActionBar;
import android.app.Fragment;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.os.Build;

public class MainActivity extends Activity {

    private HorizontalProgress mHprogress;
    private RoundProgress mRoundProgress;
    //更新进度条
    public static final int UPDATE_MSG=0X110;
    private Handler mHandler=new Handler(){
        @Override
        public void handleMessage(Message msg) {

            int progress=mHprogress.getProgress();
            mHprogress.setProgress(++progress);

            int roundProgress=mRoundProgress.getProgress();
            mRoundProgress.setProgress(++roundProgress);

            if(progress>=100){
                mHandler.removeMessages(UPDATE_MSG);
            }else{
                mHandler.sendEmptyMessageDelayed(UPDATE_MSG, 100);
            }
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

      mHprogress=(HorizontalProgress) findViewById(R.id.progress_1);
      mRoundProgress=(RoundProgress) findViewById(R.id.progress_4);


      mHandler.sendEmptyMessage(UPDATE_MSG);
    }



}

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:ws="http://schemas.android.com/apk/res-auto"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">



    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">

        <com.ws.progressView.HorizontalProgress
            android:id="@+id/progress_1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:progress="0"
            android:padding="5dp"
            ws:progress_unreach_color="#44ff0000"
            android:layout_marginTop="30dp"
            />

          <com.ws.progressView.HorizontalProgress
            android:id="@+id/progress_2"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:progress="30"
            android:padding="15dp"
            android:layout_marginTop="30dp"
            ws:progress_text_color="#44ff0000"
            ws:progress_unreach_color="#ffffff"

            />

          <com.ws.progressView.RoundProgress
            android:id="@+id/progress_3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:progress="30"
            android:padding="15dp"
            android:layout_marginTop="30dp"         
            ws:progress_unreach_color="#44ff0000"
            ws:radius="20dp"
            />
            <com.ws.progressView.RoundProgress
            android:id="@+id/progress_4"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:progress="0"
            android:padding="15dp"
            android:layout_marginTop="30dp"
            ws:progress_text_color="#44ff0000"
            ws:progress_unreach_color="#000000"
            ws:progress_text_size="20sp"
            ws:radius="60dp"
            />

        </LinearLayout>


</ScrollView>

下面看代码实现

自定义View第一步 定义属性

<?xml version="1.0" encoding="utf-8"?>
<resources>


         <declare-styleable name="HorizontalProgress" >     
          <attr name="progress_unreach_color"  format="color"></attr>
          <attr name="progress_unreach_height" format="dimension"></attr>
          <attr name="progress_reach_color" format="color"></attr>
          <attr name="progress_reach_height" format="dimension"></attr>
          <attr name="progress_text_color" format="color"></attr>
          <attr name="progress_text_size" format="dimension"></attr>
          <attr name="progress_text_offset" format="dimension"></attr>
         </declare-styleable>


         <declare-styleable name="RoundProgress">
              <attr name="radius" format="dimension"></attr>
         </declare-styleable>

</resources>
package com.ws.progressView;

import com.example.MyProgressbar.R;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.webkit.WebSettings.TextSize;
import android.widget.ProgressBar;

public class HorizontalProgress extends ProgressBar {

    public static final int DEFAULT_TEXT_SIZE=10;//sp
    public static final int DEFAULT_TEXT_COLOR=0XFFFC00D1;
    public static final int DEFAULT_COLOR_UNREACH=0XFFD3D6DA;
    public static final int DEFAULT_HEIGHT_UNREACH=2;//dp
    public static final int DEFAULT_COLOR_REACH=DEFAULT_TEXT_COLOR;
    public static final int DEFAULT_HEIGHT_RRACH=2;//dp
    public static final int DEFAULT_TEXT_OFFSET=10;//dp     

    protected int mTextSize=sp2px(DEFAULT_TEXT_SIZE);
    protected int mTextColor=DEFAULT_TEXT_COLOR;
    protected int mUnReachColor=DEFAULT_COLOR_UNREACH;
    protected int mUnReachHeight=dp2px(DEFAULT_HEIGHT_UNREACH);
    protected int mReachColor=DEFAULT_COLOR_REACH;
    protected int mReachHeight=dp2px(DEFAULT_HEIGHT_RRACH);
    protected int mTextOffset=dp2px(DEFAULT_TEXT_OFFSET);//空隙的长度

    protected Paint mPaint=new Paint();
    protected int mRealWidth;



    public HorizontalProgress(Context context) {
        this(context,null);

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

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

        abtainStyledAttrs(attrs);

    }
    /**
     * 获取自定义属性
     * @param attrs
     */
    private void abtainStyledAttrs(AttributeSet attrs) {
        TypedArray ta=getContext().obtainStyledAttributes(attrs, R.styleable.HorizontalProgress);

        mTextSize=(int) ta.getDimension(R.styleable.HorizontalProgress_progress_text_size, mTextSize);
        mTextColor=ta.getColor(R.styleable.HorizontalProgress_progress_text_color, mTextColor);
        mUnReachColor=ta.getColor(R.styleable.HorizontalProgress_progress_unreach_color, mUnReachColor);
        mUnReachHeight=(int) ta.getDimension(R.styleable.HorizontalProgress_progress_unreach_height, mUnReachHeight);
        mReachColor=ta.getColor(R.styleable.HorizontalProgress_progress_reach_color, mReachColor);
        mReachHeight=(int) ta.getDimension(R.styleable.HorizontalProgress_progress_reach_height, mReachHeight);
        mTextOffset=(int) ta.getDimension(R.styleable.HorizontalProgress_progress_text_offset, mTextOffset);

        ta.recycle();

        mPaint.setTextSize(mTextSize);
    }

    @Override
    protected synchronized void onMeasure(int widthMeasureSpec,
            int heightMeasureSpec) {

        //int widthMode=MeasureSpec.getMode(widthMeasureSpec);
        int widthVal=MeasureSpec.getSize(widthMeasureSpec); //宽度直接让用户定，不能自适应
        int height=measureHeight(heightMeasureSpec);        
        setMeasuredDimension(widthVal, height);
        //获得控件的真实高度
        mRealWidth=getMeasuredWidth()-getPaddingLeft()-getPaddingRight();
    }


    private int measureHeight(int heightMeasureSpec) {
       int result=0;
       int model=MeasureSpec.getMode(heightMeasureSpec);
       int size=MeasureSpec.getSize(heightMeasureSpec);

       if(model==MeasureSpec.EXACTLY){
           result=size;
       }else{
           int textHeight=(int) (mPaint.descent()-mPaint.ascent());
           result=getPaddingBottom()+getPaddingTop()+Math.max(Math.max(mUnReachHeight, mReachHeight), Math.abs(textHeight));

           //高度不能大于给定的高度
           if(model==MeasureSpec.AT_MOST){
               result=Math.min(result, size);
           }
       }

        return result;
    }


    @Override
    protected synchronized void onDraw(Canvas canvas) {

        canvas.save();
        canvas.translate(getPaddingLeft(), getHeight()/2);//移动画布的位置

        Boolean noNeedUnreach=false;

        String text=getProgress()+"%";
        int textWidth=(int) mPaint.measureText(text);
        float radio=getProgress()*1.0f/getMax();//百分比
        float ProgressX=radio*mRealWidth;//已经过的进度值
        if((ProgressX+textWidth)>mRealWidth){
            ProgressX=mRealWidth-textWidth;
            noNeedUnreach=true;
        }

        //绘制reachbar
        float endX=ProgressX-mTextOffset/2;
        if(endX>0){
            mPaint.setColor(mReachColor);
            mPaint.setStrokeWidth(mReachHeight);
            canvas.drawLine(0, 0, endX, 0, mPaint);
        }
        //绘制文字
        mPaint.setColor(mTextColor);
        int y=(int) (-(mPaint.descent()+mPaint.ascent())/2);
        canvas.drawText(text, ProgressX, y, mPaint);
        //绘制unReachbar
        if(!noNeedUnreach){
            float start=ProgressX+textWidth+mTextOffset/2;
            mPaint.setColor(mUnReachColor);
            mPaint.setStrokeWidth(mUnReachHeight);
            canvas.drawLine(start, 0, mRealWidth, 0, mPaint);
        }

        canvas.restore();
    }


    protected int dp2px(int dp){
        return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, getResources().getDisplayMetrics());        
    }
    protected int sp2px(int sp){
        return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, sp, getResources().getDisplayMetrics());
    }

}

package com.ws.progressView;

import com.example.MyProgressbar.R;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint.Cap;
import android.graphics.Paint.Style;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.widget.ProgressBar;

public class RoundProgress extends HorizontalProgress {

    private int mRadius=dp2px(30);
    private int mMaxPaintWidth;

    public RoundProgress(Context context) {   
        this(context,null);
        // TODO Auto-generated constructor stub
    }

    public RoundProgress(Context context, AttributeSet attrs) {
        this(context, attrs,0);
        // TODO Auto-generated constructor stub    
    }

    public RoundProgress(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);

        mReachHeight=(int) (mUnReachHeight*2.5);

        TypedArray ta=context.obtainStyledAttributes(attrs,R.styleable.RoundProgress);
        mRadius=(int) ta.getDimension(R.styleable.RoundProgress_radius, mRadius);
        ta.recycle();

        mPaint.setStyle(Style.STROKE);
        mPaint.setAntiAlias(true);
        mPaint.setDither(true);
        mPaint.setStrokeCap(Cap.ROUND);

    }

    @Override
    protected synchronized void onMeasure(int widthMeasureSpec,
            int heightMeasureSpec) {

        mMaxPaintWidth=Math.max(mReachHeight, mUnReachHeight);
        int expect=mRadius*2+mMaxPaintWidth+getPaddingLeft()+getPaddingRight();

        int width=resolveSize(expect, widthMeasureSpec);
        int height=resolveSize(expect, heightMeasureSpec);

        int realWidth=Math.min(width, height);
        mRadius=(realWidth-getPaddingLeft()-getPaddingRight()-mMaxPaintWidth)/2;


        setMeasuredDimension(realWidth, realWidth);
    }

@Override
   protected synchronized void onDraw(Canvas canvas) {
     String text=getProgress()+"%";
     float textWidth=mPaint.measureText(text);
     float textHeight=(mPaint.descent()+mPaint.ascent())/2;

     canvas.save();
     canvas.translate(getPaddingLeft()+mMaxPaintWidth/2, getPaddingTop()+mMaxPaintWidth/2);
     mPaint.setStyle(Style.STROKE);

     //绘制unReact
     mPaint.setColor(mUnReachColor);
     mPaint.setStrokeWidth(mUnReachHeight);
     canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
     //绘制react
     mPaint.setColor(mReachColor);
     mPaint.setStrokeWidth(mReachHeight);
    float sweepAngle=getProgress()*1.0f/getMax()*360;
    canvas.drawArc(new RectF(0,0,mRadius*2,mRadius*2), 0, sweepAngle, false, mPaint);
    //绘制文字
    mPaint.setColor(mTextColor);
    mPaint.setStyle(Style.FILL);
    canvas.drawText(text, mRadius-textWidth/2, mRadius-textHeight/2, mPaint);

     canvas.restore();

}
}
小码哥_WS
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
android中自定义progressbar组件
01-04
使用android逐帧动画实现自定义loading进度条。
Android自定义ProgressBar
Townkoim的专栏
09-14 769
Android经常要自定义ProgressBar,因为工作需要，结合网上的他人的一些例子，重写ProgressBar 下面来看核心代码：import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Colo
Android 自定义ProgressBar显示百分比，原理+实战讲解
最新发布
2401_84152177的博客
04-06 842
【Android开发核心知识点笔记】【Android思维脑图（技能树）】【Android核心高级技术PDF文档，BAT大厂面试真题解析】【Android高级架构视频学习资源】《互联网大厂面试真题解析、进阶开发核心学习笔记、全套讲解视频、实战项目源码讲义》点击传送门即可获取！6989)][外链图片转存中…(img-crW479ph-1712359256989)][外链图片转存中…(img-WC2fSIOX-1712359256990)]
Android 自定义progressbar
FlyPig_Vip的博客
05-27 295
<ProgressBar android:id="@+id/otherProgress" style="?android:attr/progressBarStyleHorizontal" android:layout_width="@dimen/x40" android:layout_height="match_parent" android:layout_below="@id/l.
Android ProgressBar自定义
西瓜cc Blog
06-02 783
效果图如下 开发中经常会有自定义进度条需求，下面举例水平和垂直两个方向的进度条如何进行自定义 布局文件<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/act
android 自定义progressbar
08-13
实现了自定义progressbar,修改style 然后引用该style
android 自定义ProgressBar
04-23
android 自定义ProgressBar，各种风格的都有哦。方便使用
Android自定义Progressbar
04-16
Android自定义Progressbar， 任何图片都能够像Porgressbar一样转动
Android之自定义ProgressBar
冰点蓝欣的专栏
02-26 2131
本文简单介绍下Android之自定义ProgressBar。
[Android]自定义ProgressBar,SeekBar
06-02
详情见博客:http://blog.csdn.net/zhangxiaofan_/article/details/51566455
自定义圆形的ProgressBar
无为
02-28 1311
1.自定义圆形的ProgressBar 　　效果图： 　　圆形ProgressBar的样式主要有以下几个，我们这里以progressBarStyleLarge为例进行样式的修改，其他的类似。       ProgressBar　　android:layout_width="wrap_content" 　　android:layout_height="wrap_conten
Android自定义progressBar
weixin_30512089的博客
05-26 79
通过继承系统ProgressBar实现 效果图 实现 HorizontalProgressBarWithNumber 自定义属性 <?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="HorizontalProgress...
自定义ProgressBar
feixiaku的专栏
04-08 507
应用场景：自定义带动画进度条 效果图： 1.在xml文件中添加ProgressBar控件 代码如下： ProgressBar android:id="@+id/customProgressBar" android:layout_width="wrap_content" android:layout_height="
Android ProgressBar自定义图片进度，自定义渐变色进度条
strliu的专栏
05-30 2372
↳    android.view.View 3        ↳    android.widget.ProgressBar 4 直接子类 5 AbsSeekBar 6 间接子类
android 自定义view progressBar
03-20
Android自定义ProgressBar可以通过继承View或者ViewGroup来实现。下面是一种常见的自定义ProgressBar的实现方式： 1. 创建一个新的Java类，继承自View或者ViewGroup，例如CustomProgressBar。 2. 在...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值