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. 20135302魏静静——linux课程第四周实验及总结

    linux课程第四周实验及总结 一.实验 我选择的是第20号系统调用,getpid 代码如下: /* getpid.c */ #include <unistd.h> #include &l ...

  2. heartbeat-gui

    一.简介gui heartbeat的v2版本将v1中haresources配置文件使用GUI图形配置接口来配置高可用集群.更加便捷,直观. 二.准备条件和资源规划见上文http://www.cnblo ...

  3. vue.js的一些小语法v-bind,v-if,v-show,v-else

    知识点: v-bind 动态绑定标签属性 v-bind 可简写为 : 使用v-bind 绑定class和内联样式 使用v-if,v-show,v-else进行条件渲染 <template> ...

  4. P4Lang Repository: Switch

    Github Switch Introduction Structure: +-----+ +-----+ +-----+ +-----+ |App a| |App j| |App n| |App z ...

  5. e.target和e.currentTarget区别

    直接上代码: body里: <div id="father"> father <div id="son"> son </div&g ...

  6. 洛谷P3601 签到题

    本文版权归ljh2000和博客园共有,欢迎转载,但须保留此声明,并给出原文链接,谢谢合作. 本文作者:ljh2000 作者博客:http://www.cnblogs.com/ljh2000-jump/ ...

  7. python3安装tensorflow遇到的问题

    1. 使用命令:sudo pip3 install --upgrade \ https://storage.googleapis.com/tensorflow/linux/cpu/tensorflow ...

  8. ORM--------Hibernate、Mybatis与Spring Data的区别

    1.概念: Hibernate :Hibernate是一个开放源代码的对象关系映射框架,它对JDBC进行了非常轻量级的对象封装,使得Java程序员可以随心所欲的使用对象编程思维来操纵数据库.着力点对象 ...

  9. 【Mongodb】数据库操作--备份、还原、导出和导入

    文章转载自点这里 mongodb数据备份和还原主要分为二种,一种是针对于库的mongodump和mongorestore,一种是针对库中表的mongoexport和mongoimport. mongo ...

  10. Pandas:时间数据的季节分析

    最近在做论文的数据处理,涉及到不同年份不同季节的分析.另外还要求不同季节的数据可以单独分析. 其实思路还是比较简单的,那就在原始数据中增加一栏:季节 2013-05-21 Aotizhongxin 1 ...