Android自定义Material进度条效果

首先看下效果图

布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  xmlns:tools="http://schemas.android.com/tools" 
  xmlns:app="http://schemas.android.com/apk/res-auto" 
  android:layout_width="match_parent" 
  android:layout_height="match_parent" 
  android:background="#ffffff" 
  android:gravity="center" 
  android:orientation="vertical" 
  android:paddingBottom="@dimen/activity_vertical_margin" 
  android:paddingLeft="@dimen/activity_horizontal_margin" 
  android:paddingRight="@dimen/activity_horizontal_margin" 
  android:paddingTop="@dimen/activity_vertical_margin" > 
 
  <com.example.mytest.view.CircleProgressBar 
    android:id="@+id/progress1" 
    android:layout_width="60dp" 
    android:layout_height="60dp" 
    app:mlpb_progress_color="#566da9" 
    app:mlpb_progress_stoke_width="3dp" /> 
 
</LinearLayout> 

声明属性

<declare-styleable name="CircleProgressBar"> 
    <attr name="mlpb_inner_radius" format="dimension"/> 
    <attr name="mlpb_background_color" format="color"/> 
    <attr name="mlpb_progress_color" format="color"/> 
    <attr name="mlpb_progress_stoke_width" format="dimension"/> 
    <attr name="mlpb_show_arrow" format="boolean"/> 
    <attr name="mlpb_enable_circle_background" format="boolean"/> 
    <attr name="mlpb_arrow_width" format="dimension"/> 
    <attr name="mlpb_arrow_height" format="dimension"/> 
 
    <attr name="mlpb_progress" format="integer"/> 
    <attr name="mlpb_max" format="integer"/> 
 
 
    <attr name="mlpb_progress_text_size" format="dimension"/> 
    <attr name="mlpb_progress_text_color" format="color"/> 
 
    <!--<attr name="mlpb_progress_text_offset" format="dimension"/>--> 
 
    <attr name="mlpb_progress_text_visibility" format="enum"> 
      <enum name="visible" value="0"/> 
      <enum name="invisible" value="1"/> 
    </attr> 
  </declare-styleable> 

自定义控件：

/* 
 * Copyright (C) 2014 The Android Open Source Project 
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); 
 * you may not use this file except in compliance with the License. 
 * You may obtain a copy of the License at 
 * 
 *   http://www.apache.org/licenses/LICENSE-2.0 
 * 
 * Unless required by applicable law or agreed to in writing, software 
 * distributed under the License is distributed on an "AS IS" BASIS, 
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 
 * See the License for the specific language governing permissions and 
 * limitations under the License. 
 */ 
 
package com.example.mytest.view; 
 
import android.content.Context; 
import android.content.res.Resources; 
import android.content.res.TypedArray; 
import android.graphics.Canvas; 
import android.graphics.Color; 
import android.graphics.Paint; 
import android.graphics.RadialGradient; 
import android.graphics.Shader; 
import android.graphics.drawable.Drawable; 
import android.graphics.drawable.ShapeDrawable; 
import android.graphics.drawable.shapes.OvalShape; 
import android.net.Uri; 
import android.support.v4.view.ViewCompat; 
import android.util.AttributeSet; 
import android.view.animation.Animation; 
import android.widget.ImageView; 
 
import com.example.mytest.R; 
 
/** 
 * Private class created to work around issues with AnimationListeners being 
 * called before the animation is actually complete and support shadows on older 
 * platforms. 
 */ 
public class CircleProgressBar extends ImageView { 
 
  private static final int KEY_SHADOW_COLOR = 0x1E000000; 
  private static final int FILL_SHADOW_COLOR = 0x3D000000; 
  // PX 
  private static final float X_OFFSET = 0f; 
  private static final float Y_OFFSET = 1.75f; 
  private static final float SHADOW_RADIUS = 3.5f; 
  private static final int SHADOW_ELEVATION = 4; 
 
 
  private static final int DEFAULT_CIRCLE_BG_LIGHT = 0xFFFAFAFA; 
  private static final int DEFAULT_CIRCLE_DIAMETER = 56; 
  private static final int STROKE_WIDTH_LARGE = 3; 
  public static final int DEFAULT_TEXT_SIZE = 9; 
 
  private Animation.AnimationListener mListener; 
  private int mShadowRadius; 
  private int mBackGroundColor; 
  private int mProgressColor; 
  private int mProgressStokeWidth; 
  private int mArrowWidth; 
  private int mArrowHeight; 
  private int mProgress; 
  private int mMax; 
  private int mDiameter; 
  private int mInnerRadius; 
  private Paint mTextPaint; 
  private int mTextColor; 
  private int mTextSize; 
  private boolean mIfDrawText; 
  private boolean mShowArrow; 
  private MaterialProgressDrawable mProgressDrawable; 
  private ShapeDrawable mBgCircle; 
  private boolean mCircleBackgroundEnabled; 
  private int[] mColors = new int[]{Color.BLACK}; 
 
  public CircleProgressBar(Context context) { 
    super(context); 
    init(context, null, 0); 
 
  } 
 
  public CircleProgressBar(Context context, AttributeSet attrs) { 
    super(context, attrs); 
    init(context, attrs, 0); 
 
  } 
 
  public CircleProgressBar(Context context, AttributeSet attrs, int defStyleAttr) { 
    super(context, attrs, defStyleAttr); 
    init(context, attrs, defStyleAttr); 
  } 
 
  private void init(Context context, AttributeSet attrs, int defStyleAttr) { 
    final TypedArray a = context.obtainStyledAttributes( 
        attrs, R.styleable.CircleProgressBar, defStyleAttr, 0); 
//    <attr name="mlpb_inner_radius" format="dimension"/> 
//    <attr name="mlpb_background_color" format="color"/> 
//    <attr name="mlpb_progress_color" format="color"/> 
//    <attr name="mlpb_progress_stoke_width" format="dimension"/> 
//    <attr name="mlpb_arrow_width" format="dimension"/> 
//    <attr name="mlpb_arrow_height" format="dimension"/> 
// 
//    <attr name="mlpb_progress" format="integer"/> 
//    <attr name="mlpb_max" format="integer"/> 
// 
// 
//    <attr name="mlpb_progress_text_size" format="dimension"/> 
//    <attr name="mlpb_progress_text_color" format="color"/> 
// 
//    <attr name="mlpb_progress_text_offset" format="dimension"/> 
// 
//    <attr name="mlpb_progress_text_visibility" format="enum"> 
//    <enum name="visible" value="0"/> 
//    <enum name="invisible" value="1"/> 
//    </attr> 
    final float density = getContext().getResources().getDisplayMetrics().density; 
 
    mBackGroundColor = a.getColor( 
        R.styleable.CircleProgressBar_mlpb_background_color, DEFAULT_CIRCLE_BG_LIGHT); 
 
    mProgressColor = a.getColor( 
        R.styleable.CircleProgressBar_mlpb_progress_color, DEFAULT_CIRCLE_BG_LIGHT); 
    mColors = new int[]{mProgressColor}; 
 
    mInnerRadius = a.getDimensionPixelOffset( 
        R.styleable.CircleProgressBar_mlpb_inner_radius, -1); 
 
    mProgressStokeWidth = a.getDimensionPixelOffset( 
        R.styleable.CircleProgressBar_mlpb_progress_stoke_width, (int) (STROKE_WIDTH_LARGE * density)); 
    mArrowWidth = a.getDimensionPixelOffset( 
        R.styleable.CircleProgressBar_mlpb_arrow_width, -1); 
    mArrowHeight = a.getDimensionPixelOffset( 
        R.styleable.CircleProgressBar_mlpb_arrow_height, -1); 
    mTextSize = a.getDimensionPixelOffset( 
        R.styleable.CircleProgressBar_mlpb_progress_text_size, (int) (DEFAULT_TEXT_SIZE * density)); 
    mTextColor = a.getColor( 
        R.styleable.CircleProgressBar_mlpb_progress_text_color, Color.BLACK); 
 
    mShowArrow = a.getBoolean(R.styleable.CircleProgressBar_mlpb_show_arrow, false); 
    mCircleBackgroundEnabled = a.getBoolean(R.styleable.CircleProgressBar_mlpb_enable_circle_background, true); 
 
 
    mProgress = a.getInt(R.styleable.CircleProgressBar_mlpb_progress, 0); 
    mMax = a.getInt(R.styleable.CircleProgressBar_mlpb_max, 100); 
    int textVisible = a.getInt(R.styleable.CircleProgressBar_mlpb_progress_text_visibility, 1); 
    if (textVisible != 1) { 
      mIfDrawText = true; 
    } 
 
    mTextPaint = new Paint(); 
    mTextPaint.setStyle(Paint.Style.FILL); 
    mTextPaint.setColor(mTextColor); 
    mTextPaint.setTextSize(mTextSize); 
    mTextPaint.setAntiAlias(true); 
    a.recycle(); 
    mProgressDrawable = new MaterialProgressDrawable(getContext(), this); 
    super.setImageDrawable(mProgressDrawable); 
  } 
 
 
  private boolean elevationSupported() { 
    return android.os.Build.VERSION.SDK_INT >= 21; 
  } 
 
  @Override 
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
    if (!elevationSupported()) { 
      setMeasuredDimension(getMeasuredWidth() + mShadowRadius * 2, getMeasuredHeight() 
          + mShadowRadius * 2); 
    } 
  } 
 
  @Override 
  protected void onLayout(boolean changed, int left, int top, int right, int bottom) { 
    super.onLayout(changed, left, top, right, bottom); 
    final float density = getContext().getResources().getDisplayMetrics().density; 
    mDiameter = Math.min(getMeasuredWidth(), getMeasuredHeight()); 
    if (mDiameter <= 0) { 
      mDiameter = (int) density * DEFAULT_CIRCLE_DIAMETER; 
    } 
    if (getBackground() == null && mCircleBackgroundEnabled) { 
      final int shadowYOffset = (int) (density * Y_OFFSET); 
      final int shadowXOffset = (int) (density * X_OFFSET); 
      mShadowRadius = (int) (density * SHADOW_RADIUS); 
 
      if (elevationSupported()) { 
        mBgCircle = new ShapeDrawable(new OvalShape()); 
        ViewCompat.setElevation(this, SHADOW_ELEVATION * density); 
      } else { 
        OvalShape oval = new OvalShadow(mShadowRadius, mDiameter - mShadowRadius * 2); 
        mBgCircle = new ShapeDrawable(oval); 
        ViewCompat.setLayerType(this, ViewCompat.LAYER_TYPE_SOFTWARE, mBgCircle.getPaint()); 
        mBgCircle.getPaint().setShadowLayer(mShadowRadius, shadowXOffset, shadowYOffset, 
            KEY_SHADOW_COLOR); 
        final int padding = (int) mShadowRadius; 
        // set padding so the inner image sits correctly within the shadow. 
        setPadding(padding, padding, padding, padding); 
      } 
      mBgCircle.getPaint().setColor(mBackGroundColor); 
      setBackgroundDrawable(mBgCircle); 
    } 
    mProgressDrawable.setBackgroundColor(mBackGroundColor); 
    mProgressDrawable.setColorSchemeColors(mColors); 
    mProgressDrawable.setSizeParameters(mDiameter, mDiameter, 
        mInnerRadius <= 0 ? (mDiameter - mProgressStokeWidth * 2) / 4 : mInnerRadius, 
        mProgressStokeWidth, 
        mArrowWidth < 0 ? mProgressStokeWidth * 4 : mArrowWidth, 
        mArrowHeight < 0 ? mProgressStokeWidth * 2 : mArrowHeight); 
    if (isShowArrow()) { 
      mProgressDrawable.showArrowOnFirstStart(true); 
      mProgressDrawable.setArrowScale(1f); 
      mProgressDrawable.showArrow(true); 
    } 
    super.setImageDrawable(null); 
    super.setImageDrawable(mProgressDrawable); 
    mProgressDrawable.setAlpha(255); 
    if(getVisibility()==VISIBLE) { 
      mProgressDrawable.start(); 
    } 
  } 
 
  @Override 
  protected void onDraw(Canvas canvas) { 
    super.onDraw(canvas); 
    if (mIfDrawText) { 
      String text = String.format("%s%%", mProgress); 
      int x = getWidth() / 2 - text.length() * mTextSize / 4; 
      int y = getHeight() / 2 + mTextSize / 4; 
      canvas.drawText(text, x, y, mTextPaint); 
    } 
  } 
 
  @Override 
  final public void setImageResource(int resId) { 
 
  } 
 
 
  public boolean isShowArrow() { 
    return mShowArrow; 
  } 
 
  public void setShowArrow(boolean showArrow) { 
    this.mShowArrow = showArrow; 
  } 
 
 
  @Override 
  final public void setImageURI(Uri uri) { 
    super.setImageURI(uri); 
  } 
 
  @Override 
  final public void setImageDrawable(Drawable drawable) { 
  } 
 
  public void setAnimationListener(Animation.AnimationListener listener) { 
    mListener = listener; 
  } 
 
  @Override 
  public void onAnimationStart() { 
    super.onAnimationStart(); 
    if (mListener != null) { 
      mListener.onAnimationStart(getAnimation()); 
    } 
  } 
 
  @Override 
  public void onAnimationEnd() { 
    super.onAnimationEnd(); 
    if (mListener != null) { 
      mListener.onAnimationEnd(getAnimation()); 
    } 
  } 
 
 
  /** 
   * Set the color resources used in the progress animation from color resources. 
   * The first color will also be the color of the bar that grows in response 
   * to a user swipe gesture. 
   * 
   * @param colorResIds 
   */ 
  public void setColorSchemeResources(int... colorResIds) { 
    final Resources res = getResources(); 
    int[] colorRes = new int[colorResIds.length]; 
    for (int i = 0; i < colorResIds.length; i++) { 
      colorRes[i] = res.getColor(colorResIds[i]); 
    } 
    setColorSchemeColors(colorRes); 
  } 
 
  /** 
   * Set the colors used in the progress animation. The first 
   * color will also be the color of the bar that grows in response to a user 
   * swipe gesture. 
   * 
   * @param colors 
   */ 
  public void setColorSchemeColors(int... colors) { 
    mColors = colors; 
    if (mProgressDrawable != null) { 
      mProgressDrawable.setColorSchemeColors(colors); 
    } 
  } 
 
  /** 
   * Update the background color of the mBgCircle image view. 
   */ 
  public void setBackgroundColor(int colorRes) { 
    if (getBackground() instanceof ShapeDrawable) { 
      final Resources res = getResources(); 
      ((ShapeDrawable) getBackground()).getPaint().setColor(res.getColor(colorRes)); 
    } 
  } 
 
  public boolean isShowProgressText() { 
    return mIfDrawText; 
  } 
 
  public void setShowProgressText(boolean mIfDrawText) { 
    this.mIfDrawText = mIfDrawText; 
  } 
 
  public int getMax() { 
    return mMax; 
  } 
 
  public void setMax(int max) { 
    mMax = max; 
  } 
 
  public int getProgress() { 
    return mProgress; 
  } 
 
  public void setProgress(int progress) { 
    if (getMax() > 0) { 
      mProgress = progress; 
    } 
  } 
 
 
  public boolean circleBackgroundEnabled() { 
    return mCircleBackgroundEnabled; 
  } 
 
  public void setCircleBackgroundEnabled(boolean enableCircleBackground) { 
    this.mCircleBackgroundEnabled = enableCircleBackground; 
  } 
 
  @Override 
  public int getVisibility() { 
    return super.getVisibility(); 
  } 
 
  @Override 
  public void setVisibility(int visibility) { 
    super.setVisibility(visibility); 
    if (mProgressDrawable != null) { 
      mProgressDrawable.setVisible(visibility == VISIBLE, false); 
      if (visibility != VISIBLE) { 
        mProgressDrawable.stop(); 
      } else { 
        if (mProgressDrawable.isRunning()) { 
          mProgressDrawable.stop(); 
        } 
        mProgressDrawable.start(); 
      } 
    } 
  } 
 
  @Override 
  protected void onAttachedToWindow() { 
    super.onAttachedToWindow(); 
    if (mProgressDrawable != null) { 
      mProgressDrawable.stop(); 
      mProgressDrawable.setVisible(getVisibility() == VISIBLE, false); 
 
      requestLayout(); 
    } 
  } 
 
  @Override 
  protected void onDetachedFromWindow() { 
    super.onDetachedFromWindow(); 
    if (mProgressDrawable != null) { 
      mProgressDrawable.stop(); 
      mProgressDrawable.setVisible(false, false); 
    } 
  } 
 
 
  private class OvalShadow extends OvalShape { 
    private RadialGradient mRadialGradient; 
    private int mShadowRadius; 
    private Paint mShadowPaint; 
    private int mCircleDiameter; 
 
    public OvalShadow(int shadowRadius, int circleDiameter) { 
      super(); 
      mShadowPaint = new Paint(); 
      mShadowRadius = shadowRadius; 
      mCircleDiameter = circleDiameter; 
      mRadialGradient = new RadialGradient(mCircleDiameter / 2, mCircleDiameter / 2, 
          mShadowRadius, new int[]{ 
          FILL_SHADOW_COLOR, Color.TRANSPARENT 
      }, null, Shader.TileMode.CLAMP); 
      mShadowPaint.setShader(mRadialGradient); 
    } 
 
    @Override 
    public void draw(Canvas canvas, Paint paint) { 
      final int viewWidth = CircleProgressBar.this.getWidth(); 
      final int viewHeight = CircleProgressBar.this.getHeight(); 
      canvas.drawCircle(viewWidth / 2, viewHeight / 2, (mCircleDiameter / 2 + mShadowRadius), 
          mShadowPaint); 
      canvas.drawCircle(viewWidth / 2, viewHeight / 2, (mCircleDiameter / 2), paint); 
    } 
  } 
} 

在java代码中设置进度条上的颜色值

progress1 = (CircleProgressBar) findViewById(R.id.progress1); 
progress1.setColorSchemeResources(android.R.color.holo_green_light,android.R.color.holo_orange_light,android.R.color.holo_red_light); 

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

# Android  # Material  # 进度条  # Material Design系列之Behavior实现Android知乎首页  # Android App仿QQ制作Material Design风格沉浸式状态栏  # Android Material设计中列表和卡片的创建方法解析  # 详解Android Material设计中阴影效果的实现方法  # 详解Android Material Design自定义动画的编写  # Android时间选择器、日期选择器实现代码  # Android Material组件库日期选择和时间选择器的使用方法  # 自定义  # 大家多多  # Color  # Canvas  # RadialGradient  # Paint  # Shader  # Context  # content  # Resources  # graphics  # TypedArray  # drawable  # support  # ViewCompat  # AttributeSet  # util  # Uri  # ShapeDrawable 

相关文章： 如何在Mac上搭建Golang开发环境_使用Homebrew安装和管理Go版本  如何通过西部数码建站助手快速创建专业网站？  成都网站制作报价公司,成都工业用气开户费用？  如何在IIS中新建站点并解决端口绑定冲突？  Swift中循环语句中的转移语句 break 和 continue  建站主机如何选？性能与价格怎样平衡？  云南网站制作公司有哪些,云南最好的招聘网站是哪个？  如何在阿里云服务器自主搭建网站？  台州网站建设制作公司,浙江手机无犯罪记录证明怎么开？  成都响应式网站开发,dw怎么把手机适应页面变成网页？  建站VPS能否同时实现高效与安全翻墙？  如何获取免费开源的自助建站系统源码？  建站主机是否等同于虚拟主机？  如何构建满足综合性能需求的优质建站方案？  测试制作网站有哪些,测试性取向的权威测试或者网站？  深圳网站制作费用多少钱,读秀，深圳文献港这样的网站很多只提供网上试读，但有些人只要提供试读的文章就能全篇下载，这个是怎么弄的？  网站海报制作教学视频教程,有什么免费的高清可商用图片网站，用于海报设计？  制作网站建设的公司有哪些,网站建设比较好的公司都有哪些？  如何在Golang中使用replace替换模块_指定本地或远程路径  制作网站的过程怎么写,用凡科建站如何制作自己的网站？  网站好制作吗知乎,网站开发好学吗？有什么技巧？  如何将凡科建站内容保存为本地文件？  已有域名如何免费搭建网站？  如何通过FTP服务器快速搭建网站？  如何注册花生壳免费域名并搭建个人网站？  网页设计网站制作软件,microsoft office哪个可以创建网页？  建站ABC备案流程中有哪些关键注意事项？  如何快速搭建二级域名独立网站？  广东专业制作网站有哪些,广东省能源集团有限公司官网？  网站制作怎么样才能赚钱,用自己的电脑做服务器架设网站有什么利弊，能赚钱吗？  在线制作视频网站免费,都有哪些好的动漫网站？  如何在Golang中处理模块冲突_解决依赖版本不兼容问题  官网自助建站系统：SEO优化+多语言支持，快速搭建专业网站  非常酷的网站设计制作软件,酷培ai教育官方网站？  开源网站制作软件,开源网站什么意思？  营销式网站制作方案,销售哪个网站招聘效果最好？  宁波自助建站系统如何快速打造专业企业网站？  c# 服务器GC和工作站GC的区别和设置  小程序网站制作需要准备什么资料,如何制作小程序？  沈阳制作网站公司排名,沈阳装饰协会官方网站？  如何选择最佳自助建站系统？快速指南解析优劣  香港服务器建站指南：外贸独立站搭建与跨境电商配置流程  建站之星客服服务时间及联系方式如何？  如何高效配置香港服务器实现快速建站？  设计网站制作公司有哪些,制作网页教程？  建站之星CMS五站合一模板配置与SEO优化指南  网站app免费制作软件,能免费看各大网站视频的手机app？  企业微网站怎么做,公司网站和公众号有什么区别？  如何在橙子建站中快速调整背景颜色？  高防服务器租用如何选择配置与防御等级？