以前写了个天气的APP,最近把他更新了一个版本,就抽取其中的天气温度折现图这个功能写了这篇博客,来与大家分享,希望对你有所帮助。

效果如图:

代码:

MainActivity.Java

/****
* 饼状图和天气折线图
*/
public class MainActivity extends AppCompatActivity { private WeatnerChartView chart1;
private WeatnerChartView chart2;
private PinChart pinChart;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView()
{
chart1= (WeatnerChartView) findViewById(R.id.weather_char1);
chart2= (WeatnerChartView) findViewById(R.id.weather_char2);
pinChart= (PinChart) findViewById(R.id.pinchart);
initData();
}
private void initData()
{
ArrayList<WeatherItem> list= new ArrayList<WeatherItem>();
list.add(new WeatherItem("",18));
list.add(new WeatherItem("",40));
list.add(new WeatherItem("", -1));
list.add(new WeatherItem("",1));
list.add(new WeatherItem("",6));
list.add(new WeatherItem("",2));
list.add(new WeatherItem("", 33));
chart1.SetTuView(list, "最高温度:");//单位: 摄氏度
chart1.invalidate();
ArrayList<WeatherItem> list1= new ArrayList<WeatherItem>();
list1.add(new WeatherItem("",1));
list1.add(new WeatherItem("",15));
list1.add(new WeatherItem("", -6));
list1.add(new WeatherItem("",-2));
list1.add(new WeatherItem("", 3));
list1.add(new WeatherItem("",-1));
list1.add(new WeatherItem("",11));
chart2.SetTuView(list1, "最低温度:");
chart2.invalidate();
} }

饼状图自定义控件 PinChart.java

@SuppressLint("DrawAllocation") public class PinChart extends View {

    static Canvas c;
private Paint[] mPaints;
private Paint mTextPaint;
private RectF mBigOval;
public float[] mSweep = { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 };
private static final float SWEEP_INC = 1; public static float[] humidity = { 110, 40, 50, 60, 50, 50 }; public PinChart(Context context) {
super(context); } public PinChart(Context context, AttributeSet atr) {
super(context, atr);
} @SuppressLint("DrawAllocation") @Override
protected void onDraw(Canvas canvas) {
canvas.drawColor(Color.TRANSPARENT);// 设置背景颜色(透明) mPaints = new Paint[humidity.length];
for (int i = 0; i < humidity.length; i++) {
mPaints[i] = new Paint();
mPaints[i].setAntiAlias(true);
mPaints[i].setStyle(Paint.Style.FILL);
mPaints[i].setColor(0x880FF000 + i * 0x019e8860);
} mBigOval = new RectF(40, 30, 220, 200);// 饼图的四周边界-->左,上,右,下 mTextPaint = new Paint();// 绘制文本
mTextPaint.setAntiAlias(true);
mTextPaint.setColor(Color.WHITE);
mTextPaint.setTextSize(16F);// 设置温度值的字体大小
float start = 0;
for (int i = 0; i < humidity.length; i++) {
canvas.drawArc(mBigOval, start, mSweep[i], true, mPaints[i]);
start += humidity[i];
if (mSweep[i] < humidity[i]) {
mSweep[i] += SWEEP_INC;
}
canvas.drawRect(new RectF(300, 30 + 15 * i, 312, 42 + 15 * i),
mPaints[i]);
canvas.drawText("测试模块" + i, 320, 40 + 15 * i, mTextPaint);
}
invalidate();
} }

自定义控件 WeatnerChartView.java

public class WeatnerChartView extends View {
private ArrayList<WeatherItem> items;
private String unit;
private String yFormat = "0"; private Context context; public void SetTuView(ArrayList<WeatherItem> list, String unitInfo) {
this.items = list;
this.unit = unitInfo;
} public WeatnerChartView(Context ct) {
super(ct);
this.context = ct;
} public WeatnerChartView(Context ct, AttributeSet attrs) {
super(ct, attrs);
this.context = ct;
} public WeatnerChartView(Context ct, AttributeSet attrs, int defStyle) {
super(ct, attrs, defStyle);
this.context = ct;
} @SuppressLint("DrawAllocation")
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas); if (items == null) {
return;
} int height = getHeight();
int width = getWidth(); int split = dip2px(context, 8);
int marginl = width / 24;//
int margint = dip2px(context, 60);
int margint2 = dip2px(context, 25);
int bheight = height - margint - 2 * split; Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color.parseColor("#ffffff"));//#7fffffff paint.setStrokeWidth(4);
paint.setStyle(Style.STROKE);
// 画单位
Paint p = new Paint();
p.setAlpha(0x0000ff);
p.setTextSize(sp2px(context, 15));
p.setColor(Color.parseColor("#28bbff"));
canvas.drawText(unit, split, margint2 + split * 2, p); // 画X坐标
ArrayList<Integer> xlist = new ArrayList<Integer>();
paint.setColor(Color.GRAY);
for (int i = 0; i < items.size(); i++) {
int span = (width - 2 * marginl) / items.size();
int x = marginl + span / 2 + span * i;
xlist.add(x);
drawText(items.get(i).getX(), x, split * 2, canvas);
} float max = Float.MIN_VALUE;
float min = Float.MAX_VALUE;
for (int i = 0; i < items.size(); i++) {
float y = items.get(i).getY();
if (y > max) {
max = y;
}
if (y < min) {
min = y;
}
} float span = max - min;
if (span == 0) {
span = 6.0f;
}
max = max + span / 6.0f;
min = min - span / 6.0f; // 获取点集合
Point[] mPoints = getPoints(xlist, max, min, bheight, margint); // 画线
paint.setColor(Color.parseColor("#7fffffff"));
paint.setStyle(Style.STROKE);
paint.setStrokeWidth(3);//
drawLine(mPoints, canvas, paint); // 画点
paint.setColor(Color.parseColor("#28bbff"));
paint.setStyle(Style.FILL);
for (int i = 0; i < mPoints.length; i++) {
canvas.drawCircle(mPoints[i].x, mPoints[i].y, 8, paint);//radius=12
String yText = new java.text.DecimalFormat(yFormat).format(items
.get(i).getY());
drawText(yText+"°", mPoints[i].x,
mPoints[i].y - dip2px(context, 12), canvas);
}
} private Point[] getPoints(ArrayList<Integer> xlist, float max, float min,
int h, int top) {
Point[] points = new Point[items.size()];
for (int i = 0; i < items.size(); i++) {
int ph = top + h
- (int) (h * ((items.get(i).getY() - min) / (max - min)));
points[i] = new Point(xlist.get(i), ph);
}
return points;
} private void drawLine(Point[] ps, Canvas canvas, Paint paint) {
Point startp = new Point();
Point endp = new Point();
for (int i = 0; i < ps.length - 1; i++) {
startp = ps[i];
endp = ps[i + 1];
canvas.drawLine(startp.x, startp.y, endp.x, endp.y, paint);
}
} private void drawText(String text, int x, int y, Canvas canvas) {
Paint p = new Paint();
p.setAlpha(0x0000ff);
p.setTextSize(sp2px(context, 15));
p.setTextAlign(Paint.Align.CENTER);
p.setColor(Color.WHITE);
canvas.drawText(text, x, y, p);
} public ArrayList<WeatherItem> getItems() {
return items;
} public void setItems(ArrayList<WeatherItem> items) {
this.items = items;
} public String getyFormat() {
return yFormat;
} public void setyFormat(String yFormat) {
this.yFormat = yFormat;
} public int sp2px(Context context, float spValue) {
final float fontScale = context.getResources().getDisplayMetrics().scaledDensity;
return (int) (spValue * fontScale + 0.5f);
} public int dip2px(Context context, float dpValue) {
final float scale = context.getResources().getDisplayMetrics().density;
return (int) (dpValue * scale + 0.5f);
}
}

源码点击下载

Android之自定义控件实现天气温度折线图和饼状图的更多相关文章

  1. Android绘图机制(四)——使用HelloCharts开源框架搭建一系列炫酷图表,柱形图,折线图,饼状图和动画特效,抽丝剥茧带你认识图表之美

    Android绘图机制(四)--使用HelloCharts开源框架搭建一系列炫酷图表,柱形图,折线图,饼状图和动画特效,抽丝剥茧带你认识图表之美 这里为什么不继续把自定义View写下去呢,因为最近项目 ...

  2. Qt数据可视化(散点图、折线图、柱状图、盒须图、饼状图、雷达图)开发实例

    ​  目录 散点图 折线图 柱状图 水平柱状图 水平堆叠图 水平百分比柱状图 盒须图 饼状图 雷达图 Qt散点图.折线图.柱状图.盒须图.饼状图.雷达图开发实例. 在开发过程中我们会使用多各种各样的图 ...

  3. java 柱状图、折线图、饼状图

    1.绘制柱状图: //BarChartTool工具类代码 package GUIview; import HibernateTool.HibernateTools; import ProductCla ...

  4. Android开源图表之树状图和饼状图的官方示例的整理

    最近由于工作需要,所以就在github上搜了下关于chart的三方框架 官方地址https://github.com/PhilJay/MPAndroidChart 由于工作需要我这里整理了一份Ecli ...

  5. ECharts 报表事件联动系列四:柱状图,折线图,饼状图实现联动

    代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...

  6. C# 绘制图表(柱状图,线性图,饼状图)

    http://blog.csdn.net/gisfarmer/article/details/3736452 Chart饼状图,每根柱子的宽度: int a = Chart1.Series[" ...

  7. [BOT]自己动手实现android 饼状图,PieGraphView,附源码解析

    本文要介绍的是一个参照手机支付宝app里面记账本功能里的"饼状图"实现的控件.通常app中可能的数据展示控件有柱状图,折线图,饼状图等,如果需要一个包含多种View控件的库,那么 ...

  8. DevExpress使用之ChartControl控件绘制图表(多坐标折线图、柱状图、饼状图)

    最近因为公司项目需要用到WinForm的DecExpress控件,在这里把一些使用方法总结一下. DevExpress中有一个专门用来绘制图表的插件ChartControl,可以绘制折线图.饼状图.柱 ...

  9. 【 D3.js 进阶系列 — 6.2 】 饼状图的拖拽

    本文讲解稍微复杂一些的拖拽应用,即拖拽饼图的各部分. 在[入门 - 第 9.1 章]讲解了如何制作饼状图.饼状图的各部分是用具有宽度的弧线来表示的.在与用户进行交互的时候,如果每一部分都能拖拽,是很有 ...

随机推荐

  1. pta 习题集5-17 家谱处理

    人类学研究对于家族很感兴趣,于是研究人员搜集了一些家族的家谱进行研究.实验中,使用计算机处理家谱.为了实现这个目的,研究人员将家谱转换为文本文件.下面为家谱文本文件的实例: John Robert F ...

  2. poj2185 Milking Grid【KMP】

    Milking Grid Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 10084   Accepted: 4371 Des ...

  3. java 中的控制台端口的输入

    java 中基于控制台端的输入时最基本的操作. 第一步 导入Scanner类 import java.util.Scanner; 第二步 创建输入对象 input Scanner input=new ...

  4. In ZeroDB, the client is responsible for the database logic. Data encryption, decryption, and compression also happen client side. Therefore, the server never has any knowledge about the data, its str

    zerodb/index.rst at master · zerodb/zerodb https://github.com/zerodb/zerodb/blob/master/docs/source/ ...

  5. Xvfb新建虚拟X窗口,通过x11vnc启动VNC Server并转发Xvfb启动的虚拟窗口

    远程运行Linux窗口程序使用X Windows太重量级了,可以使用Xvfb新建虚拟X窗口,通过x11vnc启动VNC Server并转发Xvfb启动的虚拟窗口. 1 2 3 4 5 6 7 8 yu ...

  6. docker 离线环境安装oracle

    因测试需要,需在内网的测试环境搭建一套docker Oracle 11g环境进行测试,测试环境为redhat 6.6 安装docker 1.7,本机windows 7 环境,安装docker 17.1 ...

  7. 【Python】【爬虫】如何学习Python爬虫?

    如何学习Python爬虫[入门篇]? 路人甲 1 年前 想写这么一篇文章,但是知乎社区爬虫大神很多,光是整理他们的答案就够我这篇文章的内容了.对于我个人来说我更喜欢那种非常实用的教程,这种教程对于想直 ...

  8. Mirror--生成用于镜像用户同步的脚本

    USE master GO IF OBJECT_ID ('sp_hexadecimal') IS NOT NULL DROP PROCEDURE sp_hexadecimal GO CREATE PR ...

  9. marathon-lb-什么是服务发现?(转)

    摘要: 将容器应用部署到集群时,其服务地址,即IP和端口, 是由集群系统动态分配的.那么,当我们需要访问这个服务时,如何确定它的地址呢?这时,就需要服务发现(Service Discovery)了.本 ...

  10. PAT 1127 ZigZagging on a Tree[难]

    1127 ZigZagging on a Tree (30 分) Suppose that all the keys in a binary tree are distinct positive in ...