热门标签 | HotTags
当前位置:  开发笔记 > Android > 正文

Android自定义控件之圆形进度条动画

这篇文章主要为大家详细介绍了Android自定义控件之圆形进度条动画,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了Android实现圆形进度条动画的具体代码,供大家参考,具体内容如下

首先贴上图片:

额,感觉还行吧,就是进度条的颜色丑了点,不过咱是程序员,不是美工,配色这种问题当然不在考虑范围之内了。

下面说重点,如何来写一个这样的自定义控件。

首先,需要有一个灰色的底图,来作为未填充时的进度条;

然后,根据传入的当前进度值,绘制填充时的进度圆弧,这段圆弧所对应的圆心角,由当前进度与进度的最大值(一般是100)的比值计算得出;

其次,根据进度值绘制文字提示;

最后,重绘控件,加上动画,从而达到显示进度的效果。

代码如下:

1、attrs.xml

<&#63;xml version="1.0" encoding="utf-8"&#63;>

 
  
    
    
    
    
  
 

2、CircleProgressBar.java

package com.ctgu.circleprogressbar;
 
import android.animation.ValueAnimator;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.Paint.FontMetricsInt;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
import android.view.animation.OvershootInterpolator;
 
public class CircleProgressBar extends View
{
 /**
 * 进度条最大值,默认为100
 */
 private int maxValue = 100;
 
 /**
 * 当前进度值
 */
 private int currentValue = 0;
 
 /**
 * 每次扫过的角度,用来设置进度条圆弧所对应的圆心角,alphaAngle=(currentValue/maxValue)*360
 */
 private float alphaAngle;
 
 /**
 * 底部圆弧的颜色,默认为Color.LTGRAY
 */
 private int firstColor;
 
 /**
 * 进度条圆弧块的颜色
 */
 private int secondColor;
 
 /**
 * 圆环的宽度
 */
 private int circleWidth;
 
 /**
 * 画圆弧的画笔
 */
 private Paint circlePaint;
 
 /**
 * 画文字的画笔
 */
 private Paint textPaint;
 
 /**
 * 渐变圆周颜色数组
 */
 private int[] colorArray = new int[] { Color.parseColor("#27B197"), Color.parseColor("#00A6D5") };//
 
 /**
 * 通过代码创建时才使用
 * 
 * @param context
 */
 public CircleProgressBar(Context context)
 {
 this(context, null);
 }
 
 /**
 * 当从xml中加载view的时候,这个构造器才会被调用。其第二个参数中就包含自定义的属性。
 * 
 * @param context
 *      上下文
 * @param attrs
 *      自定义属性
 */
 public CircleProgressBar(Context context, AttributeSet attrs)
 {
 this(context, attrs, 0);
 }
 
 /**
 * 从xml加载时执行和应用一个特定的风格。这里有两种方式,一是从theme中获得,二是从style中获得。    
 * 第三个参数官方有这样的说明: defStyle - The default style to apply to this view. If 0,
 * no style will be applied (beyond what is included in the theme). This may
 * either be an attribute resource, whose value will be retrieved from the
 * current theme, or an explicit style resource.
 * 默认的风格会被应用到这个view上。如果是0,没有风格将会被应用
 * (除了被包含在主题中)。这个也许是一个属性的资源,它的值是从当前的主题中检索,或者是一个明确的风格资源。
 * 
 * @param context
 *      上下文
 * @param attrs
 *      自定义的属性
 * @param defStyleAttr
 *      自定义风格
 */
 public CircleProgressBar(Context context, AttributeSet attrs, int defStyleAttr)
 {
 super(context, attrs, defStyleAttr);
 
 TypedArray ta = context.getTheme().obtainStyledAttributes(attrs, R.styleable.circleProgressBar,
  defStyleAttr, 0);
 int n = ta.getIndexCount();
 
 for (int i = 0; i 
 * 
 * @param color
 */
 public void setSecondColor(int color)
 {
 this.secOndColor= color;
 circlePaint.setColor(secondColor);
 invalidate();
 }
 
 /**
 * 设置进度条渐变色颜色数组
 * 
 * @param colors
 *      颜色数组,类型为int[]
 */
 public void setColorArray(int[] colors)
 {
 this.colorArray = colors;
 invalidate();
 }
 
 /**
 * 按进度显示百分比
 * 
 * @param progress
 *      进度,值通常为0到100
 */
 public void setProgress(int progress)
 {
 int percent = progress * maxValue / 100;
 if (percent <0)
 {
  percent = 0;
 }
 if (percent > 100)
 {
  percent = 100;
 }
 this.currentValue = percent;
 invalidate();
 }
 
 /**
 * 按进度显示百分比,可选择是否启用数字动画
 * 
 * @param progress
 *      进度,值通常为0到100
 * @param useAnimation
 *      是否启用动画,true为启用
 */
 public void setProgress(int progress, boolean useAnimation)
 {
 int percent = progress * maxValue / 100;
 if (percent <0)
 {
  percent = 0;
 }
 if (percent > 100)
 {
  percent = 100;
 }
 if (useAnimation) // 使用动画
 {
  ValueAnimator animator = ValueAnimator.ofInt(0, percent);
  animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener()
  {
  @Override
  public void onAnimationUpdate(ValueAnimator animation)
  {
   currentValue = (int) animation.getAnimatedValue();
   invalidate();
  }
  });
  animator.setInterpolator(new OvershootInterpolator());
  animator.setDuration(1000);
  animator.start();
 }
 else
 {
  setProgress(progress);
 }
 }
}

3、activity_main.xml


 
  
 
  
 

4、MainActivity.java

package com.ctgu.circleprogressbar;
 
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.os.Handler;
import android.widget.SeekBar;
 
public class MainActivity extends Activity
{
 private CircleProgressBar circleProgressBar; // 自定义的进度条
 private SeekBar seekbar; // 拖动条
 
 private int[] colors = new int[] { Color.parseColor("#27B197"), Color.parseColor("#00A6D5") };
 
 @Override
 protected void onCreate(Bundle savedInstanceState)
 {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 
 circleProgressBar = (CircleProgressBar) findViewById(R.id.circleProgressBar);
// circleProgressBar.setFirstColor(Color.LTGRAY);
// circleProgressBar.setColorArray(colors); //觉得进度条颜色丑的,这里可以自行传入一个颜色渐变数组。
// circleProgressBar.setCircleWidth(6);
 
 seekbar = (SeekBar) findViewById(R.id.seekbar);
 seekbar.setMax(100);
 seekbar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener()
 {
  @Override
  public void onStopTrackingTouch(SeekBar seekBar)
  {
 
  }
 
  @Override
  public void onStartTrackingTouch(SeekBar seekBar)
  {
 
  }
 
  @Override
  public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser)
  {
  if (fromUser)
  {
   // circleProgressBar.setProgress(progress); //不使用动画
   circleProgressBar.setProgress(progress, true); // 使用数字过渡动画
  }
  }
 });
 }
}

代码注释很详细了,基本上了解自定义控件的都看得懂。

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


推荐阅读
  • Android 九宫格布局详解及实现:人人网应用示例
    本文深入探讨了人人网Android应用中独特的九宫格布局设计,解析其背后的GridView实现原理,并提供详细的代码示例。这种布局方式不仅美观大方,而且在现代Android应用中较为少见,值得开发者借鉴。 ... [详细]
  • 优化ListView性能
    本文深入探讨了如何通过多种技术手段优化ListView的性能,包括视图复用、ViewHolder模式、分批加载数据、图片优化及内存管理等。这些方法能够显著提升应用的响应速度和用户体验。 ... [详细]
  • 理解存储器的层次结构有助于程序员优化程序性能,通过合理安排数据在不同层级的存储位置,提升CPU的数据访问速度。本文详细探讨了静态随机访问存储器(SRAM)和动态随机访问存储器(DRAM)的工作原理及其应用场景,并介绍了存储器模块中的数据存取过程及局部性原理。 ... [详细]
  • Android LED 数字字体的应用与实现
    本文介绍了一种适用于 Android 应用的 LED 数字字体(digital font),并详细描述了其在 UI 设计中的应用场景及其实现方法。这种字体常用于视频、广告倒计时等场景,能够增强视觉效果。 ... [详细]
  • 本章将深入探讨移动 UI 设计的核心原则,帮助开发者构建简洁、高效且用户友好的界面。通过学习设计规则和用户体验优化技巧,您将能够创建出既美观又实用的移动应用。 ... [详细]
  • RecyclerView初步学习(一)
    RecyclerView初步学习(一)ReCyclerView提供了一种插件式的编程模式,除了提供ViewHolder缓存模式,还可以自定义动画,分割符,布局样式,相比于传统的ListVi ... [详细]
  • SQLite 动态创建多个表的需求在网络上有不少讨论,但很少有详细的解决方案。本文将介绍如何在 Qt 环境中使用 QString 类轻松实现 SQLite 表的动态创建,并提供详细的步骤和示例代码。 ... [详细]
  • 并发编程:深入理解设计原理与优化
    本文探讨了并发编程中的关键设计原则,特别是Java内存模型(JMM)的happens-before规则及其对多线程编程的影响。文章详细介绍了DCL双重检查锁定模式的问题及解决方案,并总结了不同处理器和内存模型之间的关系,旨在为程序员提供更深入的理解和最佳实践。 ... [详细]
  • 解决JAX-WS动态客户端工厂弃用问题并迁移到XFire
    在处理Java项目中的JAR包冲突时,我们遇到了JaxWsDynamicClientFactory被弃用的问题,并成功将其迁移到org.codehaus.xfire.client。本文详细介绍了这一过程及解决方案。 ... [详细]
  • 探讨如何真正掌握Java EE,包括所需技能、工具和实践经验。资深软件教学总监李刚分享了对毕业生简历中常见问题的看法,并提供了详尽的标准。 ... [详细]
  • 本文介绍如何使用布局文件在Android应用中排列多行TextView和Button,使其占据屏幕的特定比例,并提供示例代码以帮助理解和实现。 ... [详细]
  • TechStride 网站
    TechStride 成立于2014年初,致力于互联网前沿技术、产品创意及创业内容的聚合、搜索、学习与展示。我们旨在为互联网从业者提供更高效的新技术搜索、学习、分享和产品推广平台。 ... [详细]
  • 深入理解 Oracle 存储函数:计算员工年收入
    本文介绍如何使用 Oracle 存储函数查询特定员工的年收入。我们将详细解释存储函数的创建过程,并提供完整的代码示例。 ... [详细]
  • Python自动化处理:从Word文档提取内容并生成带水印的PDF
    本文介绍如何利用Python实现从特定网站下载Word文档,去除水印并添加自定义水印,最终将文档转换为PDF格式。该方法适用于批量处理和自动化需求。 ... [详细]
  • 本文介绍如何在 Unity 的 XML 配置文件中,将参数传递给自定义生命周期管理器的构造函数。我们将详细探讨 CustomLifetimeManager 类的实现及其配置方法。 ... [详细]
author-avatar
mobiledu2502886187
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有