在平时开发中柱状形状偶尔会有项目需求，由于又一次开发需要，去找开源的组件都不好用，要不调用很不方便，要不它们类库太笨重，下面介绍一个轻巧方便控件，原理就是用View 重新绘画一个柱状图形控件，并适配所有屏幕。
该项目地址位于：https://github.com/apple317/displayview。
demo实现后效果图如上
1. 导入DisplayView（简称SDK）
下载最新版sdk的zip包，解压将其中的download释放到本地目录，Eclipse用户右键您的工程根目录，选择Properties -> Java Build Path -> Libraries， 然后点击 Add External JARs... 选择指向download 的路径，点击OK，即导入成功。
下载最新版SDK的zip包，将其中的libs 文件夹合并到本地工程libs子目录下
Eclipse用户右键工程根目录，选择Properties -> Java Build Path -> Libraries，然后点击Add External JARs... 选择指向jar的路径，点击OK，即导入成功。
注意。
2.代码接入详解使用说明：
在下载代码后，里面有参考代码，代码都有注释和调用详解，先讲解ChartActivity调用类如何编写。
public class ChartActivity extends Activity {
private LinearLayout layout_chart;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
// 先编写一个布局文件
this.setContentView(R.layout.layout_chart);
//创建一个线性容器，之后就是向着里面嵌套视图
layout_chart = (LinearLayout) this.findViewById(R.id.lay_chart);
LinearLayout.LayoutParams layParam = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
layParam.gravity = Gravity.CENTER_HORIZONTAL;
//创建柱状性参数对象
ChartEntity entity = new ChartEntity();
entity.scale = 6;
entity.row_height = 60;
entity.row_weight = 4;
entity.padding_weight = 8;
//创建一个纵向数据容器
List<String> hList = new ArrayList<String>();
//创建一个横向数据容器，注解数据格式如:key,是否显示在横坐标
List<String> wList = new ArrayList<String>();
//创建一个存储高度值容器
HashMap<String, Integer> map = new HashMap<String, Integer>();
hList.add("0公里");
hList.add("10-");
hList.add("20-");
hList.add("30-");
entity.hList = hList;
for (int i = 0; i < 30; i++) {
String curStr;
if ((i + 1) % 5 == 0) {
curStr = (i + 1) + ",true";
} else {
curStr = (i + 1) + ",false";
}
wList.add(curStr);
map.put(curStr, i * 4);
}
entity.wList = wList;
entity.map = map;
ChartView chartView = new ChartView(this.getApplicationContext(),
entity);
layout_chart.addView(chartView, layParam);
}
@Override
protected void onDestroy() {
// TODO Auto-generated method stub
super.onDestroy();
}
@Override
protected void onPause() {
// TODO Auto-generated method stub
super.onPause();
}
@Override
protected void onResume() {
// TODO Auto-generated method stub
super.onResume();
}
@Override
protected void onStart() {
// TODO Auto-generated method stub
super.onStart();
}
}
3.ChartEntity实体类核心代码详解：
ChartEntity是柱状图参数实体类，每个都有详解，供外部调用和修改。
/**
* 柱状图形实体类
*
* @author 胡少平
*
*/
public class ChartEntity {
// 每个柱形纵向数据显示集：String = 显示内容
public List<String> hList;
// 每个柱形横向数据显示集：String = 显示内容,true|false
public List<String> wList;
//横向显示值
public HashMap<String,Integer> map;
//柱形比例度
public int scale;
// 每个柱形横向柱状显示宽度
public int row_weight = 0;
// 每个柱形横向柱状间距
public int padding_weight = 0;
//横向起始点x坐标
public int startX = 30;
//每个柱形纵向显示宽度
public int row_height=0;
//每个柱形纵向
public int padding_height=12;
public ChartEntity() {
// TODO Auto-generated constructor stub
}
}
4.ChartViewUI组件核心代码详解如下：
/**
*
* 柱状形显示UI组件
*
* @author 胡少平
*
*/
public class ChartView extends View {
private ChartEntity entity;
private Paint paint;
// 每个柱形宽度
private int zWith = 0;
private int zPadding = 0;
private int startX = 0;
private int totalHeight = 0;
private int lineHeight = 0;
private int zHeight = 0;
// 横向x坐标显示个数
private int wSize = 0;
// 纵向y坐标显示个数
private int hSize = 0;
public ChartView(Context context, ChartEntity entity) {
super(context);
paint = new Paint();
paint.setAntiAlias(true);
this.entity = entity;
zWith = DeviceInfo.DipToPixels(this.getContext(), entity.row_weight);
zPadding = DeviceInfo.DipToPixels(this.getContext(),
entity.padding_weight);
startX = DeviceInfo.DipToPixels(this.getContext(), entity.startX);
zHeight = DeviceInfo.DipToPixels(this.getContext(), entity.row_height);
totalHeight = DeviceInfo
.DipToPixels(this.getContext(), entity.row_height
* entity.hList.size() + entity.padding_height);
lineHeight = DeviceInfo.DipToPixels(this.getContext(),
entity.row_height * entity.hList.size());
wSize = entity != null && entity.wList != null
&& entity.wList.size() > 0 ? entity.wList.size() : 0;
hSize = entity != null && entity.hList != null
&& entity.hList.size() > 0 ? entity.hList.size() : 0;
}
public void drawAxis(Canvas canvas) {
//设置画笔属性
paint.setColor(Color.RED);
paint.setStrokeWidth(2);
paint.setTextSize(DeviceInfo.DipToPixels(this.getContext(), 12));
//用游标绘画线条
canvas.drawLine(startX, lineHeight, wSize * zWith + wSize * zPadding
+ startX, lineHeight, paint);
canvas.drawLine(startX, 0, startX, lineHeight, paint);
int x = 0;
int y = 0;
for (int i = 0; i < wSize; i++) {
x = startX + i * zPadding + (i) * zWith;
if (entity != null && entity.wList != null) {
String wVal = entity.wList.get(i);
String[] wArray = wVal.split(",");
if (wArray[1].equals("true")) {
canvas.drawText(wArray[0], x, totalHeight, paint);
}
}
}
for (int i = 0; i < hSize; i++) {
y = lineHeight - i * zHeight;
if (entity != null && entity.hList != null) {
String wVal = entity.hList.get(i);
String[] wArray = wVal.split(",");
if (i == 0) {
canvas.drawText(wArray[0],
DeviceInfo.DipToPixels(this.getContext(), 5), y,
paint);
} else {
//用游标绘画文本
canvas.drawText(
wArray[0],
startX
- DeviceInfo.DipToPixels(this.getContext(),
15), y, paint);
}
}
}
}
public void drawChart(Canvas canvas) {
paint.setColor(Color.RED);
if (entity != null && entity.wList.size() > 0) {
for (int i = 0; i < wSize; i++) {
int total = (int) (entity.map.get(entity.wList.get(i)) == null ? 0
: entity.map.get(entity.wList.get(i)) * entity.scale);
//用游标画一个方块
canvas.drawRect((i + 1) * zPadding + (i) * zWith + startX,
lineHeight - total, i * zPadding + i * zWith + startX,
lineHeight, paint);
}
}
}
@Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
final int widthMode = MeasureSpec.getMode(widthMeasureSpec);
final int widthSize = MeasureSpec.getSize(widthMeasureSpec);
final int heightMode = MeasureSpec.getMode(heightMeasureSpec);
final int heightSize = MeasureSpec.getSize(totalHeight);
setMeasuredDimension(widthSize, heightSize);
}
@Override
public void onDraw(Canvas canvas) {
drawAxis(canvas);
drawChart(canvas);
}
}
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
