android 自定义带动画的统计饼图

2024-06-03 12:38
文章标签 android 统计 自定义 带动

本文主要是介绍android 自定义带动画的统计饼图，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

达人科技 2016-10-16 15:17

闲来无事，发现市面上好多app都有饼图统计的功能，得空自己实现以下,菜鸟一只，求指教，轻喷！

基本要求：

  1. 在XML布局中可配置控件的属性。
  2. 遵守基本的安卓规范

View基本绘制原理：

首先计算View的大小，测量View的大小主要有三个：

public final void measure(int widthMeasureSpec, int heightMeasureSpec)  
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)  
protected final void setMeasuredDimension(int measuredWidth, int measuredHeight)

measure调用onMeasure，onMeasure取得宽高然后调用setMeasureDimension保存测量结果，nMeasure在view的子类中重写。

注意MeasureSpec这个帮助类：

(1) UPSPECIFIED:父容器对于子容器没有任何限制,子容器想要多大就多大.如wrap_content

(2) EXACTLY父容器已经为子容器设置了尺寸,子容器应当服从这些边界,不论子容器想要多大的空间.如match_parent或者具体的值50dp

(3) AT_MOST子容器可以是声明大小内的任意大小.

2.）View的位置
public void layout(int l, int t, int r, int b)
protected boolean setFrame(int left, int top, int right, int bottom)
protected void onLayout(boolean changed, int left, int top, int right, int bottom)

layout通过调用setFrame（l,t,r,b），子视图在父视图中的具体位置，onLayout一般只会在自定义ViewGroup中才会使用，表示子视图在父视图的排列规则以及位置

3.)绘制就是画成什么样子
public void draw(Canvas canvas)
protected void onDraw(Canvas canvas)

通过调用draw函数进行视图绘制，在View类中onDraw函数是个空函数，最终的绘制需求需要在自定义的onDraw函数中进行实现，比如ImageView完成图片的绘制，如果自定义ViewGroup这个函数则不需要重载。

具体事例如下：

package com.example.customview.view;import java.util.Timer;
import java.util.TimerTask;import com.example.customview.R;import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Point;
import android.graphics.RectF;
import android.support.v4.app.TaskStackBuilder;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;public class CirclePercentView extends View {private final static String TAG = CirclePercentView.class.getSimpleName;private Paint mPaint;private RectF oval;// 总数private int max;private int value;// 背景圆的颜色private int backColor;// 圆环的颜色private int frontColor;private float tempValue;// 画圆环的速度private int step;private float maxAngle;private Timer timer;// 字体大小private float textSize;// 字体颜色private int textColor;// 统计数值与统计描述的上下间距private float margin;// 园环宽度private float borderWidth;// 统计描述文本private String descripe;public CirclePercentView(Context context, AttributeSet attrs) {super(context, attrs);init(context, attrs);}public CirclePercentView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init(context, attrs);}private void init(Context context, AttributeSet attrs) {// 自定义属性TypedArray ta = context.obtainStyledAttributes(attrs,R.styleable.CirclePercentView);max = ta.getInt(R.styleable.CirclePercentView_maxValue, 0);value = ta.getInt(R.styleable.CirclePercentView_value, 0);backColor = ta.getColor(R.styleable.CirclePercentView_backgroudColor,Color.GRAY);frontColor = ta.getColor(R.styleable.CirclePercentView_frontColor, Color.BLUE);textColor = ta.getColor(R.styleable.CirclePercentView_textColor, Color.BLACK);textSize = ta.getDimension(R.styleable.CirclePercentView_textFont, 16);margin = ta.getDimension(R.styleable.CirclePercentView_textMargin, 16);borderWidth = ta.getDimension(R.styleable.CirclePercentView_borderWidth, 8);descripe = ta.getString(R.styleable.CirclePercentView_descripe);ta.recycle;// 计算角度maxAngle = value * 360f / max;mPaint = new Paint;mPaint.setAntiAlias(true);oval = new RectF;timer = new Timer;startAnim(100, 5000);}/*** * @param t1* 间隔时长* @param t2* 动画总时长*/private void startAnim(long t1, long t2) {step = (int) (maxAngle / t2 * t1);startAnim;}private void startAnim {timer.scheduleAtFixedRate(new TimerTask {@Overridepublic void run {Log.e("tempValuetempValuetempValue", tempValue + "maxAngle"+ maxAngle + "maxAngle" + maxAngle);if (tempValue + step >= maxAngle) {tempValue = maxAngle;timer.cancel;} else {tempValue += step;}// 注意此处postInvalidate与invalidate的区别postInvalidate;}}, 100, 100);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);int widthMode = MeasureSpec.getMode(widthMeasureSpec);int widthSize = MeasureSpec.getSize(widthMeasureSpec);int heightMode = MeasureSpec.getMode(heightMeasureSpec);int heightSize = MeasureSpec.getSize(heightMeasureSpec);Log.e(TAG, "onMeasure--widthMode-->" + widthMode);switch (widthMode) {case MeasureSpec.EXACTLY:Log.e(TAG, "EXACTLY-->EXACTLY" + widthSize);setMeasuredDimension(widthSize, heightSize);break;case MeasureSpec.AT_MOST:Log.e(TAG, "AT_MOST-->AT_MOST" + widthSize);break;case MeasureSpec.UNSPECIFIED:Log.e(TAG, "UNSPECIFIED-->UNSPECIFIED" + widthSize);break;}Log.e(TAG, "onMeasure--widthSize-->" + widthSize);Log.e(TAG, "onMeasure--heightMode-->" + heightMode);Log.e(TAG, "onMeasure--heightSize-->" + heightSize);}@Overrideprotected void onLayout(boolean changed, int left, int top, int right,int bottom) {super.onLayout(changed, left, top, right, bottom);Log.e(TAG, "onLayout");}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);mPaint.setColor(backColor);// FILL填充, STROKE描边,FILL_AND_STROKE填充和描边mPaint.setStyle(Paint.Style.FILL_AND_STROKE);int with = getWidth;int height = getHeight;// 取最小值作为圆的直径int size = Math.min(with, height);Log.e(TAG, "onDraw---->" + with + "*" + height);// 计算圆的半径float radius = (size - 2 * borderWidth) / 2;// 画背景圆canvas.drawCircle(size / 2, size / 2, radius, mPaint);// 画文本mPaint.setStrokeWidth(0);mPaint.setColor(textColor);mPaint.setTextSize(textSize);canvas.drawText(descripe, radius - mPaint.measureText(descripe) * 0.5f,size / 2 + textSize + margin, mPaint);float textHalfWidth = mPaint.measureText((int) (tempValue / 360 * 100 + 0.5f) + "%") * 0.5f;canvas.drawText((int) (tempValue / 360 * 100 + 0.5f) + "%", radius- textHalfWidth, size / 2, mPaint);// 画圆环mPaint.setStyle(Paint.Style.STROKE);mPaint.setColor(frontColor);mPaint.setStrokeWidth(borderWidth);// 放圆的矩形oval.set(size / 2 - radius, size / 2 - radius, size / 2 + radius, size/ 2 + radius);// 注意第三个参数canvas.drawArc(oval, 0, tempValue, false, mPaint); // 根据进度画圆弧}
}

View Code

attrs.xml如下：

具体使用如下：

<?xml version="1.0" encoding="utf-8"?>
<resources><declare-styleable name="CirclePercentView"><attr name="maxValue" format="integer" /><attr name="value" format="integer" /><attr name="backgroudColor" format="color|reference" /><attr name="frontColor" format="color|reference" /><attr name="textFont" format="dimension|reference" /><attr name="textColor" format="color|reference" /><attr name="textMargin" format="dimension|reference" /><attr name="borderWidth" format="dimension|reference" /><attr name="descripe" format="string|reference" /></declare-styleable></resources>

View Code

<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:orientation="vertical" ><com.example.customview.view.CirclePercentViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:layout_margin="10dp"app:backgroudColor="#cccccc"app:borderWidth="12dp"app:frontColor="#ff00ff"app:maxValue="360"app:textColor="#ececcc"app:textFont="24sp"app:textMargin="0dp"app:value="270" app:descripe="参与人数"/></LinearLayout>

View Code

也可以在代码中通过暴露方法对各个属性的值进行设置，这里就不举例了

运行结果，如下

android 自定义带动画的统计饼图

这篇关于android 自定义带动画的统计饼图的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/1027017。

相关文章

如何自定义一个log适配器starter

如何自定义一个log适配器starter

《如何自定义一个log适配器starter》：本文主要介绍如何自定义一个log适配器starter的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录需求Starter 项目目录结构pom.XML 配置LogInitializer实现MDCInterceptor
阅读更多...
Android学习总结之Java和kotlin区别超详细分析

Android学习总结之Java和kotlin区别超详细分析

《Android学习总结之Java和kotlin区别超详细分析》Java和Kotlin都是用于Android开发的编程语言,它们各自具有独特的特点和优势,：本文主要介绍Android学习总结之Ja... 目录一、空安全机制真题 1：Kotlin 如何解决 Java 的 NullPointerExceptio
阅读更多...
详解如何使用Python从零开始构建文本统计模型

详解如何使用Python从零开始构建文本统计模型

《详解如何使用Python从零开始构建文本统计模型》在自然语言处理领域,词汇表构建是文本预处理的关键环节,本文通过Python代码实践,演示如何从原始文本中提取多尺度特征,并通过动态调整机制构建更精确... 目录一、项目背景与核心思想二、核心代码解析1. 数据加载与预处理2. 多尺度字符统计3. 统计结果可
阅读更多...
Druid连接池实现自定义数据库密码加解密功能

Druid连接池实现自定义数据库密码加解密功能

《Druid连接池实现自定义数据库密码加解密功能》在现代应用开发中,数据安全是至关重要的,本文将介绍如何在​​Druid​​连接池中实现自定义的数据库密码加解密功能,有需要的小伙伴可以参考一下... 目录1. 环境准备2. 密码加密算法的选择3. 自定义 ​​DruidDataSource​​ 的密码解密3
阅读更多...
spring-gateway filters添加自定义过滤器实现流程分析(可插拔)

spring-gateway filters添加自定义过滤器实现流程分析(可插拔)

《spring-gatewayfilters添加自定义过滤器实现流程分析(可插拔)》：本文主要介绍spring-gatewayfilters添加自定义过滤器实现流程分析(可插拔),本文通过实例图... 目录需求背景需求拆解设计流程及作用域逻辑处理代码逻辑需求背景公司要求，通过公司网络代理访问的请求需要做请
阅读更多...
Android NDK版本迭代与FFmpeg交叉编译完全指南

Android NDK版本迭代与FFmpeg交叉编译完全指南

《AndroidNDK版本迭代与FFmpeg交叉编译完全指南》在Android开发中,使用NDK进行原生代码开发是一项常见需求,特别是当我们需要集成FFmpeg这样的多媒体处理库时,本文将深入分析A... 目录一、android NDK版本迭代分界线二、FFmpeg交叉编译关键注意事项三、完整编译脚本示例四
阅读更多...
Android与iOS设备MAC地址生成原理及Java实现详解

Android与iOS设备MAC地址生成原理及Java实现详解

《Android与iOS设备MAC地址生成原理及Java实现详解》在无线网络通信中,MAC（MediaAccessControl）地址是设备的唯一网络标识符,本文主要介绍了Android与iOS设备M... 目录引言1. MAC地址基础1.1 MAC地址的组成1.2 MAC地址的分类2. android与I
阅读更多...
Android 实现一个隐私弹窗功能

Android 实现一个隐私弹窗功能

《Android实现一个隐私弹窗功能》：本文主要介绍Android实现一个隐私弹窗功能,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧... 效果图如下：1. 设置同意、退出、点击用户协议、点击隐私协议的函数参数2. 《用户协议》、《隐私政策》设置成可点击的，且颜色要区分出来res/l
阅读更多...
Android实现一键录屏功能(附源码)

Android实现一键录屏功能(附源码)

《Android实现一键录屏功能(附源码)》在Android5.0及以上版本,系统提供了MediaProjectionAPI,允许应用在用户授权下录制屏幕内容并输出到视频文件,所以本文将基于此实现一个... 目录一、项目介绍二、相关技术与原理三、系统权限与用户授权四、项目架构与流程五、环境配置与依赖六、完整
阅读更多...
Android 12解决push framework.jar无法开机的方法小结

Android 12解决push framework.jar无法开机的方法小结

《Android12解决pushframework.jar无法开机的方法小结》：本文主要介绍在Android12中解决pushframework.jar无法开机的方法,包括编译指令、框架层和s... 目录1. android 编译指令1.1 framework层的编译指令1.2 替换framework.ja
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2