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

Android自定义view实现圆环效果实例代码

本文通过实例代码给大家介绍了Android自定义view实现圆环效果,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

先上效果图,如果大家感觉不错,请参考实现代码。

         

重要的是如何实现自定义的view效果

(1)创建类,继承view,重写onDraw和onMesure方法

public class CirclePercentBar extends View{
  private Context mContext;
  private int mArcColor;
  private int mArcWidth;
  private int mCenterTextColor;
  private int mCenterTextSize;
  private int mCircleRadius;
  private Paint arcPaint;
  private Paint arcCirclePaint;
  private Paint centerTextPaint;
  private RectF arcRectF;
  private Rect textBoundRect;
  private float mCurData=0;
  private int arcStartColor;
  private int arcEndColor;
  private Paint startCirclePaint;
  public CirclePercentBar(Context context) {
    this(context, null);
  }
  public CirclePercentBar(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
  }
  public CirclePercentBar(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    mCOntext=context;
    TypedArray typedArray=context.obtainStyledAttributes(attrs,R.styleable.CirclePercentBar,defStyleAttr,0);
    mArcColor = typedArray.getColor(R.styleable.CirclePercentBar_arcColor,0xff0000);
    mArcWidth = typedArray.getDimensionPixelSize(R.styleable.CirclePercentBar_arcWidth, DisplayUtil.dp2px(context, 20));
    mCenterTextColor = typedArray.getColor(R.styleable.CirclePercentBar_centerTextColor, 0x0000ff);
    mCenterTextSize = typedArray.getDimensionPixelSize(R.styleable.CirclePercentBar_centerTextSize, DisplayUtil.dp2px(context, 20));
    mCircleRadius = typedArray.getDimensionPixelSize(R.styleable.CirclePercentBar_circleRadius, DisplayUtil.dp2px(context, 100));
    arcStartColor = typedArray.getColor(R.styleable.CirclePercentBar_arcStartColor,
        ContextCompat.getColor(mContext, R.color.green));
    arcEndColor = typedArray.getColor(R.styleable.CirclePercentBar_arcEndColor,
        ContextCompat.getColor(mContext, R.color.yellow));
    typedArray.recycle();
    initPaint();
  }
  private void initPaint() {
    startCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    startCirclePaint.setStyle(Paint.Style.FILL);
    //startCirclePaint.setStrokeWidth(mArcWidth);
    startCirclePaint.setColor(arcStartColor);
    arcCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    arcCirclePaint.setStyle(Paint.Style.STROKE);
    arcCirclePaint.setStrokeWidth(mArcWidth);
    arcCirclePaint.setColor(ContextCompat.getColor(mContext,R.color.colorAccent));
    arcCirclePaint.setStrokeCap(Paint.Cap.ROUND);
    arcPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    arcPaint.setStyle(Paint.Style.STROKE);
    arcPaint.setStrokeWidth(mArcWidth);
    arcPaint.setColor(mArcColor);
    arcPaint.setStrokeCap(Paint.Cap.ROUND);
    centerTextPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    centerTextPaint.setStyle(Paint.Style.STROKE);
    centerTextPaint.setColor(mCenterTextColor);
    centerTextPaint.setTextSize(mCenterTextSize);
    //圓弧的外接矩形
    arcRectF = new RectF();
    //文字的边界矩形
    textBoundRect = new Rect();
  }
  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    setMeasuredDimension(measureDimension(widthMeasureSpec),measureDimension(heightMeasureSpec));
  }
  private int measureDimension(int measureSpec) {
    int result;
    int specMode=MeasureSpec.getMode(measureSpec);
    int specSize=MeasureSpec.getSize(measureSpec);
    if(specMode==MeasureSpec.EXACTLY){
      result=specSize;
    }else{
      result=mCircleRadius*2;
      if(specMode==MeasureSpec.AT_MOST){
        result=Math.min(result,specSize);
      }
    }
    return result;
  }
  @Override
  protected void onDraw(Canvas canvas) {
    canvas.rotate(-90, getWidth()/ 2, getHeight()/ 2);
    arcRectF.set(getWidth()/2-mCircleRadius+mArcWidth/2,getHeight()/2-mCircleRadius+mArcWidth/2
        ,getWidth()/2+mCircleRadius-mArcWidth/2,getHeight()/2+mCircleRadius-mArcWidth/2);
    canvas.drawArc(arcRectF, 0,360,false,arcCirclePaint);
    arcPaint.setShader(new SweepGradient(getWidth()/2,getHeight()/2,arcStartColor,arcEndColor));
    canvas.drawArc(arcRectF, 0,360* mCurData /100,false,arcPaint);
    canvas.rotate(90, getWidth()/ 2, getHeight()/ 2);
    canvas.drawCircle(getWidth()/2,getHeight()/2-mCircleRadius+mArcWidth/2,mArcWidth/2,startCirclePaint);
    String data= String.valueOf(mCurData) +"%";
    centerTextPaint.getTextBounds(data,0,data.length(),textBoundRect);
    canvas.drawText(data,getWidth()/2-textBoundRect.width()/2,getHeight()/2+textBoundRect.height()/2,centerTextPaint);
  }
  public void setPercentData(float data, TimeInterpolator interpolator){
    ValueAnimator valueAnimator=ValueAnimator.ofFloat(mCurData,data);
    valueAnimator.setDuration((long) (Math.abs(mCurData-data)*30));
    valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
      @Override
      public void onAnimationUpdate(ValueAnimator valueAnimator) {
        float value= (float) valueAnimator.getAnimatedValue();
        mCurData=(float)(Math.round(value*10))/10;
        invalidate();
      }
    });
    valueAnimator.setInterpolator(interpolator);
    valueAnimator.start();
  }
}

(2)其中需要用到的类

public class DisplayUtil {
  public static int px2dp(Context context,float pxValue){
    final float scale=context.getResources().getDisplayMetrics().density;
    return (int)(pxValue/scale+0.5f);
  }
  public static int dp2px(Context context,float dpValue){
    final float scale=context.getResources().getDisplayMetrics().density;
    return (int)(dpValue*scale+0.5f);
  }
}

(3)attrs.xml

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

  
    
    
    
    
    
    
    
  

(4)在activity_main里面写布局

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

  
  

(6)编程实现效果:

public class MainActivity extends AppCompatActivity {
  CirclePercentBar circlePercentBar;
  Button startBtn;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    circlePercentBar= (CirclePercentBar) findViewById(R.id.circle_bar);
    circlePercentBar.setPercentData(55.2f,new DecelerateInterpolator());
    startBtn= (Button) findViewById(R.id.start_btn);
    startBtn.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        circlePercentBar.setPercentData((float) (100*Math.random()),new DecelerateInterpolator());
      }
    });
  }
}

总结

以上所述是小编给大家介绍的Android自定义view实现圆环效果实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!


推荐阅读
  • Android 九宫格布局详解及实现:人人网应用示例
    本文深入探讨了人人网Android应用中独特的九宫格布局设计,解析其背后的GridView实现原理,并提供详细的代码示例。这种布局方式不仅美观大方,而且在现代Android应用中较为少见,值得开发者借鉴。 ... [详细]
  • 优化ListView性能
    本文深入探讨了如何通过多种技术手段优化ListView的性能,包括视图复用、ViewHolder模式、分批加载数据、图片优化及内存管理等。这些方法能够显著提升应用的响应速度和用户体验。 ... [详细]
  • 国内BI工具迎战国际巨头Tableau,稳步崛起
    尽管商业智能(BI)工具在中国的普及程度尚不及国际市场,但近年来,随着本土企业的持续创新和市场推广,国内主流BI工具正逐渐崭露头角。面对国际品牌如Tableau的强大竞争,国内BI工具通过不断优化产品和技术,赢得了越来越多用户的认可。 ... [详细]
  • 本文详细介绍如何使用arm-eabi-gdb调试Android平台上的C/C++程序。通过具体步骤和实用技巧,帮助开发者更高效地进行调试工作。 ... [详细]
  • 深入理解 Oracle 存储函数:计算员工年收入
    本文介绍如何使用 Oracle 存储函数查询特定员工的年收入。我们将详细解释存储函数的创建过程,并提供完整的代码示例。 ... [详细]
  • 本文总结了2018年的关键成就,包括职业变动、购车、考取驾照等重要事件,并分享了读书、工作、家庭和朋友方面的感悟。同时,展望2019年,制定了健康、软实力提升和技术学习的具体目标。 ... [详细]
  • 在计算机技术的学习道路上,51CTO学院以其专业性和专注度给我留下了深刻印象。从2012年接触计算机到2014年开始系统学习网络技术和安全领域,51CTO学院始终是我信赖的学习平台。 ... [详细]
  • CSS 布局:液态三栏混合宽度布局
    本文介绍了如何使用 CSS 实现液态的三栏布局,其中各栏具有不同的宽度设置。通过调整容器和内容区域的属性,可以实现灵活且响应式的网页设计。 ... [详细]
  • 本文介绍了如何利用JavaScript或jQuery来判断网页中的文本框是否处于焦点状态,以及如何检测鼠标是否悬停在指定的HTML元素上。 ... [详细]
  • Linux 系统启动故障排除指南:MBR 和 GRUB 问题
    本文详细介绍了 Linux 系统启动过程中常见的 MBR 扇区和 GRUB 引导程序故障及其解决方案,涵盖从备份、模拟故障到恢复的具体步骤。 ... [详细]
  • 本文介绍了如何使用jQuery根据元素的类型(如复选框)和标签名(如段落)来获取DOM对象。这有助于更高效地操作网页中的特定元素。 ... [详细]
  • 本文将详细介绍如何使用剪映应用中的镜像功能,帮助用户轻松实现视频的镜像效果。通过简单的步骤,您可以快速掌握这一实用技巧。 ... [详细]
  • 深入理解Cookie与Session会话管理
    本文详细介绍了如何通过HTTP响应和请求处理浏览器的Cookie信息,以及如何创建、设置和管理Cookie。同时探讨了会话跟踪技术中的Session机制,解释其原理及应用场景。 ... [详细]
  • 本文介绍如何在 Xcode 中使用快捷键和菜单命令对多行代码进行缩进,包括右缩进和左缩进的具体操作方法。 ... [详细]
  • 本文介绍了一款用于自动化部署 Linux 服务的 Bash 脚本。该脚本不仅涵盖了基本的文件复制和目录创建,还处理了系统服务的配置和启动,确保在多种 Linux 发行版上都能顺利运行。 ... [详细]
author-avatar
那一世我给不了你的温柔
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有