16. 动画

注意:本章的动画效果只会在API 11(Android3.0.x)及以上的Android版本上生效

在低于上述的Android版本中,动画将不会被执行,并不会导致程序崩溃。

所有类型的图标都可以用一种看上去比较炫酷的动画效果来进行构建。

三种不同的动画方法来让我们在X轴,Y轴或则两个轴同时显示动画效果。

方法 使用
animateX(int durationMillis) X水平轴的图表值动画,这意味着在指定的时间内从左到右 建立图表
animateY(int durationMillis) 垂直轴的图表值动画,这意味着在指定的时间内从下到上 建立图表。
animateXY(int xDuration, int yDuration) 两个轴的图表值动画,从左到右,从下到上 建立图表。
mChart.animateX(3000); // animate horizontal 3000 milliseconds
// or:
mChart.animateY(3000); // animate vertical 3000 milliseconds
// or:
mChart.animateXY(3000, 3000); // animate horizontal and vertical 3000 milliseconds

任意一种 animate(…) 动画方法被调用后,无需再调用 invalidate() 方法。

16.1 缓动动画

这个库可以让你对动画应用”缓动函数”。

你可以选择以下预定义的静态 Easing.EasingOption :

  public enum EasingOption {
      Linear,
      EaseInQuad,
      EaseOutQuad,
      EaseInOutQuad,
      EaseInCubic,
      EaseOutCubic,
      EaseInOutCubic,
      EaseInQuart,
      EaseOutQuart,
      EaseInOutQuart,
      EaseInSine,
      EaseOutSine,
      EaseInOutSine,
      EaseInExpo,
      EaseOutExpo,
      EaseInOutExpo,
      EaseInCirc,
      EaseOutCirc,
      EaseInOutCirc,
      EaseInElastic,
      EaseOutElastic,
      EaseInOutElastic,
      EaseInBack,
      EaseOutBack,
      EaseInOutBack,
      EaseInBounce,
      EaseOutBounce,
      EaseInOutBounce,
  }

基本上,有以下两种方式进行 easing 你的动画。

1. 预定义的缓动选项:(下面代码可在所有 Android 版本运行)

public void animateY(int durationmillis, Easing.EasingOption option); 

例如,调用带有预定义缓动选项的动画方法

// animate both axes with easing
mChart.animateY(3000, Easing.EasingOption.EaseOutBack); 

当你想代码运行在 Android 3.0 (API 11) 以下时,要使用 Easing.EasingOption 。

2. 自定义缓动函数(在 Android 3.0 自定义缓动函数会使应用 crash):

public void animateY(int durationmillis, EasingFunction function); 

通过创建你自己的easing-function类并且实现EasingFunction接口,你可以实现你自己的easing功能

/**
 * Interface for creating custom made easing functions.
 */
 public interface EasingFunction {
    /**
     * Called everytime the animation is updated.
     * @param input - the time passed since the animation started (value between 0 and 1)
     */
     public float getInterpolation(float input);
 }

然后,按照如下方式使用(注意,这个不能在小于Android3.0的版本上使用,将会导致程序崩溃)

// animate both axes with easing
mChart.animateY(3000, new MyEasingFunction()); 

17. IMarker接口

版本v3.0.0以来,图表中的标记(弹出窗口)由IMarker接口表示。

17.1 IMarker接口

这个接口可以帮助你实现在图表中条目高亮的时候显示自定义的Marker窗口。这个接口给我们提供了如下需要实现的方法:

public interface IMarker {

    /**
     * @return The desired (general) offset you wish the IMarker to have on the x- and y-axis.
     *         By returning x: -(width / 2) you will center the IMarker horizontally.
     *         By returning y: -(height / 2) you will center the IMarker vertically.
     */
    MPPointF getOffset();

    /**
     * @return The offset for drawing at the specific `point`. This allows conditional adjusting of the Marker position.
     *         If you have no adjustments to make, return getOffset().
     *
     * @param posX This is the X position at which the marker wants to be drawn.
     *             You can adjust the offset conditionally based on this argument.
     * @param posY This is the X position at which the marker wants to be drawn.
     *             You can adjust the offset conditionally based on this argument.
     */
    MPPointF getOffsetForDrawingAtPos(float posX, float posY);

    /**
     * This method enables a specified custom IMarker to update it's content every time the IMarker is redrawn.
     *
     * @param e         The Entry the IMarker belongs to. This can also be any subclass of Entry, like BarEntry or
     *                  CandleEntry, simply cast it at runtime.
     * @param highlight The highlight object contains information about the highlighted value such as it's dataset-index, the
     *                  selected range or stack-index (only stacked bar entries).
     */
    void refreshContent(Entry e, Highlight highlight);

    /**
     * Draws the IMarker on the given position on the screen with the given Canvas object.
     *
     * @param canvas
     * @param posX
     * @param posY
     */
    void draw(Canvas canvas, float posX, float posY);
}

17.2 创建一个标记视图

为了创建一个自定义的标记视图,你需要创建一个实现了IMarker接口的类:

public class YourMarkerView implements IMarker { ... }

实现IMarker接口时返回什么样的值,完全取决于你自己的需求。所以,看看上面关于每个方法的介绍是很有必要的。

除了通过实现IMarker接口来创建自己的标记视图,我们还可以通过继承下面提到的一个类来达到同样的目的。这个方法比较简单,并且我们也不需要实现IMarker接口中的所有方法。只有几个特定的方法需要我们复写和自定义。最重要的是复写refreshContent(…)方法来调整标记视图中的数据。一个简单的示例如下:

public class YourMarkerView extends MarkerView {

    private TextView tvContent;

    public MyMarkerView(Context context, int layoutResource) {
        super(context, layoutResource);

        // find your layout components
        tvContent = (TextView) findViewById(R.id.tvContent);
    }

    // callbacks everytime the MarkerView is redrawn, can be used to update the
    // content (user-interface)
    @Override
    public void refreshContent(Entry e, Highlight highlight) {

        tvContent.setText("" + e.getY());

        // this will perform necessary layouting
        super.refreshContent(e, highlight);
    }

    private MPPointF mOffset; 

    @Override
    public MPPointF getOffset() {

        if(mOffset == null) {
           // center the marker horizontally and vertically
           mOffset = new MPPointF(-(getWidth() / 2), -getHeight());
        }

        return mOffset;
    }
}

17.3 获取/设置Marker

给图表设置一个Marker,使用setMarker(…)方法:

IMarker marker = new YourMarkerView();
chart.setMarker(marker);

要访问图表上的一个Marker,使用getMarker()方法:

IMarker marker = chart.getMarker();

17.4 预定义Markers

除了你自定义的MarkerView,开源库中也给我们提供了几个预定义的markers以供方便快捷的使用。其中包括:

  • MarkerView :基本marker。允许提供布局文件作为图表上呈现的标记。继承这个类并且复写refreshContent(…)方法来调整标记视图中的内容。
  • MarkerImage:一种绘制图片的标记视图。允许提供一个图片资源作为图表上的标记视图。继承这个类并且复写refreshContent(…)方法来调整标记视图中的内容。


17.5 旧版MarkerView

版本v3.0.0 之前,MarkerView类负责在图表高亮部分绘制标记视图。详情请查阅老版的the old MarkerView wiki page.


18. ChartData类

本章旨在让你更深入的了解MPAndroidChart中的数据模型。

ChartData类是像LineData,BarData等等这些数据类的父类。setData()方法可以将数据设置到图表中。

public class LineData extends ChartData { ...}

下面介绍一些ChartData类中的方法,可以直接在它的子类中使用。

18.1 数据样式

方法 使用
setValueTextColor(int color) 设置 DataSets 数据对象包含的数据的值文本的颜色
setValueTextColors(List colors) 设置一个颜色列表用于显示值
setValueTextSize(float size) 设置 DataSets 数据对象包含的数据的值文本的大小(单位是dp)
setValueTypeface(Typeface tf) 设置 DataSets 数据对象包含的数据的值文本的字体
setValueFormatter(ValueFormatter f) 为DataSets 数据对象包含的数据设置自定义的 ValueFormatter。更多关于ValueFormatter,请查阅此处
setDrawValues(boolean enabled) 启用/禁用 绘制所有 DataSets 数据对象包含的数据的值文本

18.2 Getter方法

方法 使用
getDataSetByIndex(int index) 返回目标 DataSet 列表中给定索引的数据对象。
contains(Entry entry) 检查此数据对象是否包含指定的Entry 。 注:这个相当影响性能,性能严峻情况下,不要过度使用。
contains(T dataSet) 如果数据中包含指定dataSet,返回true否则返回false

18.3 清除

方法 使用
clearValues() 清除所有 DataSet 对象和所有 Entries 的数据 。 不会删除所提供的 x-values

18.4 选中高亮

方法 使用
setHighlightEnabled(boolean enabled) 设置为true,允许通过点击高亮突出 ChartData 对象和其 DataSets
setDrawVerticalHighlightIndicator(boolean enabled) 启用/即用纵向选中高亮指示线。如果禁用,指示线将不会被绘制
setDrawHorizontalHighlightIndicator(boolean enabled) 用/即用横向选中高亮指示线。如果禁用,指示线将不会被绘制

18.5 动态数据

方法 使用
notifyDataChanged() 通知数据对象,底层数据发生变化,候执行所有必需的计算

想了解如何在数据对象上增加或者移除数据,请查阅dynamic & realtime data章节

MPAndroidChart Wiki(译文)~Part 4的更多相关文章

  1. MPAndroidChart Wiki(译文)~Part 1

    1. 基础入门 1.1 添加依赖 Gradle 工程添加依赖 (推荐使用) 项目级build.gradle中添加: allprojects { repositories { maven { url & ...

  2. MPAndroidChart Wiki(译文)~Part 6

    22. ViewPortHandler ViewPortHandler负责处理图表的视窗.也就是说它负责图表视图中的展示给用户的那部分内容.包括图表位移,缩放级别,图表大小和绘制区域以及当前偏移量.V ...

  3. MPAndroidChart Wiki(译文)~Part 5

    19. ChartData子类 这篇wiki主要关注ChartData子类的具体介绍.至于此部分没有提及到的ChartData的子类,代表他们没有特性功能需要介绍. BarData 方法 使用 set ...

  4. MPAndroidChart Wiki(译文)~Part 2

    7. 填充数据 这一章节将讲解给各式各样的图表设置数据的方法. 7.1 LineChart(线形图) 想给图表添加数据,使用如下方法: public void setData(ChartData da ...

  5. MPAndroidChart Wiki(译文)~Part 3

    13. 图例 默认情况下,所有的图表都支持图例并且会自动生成.给图表设置完数据之后,图例会被绘制出来.图例通常由多个条目组成,每个条目由标签形式/形状表示. 自动生成的图例包含的条目数取决于不同颜色的 ...

  6. MPAndroidChart的具体属性方法

    android中常用的第三方图表MPAndroidChart的一些具体属性及方法说明 注意:在将折线图转为曲线图时,lineDataSet.setMode(LineDataSet.Mode.CUBIC ...

  7. <Android 应用 之路> MPAndroidChart~BubbleChart(气泡图) and RadarChart(雷达图)

    简介 MPAndroidChart是PhilJay大神给Android开发者带来的福利.MPAndroidChart是一个功能强大并且使用灵活的图表开源库,支持Android和iOS两种,这里我们暂时 ...

  8. <Android 应用 之路> MPAndroidChart~ScatterChart

    简介 MPAndroidChart是PhilJay大神给Android开发者带来的福利.MPAndroidChart是一个功能强大并且使用灵活的图表开源库,支持Android和IOS两种,这里我们暂时 ...

  9. <Android 应用 之路> MPAndroidChart~PieChart

    简介 MPAndroidChart是PhilJay大神给Android开发者带来的福利.MPAndroidChart是一个功能强大并且使用灵活的图表开源库,支持Android和IOS两种,这里我们暂时 ...

随机推荐

  1. C++开学第二次作业(5.14)

    开学第二次作业(5.14) 代码传送门 题目 给定一个常数K以及一个单链表L,请编写程序将L中每K个结点反转.例如:给定L为1→2→3→4→5→6,K为3,则输出应该为3→2→1→6→5→4:如果K为 ...

  2. MysQL使用一创建库与表

    数据库简介 人类在进化的过程中,创造了数字.文字.符号等来进行数据的记录,但是承受着认知能力和创造能力的提升,数据量越来越大,对于数据的记录和准确查找,成为了一个重大难题 计算机诞生后,数据开始在计算 ...

  3. 读取Jar中的json文件

    现在操作json的jar 都是用的fastjson, 如果需要读取的json文件不在jar包里面,则可以这样获取到: String path = this.getClass().getClassLoa ...

  4. CNN卷积减少参数个数的理解(分为全连接到CNN三个层级)

    参考连接 : https://blog.csdn.net/accumulate_zhang/article/details/77816566 1000*1000 的图像, 1000000个隐层神经元, ...

  5. codeforces 578c - weekness and poorness - 三分

    2017-08-27 17:24:07 writer:pprp 题意简述: • Codeforces 578C Weakness and poorness• 给定一个序列A• 一个区间的poornes ...

  6. 04_Storm编程上手_WordCount集群模式运行

    1. 要解决的问题:代码打包 前一篇的代码,在IDEA中通过maven工程创建,通过IDEA完成代码打包 1)File -> Project Structure  2) 选择Artifacts, ...

  7. LA 3720 高速公路(互质判斜率)

    https://vjudge.net/problem/UVALive-3720 题意: 有一个n行m列的点阵,问一共有多少条非水平非垂直的直线至少穿过其中的两个点. 思路: 没思路的题. 首先枚举矩形 ...

  8. Openssl VS编译方法

    工具: 1. 编译环境win10+vs2015专业版 2. ActivePerl工具,官网下载链接:http://www.activestate.com/activeperl/downloads 3. ...

  9. JavaScript内部原理系列-执行上下文(Execution Context)

    概要 本文将向大家介绍ECMAScript的执行上下文以及相关的可执行代码类型. 定义 每当控制器到达ECMAScript可执行代码的时候,控制器就进入了一个执行上下文.执行上下文(简称:EC)是个抽 ...

  10. PHP XML Parser 函数

    PHP XML Parser 简介 XML 函数允许您解析 XML 文档,但无法对其进行验证. XML 是一种用于标准结构化文档交换的数据格式.您可以在我们的 XML 教程 中找到更多有关 XML 的 ...