前面都说平常 canvas paint 一些例子都是静态的,下面这个例子关于 动态折线图的
其实精髓也就是= = ,画了 再 clear 重画, 用到了线程,去不停的绘制,看起来貌似是动的
代码
/**
* 动态折线图
* @author Administrator
*/
public class MainActivity extends Activity {
// 折线
private XYSeries series;
private XYMultipleSeriesDataset mDataset; //
private GraphicalView chart;
private XYMultipleSeriesRenderer renderer;
private Context context;
private int addX = -1, addY;
//只记录当前界面显示的图的点
int[] xx = new int[50];
int[] yy = new int[50];
private Thread th = new Thread(){
public void run() {
try {
while(true){
Thread.sleep(1000);
handler.sendMessage(new Message());
}
} catch (Exception e) {
}
};
};
//这里的Handler实例将配合下面的Timer实例,完成定时更新图表的功能
private Handler handler = new Handler() {
@Override
public void handleMessage(Message msg) {
//刷新图表
updateUI();
}
};
@Override
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
LinearLayout layout = (LinearLayout)findViewById(R.id.linearmian);
layout.setBackgroundResource(R.drawable.online_bj);
series = new XYSeries("动态折线测试");
//创建一个数据集的实例,这个数据集将被用来创建图表
mDataset = new XYMultipleSeriesDataset();
//将点集添加到这个数据集中
mDataset.addSeries(series);
//renderer - 渲染器
renderer = buildRenderer(Color.BLUE, PointStyle.CIRCLE );
//设置图标样式
setChartSettings(renderer, "X", "Y", 0, 100, 0, 90, Color.WHITE, Color.WHITE);
//生成图表
chart = ChartFactory.getLineChartView(MainActivity.this, mDataset, renderer);
//将图表添加到布局中去
layout.addView(chart, new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
th.start();
}
/**
* 其实就是1个界面的 重绘
*/
private void updateUI() {
addX = 0;
addY = (int)(Math.random() * 90);
//移除数据集中旧的点集
mDataset.removeSeries(series);
//判断当前点集中到底有多少点
int length = series.getItemCount();
if(length > 50){
length = 50;
}
// X Y轴
for (int i = 0; i < length; i++) {
// X坐标每次的增量 + 5
xx[i] = (int) series.getX(i) + 5;
yy[i] = (int) series.getY(i);
}
series.clear();
//新出来的点肯定首先画,加到第一个
series.add(addX, addY);
//原来的点按照顺序加入
for (int k = 0; k < length; k++) {
series.add(xx[k], yy[k]);
}
mDataset.addSeries(series);
//视图更新,如果在非UI主线程中,需要调用postInvalidate()
chart.invalidate();
}
/**
* 下面这里的直接从 AbstractDemoChart 中拷出来就好了。
* @param colors
* @param styles
* @return
*/
//设置渲染器
protected XYMultipleSeriesRenderer buildRenderer(int color, PointStyle style){
XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
//设置图表中折线的样式
XYSeriesRenderer r = new XYSeriesRenderer();
r.setColor(color); //线条颜色
r.setPointStyle(style); //点样式
r.setLineWidth(3); //线宽
renderer.addSeriesRenderer(r); //添加
return renderer;
}
// 设置图表的显示
protected void setChartSettings(XYMultipleSeriesRenderer renderer, String xTitle, String yTitle,
double xMin, double xMax, double yMin, double yMax, int axesColor, int labelsColor) {
renderer.setChartTitle("");
renderer.setXTitle(xTitle);
renderer.setYTitle(yTitle);
renderer.setXAxisMin(xMin);
renderer.setXAxisMax(xMax);
renderer.setYAxisMin(yMin);
renderer.setYAxisMax(yMax);
renderer.setAxesColor(axesColor);
renderer.setLabelsColor(labelsColor);
renderer.setShowGrid(true); //是否显示网格
renderer.setGridColor(Color.RED); //网格的颜色
renderer.setXLabels(20);
renderer.setYLabels(10);
renderer.setXTitle(""); //设置title
renderer.setYTitle("");
renderer.setYLabelsAlign(Align.RIGHT); //Y周文字对齐方式
renderer.setPointSize((float)2);
// renderer.setShowLegend(false);
// renderer.setLabelsTextSize(15);
// renderer.setLegendTextSize(15);
renderer.setBackgroundColor(Color.parseColor("#00000000"));
renderer.setMarginsColor(Color.argb(0, 0xF3, 0xF3, 0xF3)); //图表与周围四周的颜色
renderer.setMargins(new int[] { 20, 30, 15, 20 }); //设置图表的边距
}
@Override
public void onDestroy() {
th.interrupt();
super.onDestroy();
}
}
好了,用到了 开源的achartengine来进行绘制, 至于 achartengine,是个很简单的东西,直接google里面有相应的很全的例子。前面我也有说过= =