Android自定义折线图
老师布置了个作业:http://www.cnblogs.com/qingxu/p/5316897.html
作业中提到的 “玩了几天以后,大家发现了一些很有意思的现象,比如黄金点在逐渐地往下移动。”
而只是提到而已,如果不保留历史结果和不是比较明显的显示出来,大家也很难发现这个问题。于是我就想到了折线图,折线图所呈现的是
过往的黄金点的数值,我们可以根据折线图就很容易看出黄金点是否下移的问题。
对不起!我的方法比较笨,自己写了个用于绘制折线图的算法,当然如果你需要功能强大一点亦可以,诺!出门右转:
AChartEngine Android图表绘制引擎。
由于我需要实现的功能比较简单,一个Y轴用于呈现0到100的数值,用于记录黄金点的值,没有设置X轴(X轴一段代码的事,如果有需要用得的,自己加吧),
我所需要展现的就只是黄金点折线图,既是通过观察折线上的黄金点,就能分析走向,而且不用管黄金点的个数是多少都能把画布占满(浪费可耻)。
先看看布局XML代码吧:
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="match_parent"
- android:layout_height="match_parent"
- android:background="@drawable/back"
- android:orientation="vertical" >
- <FrameLayout
- android:id="@+id/V_text"
- android:layout_width="315dp"
- android:layout_height="200dp"
- android:layout_gravity="center_horizontal"
- android:layout_marginTop="10dp"
- android:background="@drawable/shape"
- />
- </LinearLayout>
一个LinearLayout父容器加个FrameLayout的布局,这样便于根据不同尺寸的手机屏幕动态设置画布的大小;
- LinearLayout.LayoutParams linearParams = (LinearLayout.LayoutParams) V_text
- .getLayoutParams(); // 取控件textView当前的布局参数
- linearParams.height = (int) canasHeight;// 控件的高强制设成
- linearParams.width = (int) canasWidth;
- V_text.setLayoutParams(linearParams);
写一个继承自View的类Myview
绘制折线的所需的各个变量,我都封装在Myview类里,外界只需创建一个Myview类实例时传递(Context context, List numble)参数。
- public class Myview extends View {
- private float canasWidth; //画布宽
- private float canasHeight;
- private float XPoint; //定义原点
- private float YPoint;
- private int XScale; //间隔
- private int YScale;
- // private Float[] numble = {22F, 54.3F, 63F, 23F, 87F, 36F};
- private List numble = new ArrayList();
- public Myview(Context context, List numble) {
- super(context);
- this.numble = numble;
- WindowManager wm = ((Activity) context).getWindowManager(); //获取屏幕长宽
- int width = wm.getDefaultDisplay().getWidth();
- int height = wm.getDefaultDisplay().getHeight();
- canasWidth = (width * 9) / 10; //定义画布所占比例
- canasHeight = height / 3;
- XPoint = canasWidth / 14.0F; //定义原点
- YPoint = canasHeight - 20;
- XScale = (int) (canasWidth - 50) / (numble.size());
- YScale = (int) ((canasHeight - 50) / 11);
- LinearLayout.LayoutParams linearParams = (LinearLayout.LayoutParams) V_text
- .getLayoutParams(); // 取控件textView当前的布局参数
- linearParams.height = (int) canasHeight;// 控件的高强制设成20
- linearParams.width = (int) canasWidth;
- V_text.setLayoutParams(linearParams);
- }
- @Override
- protected void onDraw(Canvas canvas) {
- super.onDraw(canvas);
- Paint paint = new Paint();
- paint.setColor(0xffff0000);
- paint.setTextSize(40);
- paint.setStrokeWidth(5);
- paint.setAntiAlias(false);
- Paint paint2 = new Paint();
- paint2.setColor(0xff00ff00);
- paint2.setTextSize(30);
- Path path = new Path();
- canvas.drawLine(XPoint, 30, XPoint, YPoint, paint);
- Paint paint1 = new Paint(); // 文字画笔
- paint1.setTextSize(65);
- paint1.setColor(Color.YELLOW);
- canvas.drawText("黄金G点历史折线", 300, 70, paint1);
- for (int i = 0; i <= 10; i++) {
- canvas.drawLine(XPoint, YPoint - i * YScale, XPoint + 20,
- YPoint - i * YScale, paint); // Y刻度
- canvas.drawText(i * 10 + "", XPoint - 70,
- YPoint - i * YScale - 10, paint); // 文字
- }
- canvas.drawLine(XPoint, 30, XPoint + 20, 50, paint); // 绘制箭头
- canvas.drawLine(XPoint, 30, XPoint - 20, 50, paint);
- for (int j = 0; j < numble.size(); j++) { ////// 绘制折线
- try {
- float y0 = (Float) numble.get(j);
- float y1 = (Float) numble.get(j + 1);
- Log.i("y0", y0 + "");
- Log.i("y1", y1 + "");
- canvas.drawText(numble.get(j) + "",
- XPoint + j * XScale + 10,
- YPoint - (y0 / 10) * YScale - 20, paint2); // 文
- canvas.drawLine(XPoint + j * XScale,
- YPoint - (y0 / 10) * YScale,
- XPoint + (j + 1) * XScale,
- YPoint - (y1 / 10) * YScale, paint);
- } catch (Exception e) {
- }
- }
- }
- }
在Activity中初始化
- FrameLayout
与创建实例:
- V_text = (FrameLayout) findViewById(R.id.V_text);
- V_text.addView(new Myview(Txet.this, getdata()));
- getdata()函数是用于获取数据,比如:
- public List getdata() {
- List numble = new ArrayList();
- numble.add(74.0F);
- numble.add(65.0F);
- numble.add(23.0F);
- numble.add(34.0F);
- numble.add(12.0F);
- numble.add(8.0F);
- numble.add(56.0F);
- numble.add(23.0F);
- numble.add(27.0F);
- numble.add(78.0F);
- numble.add(67.0F);
- numble.add(45.0F);
- numble.add(98.0F);
- numble.add(2.0F);
- numble.add(8.0F);
- return numble;
所绘制的折线图如下图所示:
Android自定义折线图的更多相关文章
- android 自定义折线图
看图: 比较简陋,主要是通过canvas画上去的: package com.example.democurvegraph.view; import java.util.ArrayList; impor ...
- 使用achartengine实现自定义折线图 ----附代码 调试OK
achartengine作为android开发中最常用的实现图标的开源框架,使用比较方便,参考官方文档谢了如下Demo,实现了自定义折线图. package edu.ustb.chart; impor ...
- android绘画折线图二
紧接着android绘画折线图一,下面来介绍第二种方法,使用该方法,首先需要一个Androidplot-core-0.4.3-release.jar,该jar包之后也包含在项目源码中 建立一个andr ...
- android绘画折线图一
最近需要实现用android来画折线图,所以百度了一下,发现确实很多,也很乱,现在整理两种方法(第二种方法在[android绘画折线图二]中实现),仅供大家参考,一起学习研究. 第一种使用ChartF ...
- Android自定义控件-折线图
好长时间没有更新博客了,终于可以抽出时间写点东西了,写点什么呢?最近在qq群里边有人问,下边的这个控件怎么画?如下图所示:图可以左右拖动,直到显示完全为止.刚开始看到这个效果图,我也想了一下总共分为以 ...
- echarts自定义折线图横坐标时间间隔踩坑总结
折线图需求:横坐标为时间,要求按一定间隔展示,鼠标移至折线上间隔时间内的数据也可展示 其实很简单的一个配置就可搞定,但在不熟悉echarts配置的情况下,就很懵逼 xAxis: { boundaryG ...
- Android自定义视图三:给自定义视图添加“流畅”的动画
这个系列是老外写的,干货!翻译出来一起学习.如有不妥,不吝赐教! Android自定义视图一:扩展现有的视图,添加新的XML属性 Android自定义视图二:如何绘制内容 Android自定义视图三: ...
- iOS 动画绘制线条颜色渐变的折线图
效果图 .................... 概述 现状 折线图的应用比较广泛,为了增强用户体验,很多应用中都嵌入了折线图.折线图可以更加直观的表示数据的变化.网络上有很多绘制折线图的demo,有 ...
- Android 自定义View -- 简约的折线图
转载请注明出处:http://write.blog.csdn.net/postedit/50434634 接上篇 Android 圆形百分比(进度条) 自定义view 昨天分手了,不开心,来练练自定义 ...
随机推荐
- canvas简介
一.canvas简介 1.1 什么是canvas?(了解) 是HTML5提供的一种新标签 <canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆 ...
- Gcc的Makefile简单使用
Gcc的Makefile简单使用http://blog.chinaunix.net/uid-9330295-id-2425867.html
- fiddler ios 手机抓包
前言: 环境 :手机ios ip5s .fiddler .360wifi 保证手机和电脑是局域网(同一网络) 1:下载安装fiddler 准备环境 2:配置 fiddler 对应把图勾选上 弹出框 点 ...
- ACM/ICPC 之 中国剩余定理+容斥原理(HDU5768)
二进制枚举+容斥原理+中国剩余定理 #include<iostream> #include<cstring> #include<cstdio> #include&l ...
- centos 安装pip,使用pip安装django
python版本要2.7.x以上版本,若未安装python执行以下命令安装: wget https://www.python.org/ftp/python/2.7.8/Python-2.7.8.tgz ...
- Json数组追加数据
背景:在做一个购物车的时候,点击第一个商品,然后存入一个json数组中,点击第二个商品的时候,又继续在json数组中追加,代码如下: <script type="text/javasc ...
- 动画系统(Mecanim补充)
设置状态机部分等在实践中总结. 状态机基础: 动画层 Animation Layers Unity 使用"动画层"来管理身体不同部分的复杂状态机. 动画状态机 Animati ...
- php单点登录之模拟淘宝天猫同步登录
说到单点登录大家都很了解,一个站点登录其他域会自动登录. 单点登录SSO(Single Sign On)的方法有很多,比如:p3p.共享session.共享cookice.第三方OAuth认证. 这里 ...
- 动态规划求最长公共子序列(Longest Common Subsequence, LCS)
1. 问题描述 子串应该比较好理解,至于什么是子序列,这里给出一个例子:有两个母串 cnblogs belong 比如序列bo, bg, lg在母串cnblogs与belong中都出现过并且出现顺序与 ...
- CozyRSS开发记录16-RssContentView显示
CozyRSS开发记录16-RssContentView显示 1.RssContentView的布局和绑定 继续参照原型图来写xaml: 然后在RSSContentFrameViewModel里提供绑 ...