文档章节

Android 柱状图的绘制

今日竹石
 今日竹石
发布于 2014/04/23 19:55
字数 702
阅读 3622
收藏 1

    这是今天刚写的柱状图,效果很简单,代码贴出来。

package com.example.testchart;


import android.annotation.SuppressLint;

import android.content.Context;

import android.graphics.Canvas;

import android.graphics.Paint;

import android.os.Handler;

import android.os.Message;

import android.view.View;


@SuppressLint("HandlerLeak")

public class ChartText extends View

{


private Paint paint;

private Paint font_Paint;

// 数值显示的偏移量

private int numWidth = 9;


// 起始高度为 最大高度减去 80 【注意这里的高度是反的,也就是说,y轴是逐渐减少的】

private float startHeight = 10;

private float endHeight = startHeight;

// 柱状图的宽度

private int viewWidth = 20;


// 组态图的高度 【显示的数值,100 为 100%】

private int maxSize = 43;

private int indexSize = 0;

// 要显示的模式 【类型,比如:℃和百分比等】

private String displayMode = "%";

// 模式

private boolean mode = false;

// 线程控制

private boolean display = true;

// 是否开启动画效果

private boolean animMode = true;


/**

* @param context

* @param maxSize

*            需要显示的数值

* @param displayMode

*            显示的类型

*/

public ChartText(Context context, int maxSize, String displayMode)

{

super(context);

this.maxSize = maxSize;

this.displayMode = displayMode;

init();

}


/**

* @param context

* @param maxSize

*            需要显示的数值

* @param displayMode

*            显示的类型

* @param mode

*            显示的模式,默认为false,数值越高,颜色越偏向红色。为true反之

*/

public ChartText(Context context, int maxSize, String displayMode,

boolean mode)

{

super(context);

this.maxSize = maxSize;

this.displayMode = displayMode;

this.mode = mode;

init();

}


/**

* @param context

* @param maxSize

*            需要显示的数值

* @param displayMode

*            显示的类型

* @param mode

*            显示的模式,默认为false,数值越高,颜色越偏向红色。为true反之

* @param animMode

*            是否显示动画加载效果,默认为true

*/

public ChartText(Context context, int maxSize, String displayMode,

boolean mode, boolean animMode)

{

super(context);

this.maxSize = maxSize;

this.displayMode = displayMode;

this.mode = mode;

this.animMode = animMode;

init();

}


// 绘制界面

@Override

protected void onDraw(Canvas canvas)

{

super.onDraw(canvas);

canvas.drawRect(10, endHeight, 10 + viewWidth, startHeight, paint);

if (!display)

{

// 这段if语句可以放在初始化中,这个就交给大家吧。

if (!mode && indexSize >= 50)

{

paint.setARGB(255, 200, 200, 60);

if (!mode && indexSize >= 80)

{

paint.setARGB(255,

(indexSize < 100) ? (110 + indexSize + 45) : 255,

(indexSize < 100) ? 210 - (indexSize + 45) : 0, 20);

}

} else if (mode && indexSize <= 50)

{

paint.setARGB(255, 200, 200, 60);

if (mode && indexSize <= 30)

{

paint.setARGB(255, 255 - indexSize, indexSize, 20);

}

}

canvas.drawRect(10, endHeight, 10 + viewWidth, startHeight, paint);

paint.setARGB(255, 99, 66, 0);

canvas.drawText("" + indexSize, numWidth, endHeight - 5, paint);

paint.setARGB(255, 110, 210, 60);

}

canvas.drawText(displayMode, 0, startHeight + 15, font_Paint);

}


// 初始化

private void init()

{

// 数值初始化

paint = new Paint();

paint.setARGB(255, 110, 210, 20);

font_Paint = new Paint();

font_Paint.setARGB(255, 66, 66, 66);


// 设置顶端数值显示的偏移量,数值越小,偏移量越大

numWidth = 9;

if (maxSize < 10)

{

numWidth = 15;

} else if (maxSize < 100)

{

numWidth = 12;

}


if (animMode)

{

// 启动一个线程来实现柱状图缓慢增高

thread.start();

} else

{

// 不启用动画效果,则直接赋值进行绘制

display = false;

indexSize = maxSize;

endHeight = startHeight - (float) (maxSize * 1.5);

invalidate();

}

}


private Handler handler = new Handler()

{

@Override

public void handleMessage(Message msg)

{

super.handleMessage(msg);

// 通过endHeight >= 20将柱状图的高度控制在150以内,这样刚好循环一百次到顶部

if (msg.what == 1 && indexSize < maxSize && endHeight >= 20)

{

endHeight -= 1.5;

indexSize += 1;

} else

{

display = false;

}

invalidate();

}

};


private Thread thread = new Thread()

{

@Override

public void run()

{

while (!Thread.currentThread().isInterrupted() && display)

{

Message msg = new Message();

msg.what = 1;

handler.sendMessage(msg);

try

{

// 每隔15毫秒触发,尽量使升高的效果看起来平滑

Thread.sleep(15);

} catch (InterruptedException e)

{

System.err.println("InterruptedException!线程关闭");

this.interrupt();

}

}

}

};


}


© 著作权归作者所有

共有 人打赏支持
今日竹石
粉丝 41
博文 227
码字总数 181312
作品 0
朝阳
程序员
私信 提问
Achartengine绘图如何设置从X轴坐标的第一个坐标点开始显示

比如:用achartengine绘制柱状图,当数据集过多需要滑动才能看到更多数据时,默认显示的是数据集的最后的几组数据。下图是点击进入显示柱状图的Activity默认的界面,X轴坐标12月是最后一组数...

易逝的美好
2015/01/13
1K
2
Android绘制优化(一)绘制性能分析

前言 一个优秀的应用不仅仅是要有吸引人的功能和交互,同时在性能上也有很高的要求。运行Android系统的手机,虽然配置在不断的提升,但仍旧无法和PC相比,无法做到PC那样拥有超大的内存以及高...

ganchuanpu
2018/07/16
0
0
android horizontalScrollView 嵌套view的显示问题

我想弄一个柱状图 然后在可以左右拖动 一下是我的main.xml 在mainActivity中的代码如下 public class Main extends Activity { private LinearLayout layout_chart ; private HorizontalScr...

huangwb
2012/07/09
7.4K
2
Android 界面性能调优渲染+To检测+OverDraw+Rendering

界面是 Android 应用中直接影响用户体验最关键的部分。如果代码实现得不好,界面容易发生卡顿且导致应用占用大量内存。做 ROM 的公司更不一样,预装的应用一定要非常流畅,这样给客户或用户的...

程序猿拿Q
2018/11/15
0
0
Android - 绘制带有渐变色的折线图

图表绘制的需求在安卓开发中并不少见。常见的有饼图,柱状图,折线图等等。 在这里,我们可以给折线图添加一些色彩。除了线条本身的颜色外,还可以增加一些“花样”——渐变色。填充空余的地...

RustFisher
2018/06/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Oracle学习日志-7(聚合查询)

GROUP BY子句: GROUP BY可以对表进行分割。比如把下面的表按照商品种类进行分割,并列出该商品种类下有多少商品 SQL代码如下 SELECT product_type ,COUNT(*)FROM ProductGROUP BY produc...

白话
9分钟前
0
0
Docker安装mysql8主从结构

准备两台服务器,假设IP地址为 172.31.27.67 主服务器 172.31.27.69 从服务器 因为我用的镜像是docker.io/cytopia/mysql-8.0,所以我们需要先把该镜像给pull下来。 docker pull docker.io/cy...

算法之名
12分钟前
3
0
Springboot集成Ehcache缓存(主要用在登录后做保持会话验证)

EhCache是一个比较成熟的Java缓存框架,最早从hibernate发展而来, 是进程中的缓存系统,它提供了用内存,磁盘文件存储,以及分布式存储方式等多种灵活的cache管理方案,快速简单。 Springbo...

Nonry
14分钟前
0
0
Ajax

1、创建ajax对象 if(window.navigator.userAgent.indexOf('MSIE') > 0){ var xhr = new ActiveXObject('Microsoft.XMLHTTP');}else{ var xhr = new XMLHttpRequest();} 2、get......

lujc
14分钟前
0
0
Flink的基石 : Chandy Lamport Algorithm

Flink处理“流”,对流消息的处理支持三种级别语义分别是“At Most once、At Least once、Exactly once”。 At Most onces:消息最多被处理一次,sender发出消息之后,receiver无论是否处理成...

tantexian
19分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部