自定义View饼状图的绘制
package com.loaderman.customviewdemo; import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View; import java.text.DecimalFormat;
import java.util.ArrayList;
import java.util.List; /**
* Created by MQ on 2016/12/15.
*/ public class CakeView extends View {
//装载的饼状圆数据
private List<CakeBean> beanList;
//画圆的矩形
private RectF mRectF;
//右边的小矩形
private RectF iRectF;
private Paint mPaint;
private int mRWidth, mRHeight;
private float rotateDegree;//每个圆弧的起始角度
private float sumValue = 0;//所有值的和
private float diameter;//圆的直径
private float textY;//绘制文字的Y坐标 private float mRectHeight = 40;//矩形高度
private float mRectWidth = 80;//矩形宽度
private float mMargin = 40;//矩形和圆的距离
private Context mContext; public CakeView(Context context) {
//CakeView cakeView=new CakeView(context);
// 在代码中new CakeView()会调用这个构造函数
this(context, null);
} public CakeView(Context context, AttributeSet attrs) {
//InflateLayoutManager时会调用这个构造函数
this(context, attrs, 0);
} public CakeView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
init();
} private void init() {
beanList = new ArrayList<>();
mRectF = new RectF();
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
} @Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//MeasureSpec封装了父View传递给子View的布局要求
int wMode = MeasureSpec.getMode(widthMeasureSpec);
int wSize = MeasureSpec.getSize(widthMeasureSpec);
int hMode = MeasureSpec.getMode(heightMeasureSpec);
int hSize = MeasureSpec.getSize(heightMeasureSpec);
switch (wMode) {
case MeasureSpec.EXACTLY:
//相当于match_parent或者一个具体值
mRWidth = wSize;
break;
case MeasureSpec.AT_MOST:
// 相当于wrap_content 默认会充满父View
// 可以根据子View的大小来计算父View大小,这里先写死大小
mRWidth = (int) DpUtil.dp2px(mContext, 400f);
break;
case MeasureSpec.UNSPECIFIED:
//很少会用到
break;
default:
break;
}
switch (hMode) {
case MeasureSpec.EXACTLY:
//相当于match_parent或者一个具体值
mRHeight = hSize;
break;
case MeasureSpec.AT_MOST:
// 相当于wrap_content 默认会充满父View
// 可以根据子View的大小来计算父View大小,这里先写死大小
mRHeight = (int) DpUtil.dp2px(mContext, 200f);
break;
case MeasureSpec.UNSPECIFIED:
//很少会用到
break;
default:
break;
}
//存储测量好的宽和高
setMeasuredDimension(wSize, hSize);
} @Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
diameter = Math.min(mRWidth, mRHeight);
} @Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
textY = 0f;
//设置圆形绘制的范围
mRectF.set(0, 0, diameter, diameter);
//画布中心X坐标向右移动(控件宽度-圆直径)之差的八分之一的距离
//画布中心Y坐标向下移动(控件宽度-圆直径)之差的二分之一的距离
canvas.translate((mRWidth - diameter) / 8, (mRHeight - diameter) / 2);
if (beanList.size() > 0 && Float.compare(sumValue, 0.0f) != 0) {
for (int i = 0; i < beanList.size(); i++) {
CakeBean bean = beanList.get(i);
//画圆弧
mPaint.setColor(bean.mColor);
canvas.drawArc(mRectF, rotateDegree, bean.degree, true, mPaint);
rotateDegree += bean.degree;
//画矩形和文字
drawRectAndText(canvas, bean);
}
}
} private void drawRectAndText(Canvas canvas, CakeBean bean) {
iRectF = new RectF();
//设置画矩形的范围
float left = diameter + mMargin;
float right = diameter + mMargin + mRectWidth;
float bottom = textY + mRectHeight;
iRectF.set(left, textY, right, bottom);
canvas.drawRect(iRectF, mPaint);
//设置颜色
mPaint.setColor(Color.BLACK);
//设置文字大小
mPaint.setTextSize(30);
//画文字
canvas.drawText(bean.name + "(" + new DecimalFormat(".00").format(bean.value / sumValue * 100) + "%)", right + 10, textY + 30, mPaint);
textY += mRectHeight;
} /**
* 饼状图添加数据
*
* @param beans CakeBean数据
*/
public void setData(List<CakeBean> beans) {
if (beans == null || beans.size() <= 0) return;
for (int i = 0; i < beans.size(); i++) {
CakeBean bean = beans.get(i);
sumValue += bean.value;
}
for (int i = 0; i < beans.size(); i++) {
CakeBean bean = beans.get(i);
bean.degree = bean.value / sumValue * 360;
beanList.add(bean);
}
invalidate();
} /**
* @param startDegree 设置起始角度
*/
public void setStartDegree(float startDegree) {
this.rotateDegree = startDegree;
invalidate();
}
}
package com.loaderman.customviewdemo;
import java.io.Serializable;
public class CakeBean implements Serializable {
public String name;//名字
public float value;//值
public float degree;//旋转过的角度
public int mColor;//圆弧颜色
}
package com.loaderman.customviewdemo; import android.app.Activity;
import android.content.Context;
import android.util.DisplayMetrics; /**
* Created by MQ on 2016/12/16.
*/ public class DpUtil {
/**
* dp转换成px
*
* @param context Context
* @param dp dp
* @return px值
*/
public static float dp2px(Context context, float dp) {
final float scale = context.getResources().getDisplayMetrics().density;
return dp * scale + 0.5f;
} /**
* sp转换成px
*
* @param context Context
* @param sp sp
* @return px值
*/
public static float sp2px(Context context, float sp) {
final float scale = context.getResources().getDisplayMetrics().scaledDensity;
return sp * scale;
} /**
* 获得屏幕宽度
*
* @param context Context
* @return 屏幕宽度(像素)
*/
public static int getScreenSizeWidth(Context context) {
DisplayMetrics metric = new DisplayMetrics();
((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(metric);
return metric.widthPixels;
}
}
package com.loaderman.customviewdemo; import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity; import java.util.ArrayList;
import java.util.List; public class MainActivity extends AppCompatActivity {
private List<CakeBean> beans;
private String[] names = {"php", "object-c", "c", "c++", "java", "android", "linux"};
private float[] values = {2f, 2f, 3f, 4f, 5f, 6f, 7f};
private int[] colArrs = {Color.RED, Color.parseColor("#4ebcd3"), Color.MAGENTA, Color.YELLOW, Color.GREEN, Color.parseColor("#f68b2b"), Color.parseColor("#6fb30d")};//圆弧颜色
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
CakeView cake_view = (CakeView) findViewById(R.id.cake_view);
initData();
cake_view.setData(beans); } private void initData() {
beans = new ArrayList<>();
for (int i = 0; i < 7; i++) {
CakeBean bean = new CakeBean();
bean.name = names[i];
bean.value = values[i];
bean.mColor = colArrs[i];
beans.add(bean);
}
} }
效果图:

自定义View饼状图的绘制的更多相关文章
- 基于SpringMVC框架使用ECharts3.0实现折线图,柱状图,饼状图,的绘制(上篇)
页面部分 <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE html> ...
- matplotlib学习日记(五)-各种饼状图的绘制
(一)分裂式饼状图 import matplotlib as mpl import matplotlib.pyplot as plt import numpy as np mpl.rcParams[& ...
- Android中饼状图的绘制
https://blog.csdn.net/cen_yuan/article/details/52204281
- Android 自定义饼状图
github 地址:https://github.com/dkest/PieView 简单分析 其实根据我们上面的知识已经能自己制作一个饼状图了.不过制作东西最重要的不是制作结果,而是制作思路. 相信 ...
- 【 D3.js 进阶系列 — 6.2 】 饼状图的拖拽
本文讲解稍微复杂一些的拖拽应用,即拖拽饼图的各部分. 在[入门 - 第 9.1 章]讲解了如何制作饼状图.饼状图的各部分是用具有宽度的弧线来表示的.在与用户进行交互的时候,如果每一部分都能拖拽,是很有 ...
- 第三方Charts绘制图表四种形式:饼状图,雷达图,柱状图,直线图
对于第三方框架Charts(Swift版本,在OC项目中需要添加桥接头文件),首先要解决在项目中集成的问题,集成步骤: 一.下载Charts框架 下载地址:https://github.com/dan ...
- DevExpress使用之ChartControl控件绘制图表(多坐标折线图、柱状图、饼状图)
最近因为公司项目需要用到WinForm的DecExpress控件,在这里把一些使用方法总结一下. DevExpress中有一个专门用来绘制图表的插件ChartControl,可以绘制折线图.饼状图.柱 ...
- iOS:使用贝塞尔曲线绘制图表(折线图、柱状图、饼状图)
1.介绍: UIBezierPath :画贝塞尔曲线的path类 UIBezierPath定义 : 贝赛尔曲线的每一个顶点都有两个控制点,用于控制在该顶点两侧的曲线的弧度. 曲线的定义有四个点:起始点 ...
- C#绘制立体三维饼状图
转载自原文 C#绘制立体三维饼状图(超酷) 内容原文地址:LINK [翻译]Julijan Sribar著3D Pie Chart一个用于绘制立体三维饼状图的C#类库[简介]本文的想法就是创建一个独立 ...
随机推荐
- IDEA等全家桶设置Ctrl+滚轮调整字体大小
File→Settings→General,勾选Change font size... 保存.
- linux下测试web访问及网络相关的命令
curl命令 curl是linux系统命令行下用来简单测试web访问的工具. curl -xip:port www.baidu.com -x可以指定ip和端口,省略写hosts,方便实用 -I ...
- Linux grep命令 -- 三剑客老三
常用选项 -E :开启扩展(Extend)的正则表达式. -i :忽略大小写(ignore case). -v :反过来(invert),只打印没有匹配的,而匹配的反而不打印. -n :显示行号 -w ...
- RaspberryPi交叉编译环境配置-Ubuntu & wiringPi & Qt
1.配置RaspberryPi交叉编译环境: 在开发RaspberryPi Zero的过程中,由于Zero板卡的CPU的处理性能比较弱,因此其编译的性能比较弱,需要将代码在PC电脑上交叉编译完成之后再 ...
- linux内核配置与编译
配置内核:配置硬件和软件需的部分. make config:基于文本模式的交互式配置.(一问一答) make menuconfig:基于文本模式菜单性配置.(直观简单高效) <*>会产生b ...
- Linux下Discuz!7.2 LAMP环境搭建
linux下Discuz LAMP环境搭建 1.需要的源代码 httpd-2.2.15.tar.gz mysql-5.1.44.tar.gz php-5.3.2.tar.gz ...
- linux学习:【第1篇】之安装vmware+Centos 6.9
vmware+CentOs 6.9的安装步骤 一.安装步骤 linux分区 登录用户名和密码 登录用户名和密码后安装成功 二.远程控制Xshell的安装
- vue2.0 移动端,下拉刷新,上拉加载更多 封装组件
前言 在做移动端的避免不了 下拉刷新,上拉加载 直接上代码吧,哈哈 组件里: <template lang="html"> <div class="yo ...
- Adboost几个要点分析
1.本质就是前向步进算法和加法模型,每一步计算分类器权重alpha和基分类器. 2.总体降低指数误差函数,转化为每一步降低分类误差率. 因为右边可以看作常数,所以相当于对这个进行优化 但是这一步可能做 ...
- C# 跨线程访问控件(MethodInvoker)
参考:https://www.cnblogs.com/lvdongjie/p/5428815.html .Net 通常禁止跨线程访问控件,设置Control.CheckForIllegalCrossT ...