您的位置:首页 > 产品设计 > UI/UE

LWUIT + ChartComponent 之一实现饼图(PieChart)

2008-12-15 14:21 501 查看
本文来自http://blog.csdn.net/hellogv/



本文源代码下载地址:http://download.csdn.net/source/872671
本文所用的Chart组件为J2me ChartComponent - ver 1.5.2,该组件的下载页面为http://www.beanizer.org/site/index.php/en/Software/J2me-ChartComponent-ver-1.5.html。按照官网所说,ChartComponent的二进制开发包可以用于个人开发以及商业项目,而源代码则需要购买,为了支持作者开发,最好是购买一份啦。
ChartComponent,基于J2ME的LCDUI,而本文要演示的是,如何把ChartComponent运用到LWUIT之上,其他LCDUI的控件也可以参照这个方法,从而运作在LWUIT上。
在LWUIT上实现Chart功能,可以利用LWUIT固有的组件,混合使用,效果挺好的,例如加入chart的每个图块说明(说明与图块颜色对应)时,可以用FlowLayout排列方式+Label控件,能够自适应,比用UI直接画省好多功夫。
首先,先在主文件UIDemoMIDlet加入以下代码:
/**
* lcdui的图像转换为lwuit的图像
*/
static Image lcdui2lwuit(javax.microedition.lcdui.Image lcdui_img)
{
//新建RGB数组
int[] bufferArray = new int[lcdui_img.getWidth() * lcdui_img.getHeight()];
//把lcdui的Image保存为RGB数组
lcdui_img.getRGB(bufferArray, 0, lcdui_img.getWidth(), 0, 0, lcdui_img.getWidth(), lcdui_img.getHeight());
//********透明背景,可以省略*******************************************//
for(int i=0;i<bufferArray.length;i++){
if((bufferArray[i] & 0x00FFFFFF) == 0x00FFFFFF)//如果是背景
bufferArray[i]=bufferArray[i]&0x00FFFFFF;
}
//********透明背景,可以省略*******************************************//
//新建lwuit的Image,并读取RGB数组
Image result = Image.createImage(bufferArray, lcdui_img.getWidth(), lcdui_img.getHeight());
return result;
}
/**
* RGB颜色转换为int
*/
static int RGBtoInt(int r,int g,int b)
{
String result=Integer.toHexString(r)+Integer.toHexString(g)+Integer.toHexString(b);
return Integer.parseInt(result,16);
}
其次,编写PieChartDemo的代码,代码有详细的注释,非常好理解:
/*
* LWUIT + ChartComponent,实现多种图表
* 作者:张国威(咪当俺系噜噜)
* 本例实现的是“饼图”
*/
package com.sun.lwuit.uidemo;

import com.sun.lwuit.Button;
import com.sun.lwuit.Command;
import com.sun.lwuit.Font;
import com.sun.lwuit.Form;
import com.sun.lwuit.Image;
import com.sun.lwuit.Label;
import com.sun.lwuit.events.ActionEvent;
import com.sun.lwuit.events.ActionListener;
import com.sun.lwuit.layouts.FlowLayout;
import org.beanizer.j2me.charts.ChartItem;
import org.beanizer.j2me.charts.PieChart;

public class PieChartDemo implements ActionListener {
public Form form = new Form("VBarChartDemo");
private Command backCommand = new Command("Back", 1);
final PieChart pieChart= new PieChart("");
PieChartDemo()
{
//饼图说明
String chart_str[]={"█ A:你好吗","█ B:早上好","█ C:中午好","█ D:晚上好","█ E:吃宵夜","█ F:睡懒觉"};
//饼图颜色
int [][]color={{0,0,200},{0,200,0},{50,15,30},{100,0,200},{0,200,100},{200,100,200}};
//饼图范围
int []percent={15,10,5,20,34,16};

//绘制柱体的说明
initChartInfo(chart_str,color);

int width=form.getWidth();
int height=form.getHeight()-60;
Image img_hbarChart=drawPieChart(pieChart,width,height,"",color,percent);//绘制柱体图

Button button = new Button(img_hbarChart);
button.getStyle().setBgTransparency(1);//透明背景,会非常消耗资源,速度减慢,注意使用
button.setBorderPainted(false);
form.addComponent(button);
form.addCommand(backCommand);
form.setCommandListener(this);
form.setLayout(new FlowLayout());//必须使用这种排列,FlowLayout最适合
}
private void initChartInfo(String []chart_str,int [][]color)
{
for(int i=0;i<chart_str.length;i++)//循环
{
Label chart_info = new Label(chart_str[i]);
chart_info.getStyle().setFgColor(UIDemoMIDlet.RGBtoInt(color[i][0],color[i][1],color[i][2]));
form.addComponent(chart_info);
}
}
private Image drawPieChart(ChartItem item,
int width,
int height,
String imagefile,
int [][]color,//柱体颜色
int []percent)//柱体长度(百分比)
{

item.setFont(Font.FACE_PROPORTIONAL,Font.STYLE_PLAIN,Font.SIZE_SMALL);
item.setDrawAxis(true);
item.setPreferredSize(width-80,width-80);//设置chart控件的大小,饼图必须width=height

if(imagefile.length()>0)//需要使用背景时
{
try{
javax.microedition.lcdui.Image img=javax.microedition.lcdui.Image.createImage(imagefile);//读取背景图
item.setBackgroundImage(img);//设置背景图
} catch(Exception ex){ex.printStackTrace();}
}
item.showShadow(true);//使用阴影特效
item.setShadowColor(20,20,20);//设置阴影颜色
item.setColor(40, 40, 200);
item.resetData();
for(int i=0;i<color.length;i++)//循环绘画柱体
{
item.addElement(String.valueOf((char)('a'+i)),percent[i],color[i][0],color[i][1],color[i][2]);
}

item.setMaxValue(100);//柱体代表数值的显示范围,100%

//这个是lcdui的Image
javax.microedition.lcdui.Image lcdui_img=
javax.microedition.lcdui.Image.createImage(width,height);//饼图大小,图像>控件
//这个是lcdui的Graphics
javax.microedition.lcdui.Graphics lcdui_g= lcdui_img.getGraphics();

pieChart.drawPie(lcdui_g,
40,//x
40,//y
width-100,//宽
width-100);//长,这里设置的大小必须比width,height小,才能完全显示

return UIDemoMIDlet.lcdui2lwuit(lcdui_img);
}
public void actionPerformed(ActionEvent arg0) {
if(arg0.getCommand()==backCommand)
{
UIDemoMIDlet.backToMainMenu();
}
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: