Android自定义水平渐变进度条

作者:hust_twj 时间:2022-06-02 14:22:42 

先看进度条的效果:

Android自定义水平渐变进度条

具体实现:

新建类,继承自View,在onDraw中进行绘制:


import android.content.Context;
import android.graphics.Canvas;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

/**
*
* 自定义 进度条
* Created by wenjing.tang on 2017/8/7.
*/

public class CustomizedProgressBar extends View {

private float maxCount = 100; //进度条最大值
private float currentCount; //进度条当前值
// private Paint mPaint ;
private int mWidth,mHeight;
private Context mContext;

public CustomizedProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {
 super(context, attrs, defStyleAttr);
 initView(context);
}

public CustomizedProgressBar(Context context, AttributeSet attrs) {
 super(context, attrs);
 initView(context);
}

public CustomizedProgressBar(Context context) {
 super(context);
 initView(context);
}

private void initView(Context context) {
 mContext=context;
}

@Override
protected void onDraw(Canvas canvas) {
 super.onDraw(canvas);
 Paint mPaint = new Paint();
 mPaint.setAntiAlias(true);
 int round = mHeight/2; //半径

mPaint.setColor(getResources().getColor(R.color.white_alpha)); //设置边框背景颜色
 RectF rectBg = new RectF(0, 0, mWidth, mHeight);
 canvas.drawRoundRect(rectBg, round, round, mPaint);//绘制 最外面的大 圆角矩形,背景为白色

float section = currentCount/maxCount; //进度条的比例
 RectF rectProgressBg = new RectF(0, 0, mWidth*section, mHeight);

Log.e("CustomizedProgressBar", currentCount+"");
 Log.e("CustomizedProgressBar", section+"");

//Paint设置setColor(白色无透明)和setShader,只让setShader生效;不然前面setColor设置了透明度,透明度会生效,和setShader效果叠加
 mPaint.setColor(getResources().getColor(R.color.white));
 mPaint.setShader(getLinearGradient());
 canvas.drawRoundRect(rectProgressBg, round, round, mPaint); //最左边的圆角矩形

if (maxCount != currentCount){ //如果不是100%,绘制第三段矩形
  RectF rectProgressBg2 = new RectF(mWidth*section-round, 0, mWidth*section, mHeight);
  mPaint.setShader(getLinearGradient());
  canvas.drawRect(rectProgressBg2, mPaint);
 }
}

private LinearGradient linearGradient;
private LinearGradient getLinearGradient(){
 if(linearGradient==null){
  linearGradient = new LinearGradient(0, 0, getWidth(), mHeight, new int[]{mContext.getResources().getColor(R.color.progress_color_1),
    mContext.getResources().getColor(R.color.progress_color_2)}, null, Shader.TileMode.CLAMP); //根据R文件中的id获取到color
 }
 return linearGradient;
}

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;
 invalidate();
}

public float getMaxCount() {
 return maxCount;
}

public float getCurrentCount() {
 return currentCount;
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);
 int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);
 int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);
 int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);
 if (widthSpecMode == MeasureSpec.EXACTLY || widthSpecMode == MeasureSpec.AT_MOST) {
  mWidth = widthSpecSize;
 } else {
  mWidth = 0;
 }
 if (heightSpecMode == MeasureSpec.AT_MOST || heightSpecMode == MeasureSpec.UNSPECIFIED) {
  mHeight = dipToPx(18);
 } else {
  mHeight = heightSpecSize;
 }
 setMeasuredDimension(mWidth, mHeight);
}
}

其中用到的一些资源文件如下:


<!--自定义进度条背景颜色-->
<color name="white_alpha">#0c000000</color>

<!--自定义进度条渐变颜色-->
<color name="progress_color_1">#ff916b</color>
<color name="progress_color_2">#ffa94c</color>

要注意的是,在上面Java代码中,mPaint.setColor(getResources().getColor(R.color.white));这行很重要,因为进度条总共有三层,第一层是最外面的背景,第二层是进度,第三层如果不是100%才绘制,由于第一层背景有透明度,所以setColor设置了透明度,但虽然setShader,透明度还是会生效,两者效果叠加,效果是这样:

Android自定义水平渐变进度条

加上之后,Paint 第二次设置 setColor (白色无透明)和 setShader,只让 setShader 生效,进度条才会达到满意的效果;

用法:

Java代码中:


customizedProgressBar.setMaxCount(100);
integrity = dataCount/TOTAL_COUNT *100; //根据自己情况来初始化完整度
customizedProgressBar.setCurrentCount((int) integrity);
mTvtDataIntegrity.setText("完整度" + (int) integrity +"%");

xml文件中(不需要文字显示也可以):


<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="18dp"
    android:layout_marginStart="66dp"
    android:layout_marginEnd="66dp"
    android:layout_centerVertical="true">

<com.text.widget.CustomizedProgressBar
     android:id="@+id/progress"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:layout_centerInParent="true"/>

<TextView
     android:id="@+id/tv_data_integrity"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:gravity="center"
     tools:text="完整度35%"
     android:textSize="10sp"
     android:layout_centerInParent="true"/>
</RelativeLayout>

来源:http://blog.csdn.net/hust_twj/article/details/78063444

标签:Android,进度条
0
投稿

猜你喜欢

  • Spring Data JPA 设置字段默认值方式

    2021-08-13 07:27:06
  • 【IntelliJ IDEA】Maven构建自己的第一个Java后台的方法

    2023-09-24 20:11:16
  • Android 高德地图之poi搜索功能的实现代码

    2022-03-07 01:36:52
  • Android线性布局与相对布局的实现

    2021-07-26 09:08:01
  • Winform控件Picture实现图片拖拽显示效果

    2022-04-01 05:49:54
  • Android 实现卡片堆叠钱包管理动画效果

    2021-12-12 11:15:02
  • Java将json对象转换为map键值对案例详解

    2023-11-28 07:38:43
  • 蓝牙原理Android代码实现

    2023-07-10 20:25:31
  • Flutter Android应用启动白屏的解决方案

    2022-10-02 04:08:04
  • SpringBoot 多Profile使用与切换方式

    2022-04-13 14:58:27
  • C# 线程同步的方法

    2022-12-11 01:46:05
  • 重写Java中的equals方法介绍

    2023-06-24 00:30:26
  • Springboot整合Netty实现RPC服务器的示例代码

    2023-07-14 11:35:35
  • c#处理3种json数据的实例

    2023-06-23 19:12:47
  • 一文搞懂Java顶层类之Object类的使用

    2023-06-02 06:15:42
  • Android超实用的Toast提示框优化分享

    2022-12-20 08:36:32
  • Spring AOP实现权限检查的功能

    2023-08-10 06:51:14
  • Java实现快速排序过程分析

    2023-07-27 18:40:57
  • java中的this引用及对象构造初始化

    2023-03-07 09:38:17
  • 浅谈Java slf4j日志简单理解

    2021-07-07 15:49:15
  • asp之家 软件编程 m.aspxhome.com