Android 100行代码,搞定带动画的柱状图!

为何要用带动画的柱状图呢

最近,项目中遇到一个地方,要用到柱状图。所以这篇文章主要讲怎么搞一个柱子。100行代码,搞定柱状图!
这里写图片描述

圆角,头顶带数字。恩,这样用drawable也可以搞定。但是,这个柱子是有一个动画的,就是进入到界面的时候柱子不断的长高。这样的话,综合考虑还是用自定义View来做比较简便。效果如下图了:

这里写图片描述

完整Demo地址请到我的github下载地址:
https://github.com/lixiaodaoaaa/ColumnAnimViewProject

关于尺寸

控件尺寸直接来自xml中的设置,无需进行onMeasure测量。所以使用getWidth和getHeight获取高度。

关于数据范围

数据如果是一个柱子单独显示,则数据的范围不是很重要,但是柱状图通常是由很多柱子并列显示的,而这些柱子的单位高度都应该是一样的,所以提供设置最大值的范围,最小值就是0.

关于数字的文字大小

由于柱子的宽度就是整个View的宽度,所以数字的宽度不能超过柱子的宽度。因为这个原因,文字的size需要动态计算。意思就是 0和100000这两个数字显示的时候,文字的大小是不一样的。

关于边界值

0,是一个边界值(最小值),当显示0的时候,并不是柱子不显示的,而是显示一个最小高度的。

关于动画

不停的设置值,就会形成动画。意思是先设置数据1,然后紧接着设数据2.3.4.5……一直到最终的显示值,就会有动画效果。但是如果最终数值很大,1,1,1的增加就会很慢,动画时间很长。

完整代码如下

package com.lixiaodaoaaa.view.pieview;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;

import com.gcssloop.graphics.R;
import com.lixiaodaoaaa.uitls.DensityUtils;

/**************************************
 * *** http://weibo.com/lixiaodaoaaa **
 * *** create at 2017/5/18   23:45 ****
 * *******  by:lixiaodaoaaa  **********
 **************************************/

public class PColumn extends View {
   
    int MAX = 100;//最大
    int corner = 40;
    int data = 0;//显示的数
    
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值