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. 20145328 《Java程序设计》实验三实验报告

    20145328 <Java程序设计>实验三实验报告 实验名称 Java敏捷开发与XP实践 实验内容 XP基础 XP核心实践 相关工具 实验步骤 (一)敏捷开发与XP 敏捷开发是一种以人为 ...

  2. spring MVC Action里面怎么设置UTF-8编码集

    /* 编码转换,确保写数据库的时候不会出现乱码 */ public class CodingConvert{ public CodingConvert(){ // } public String to ...

  3. mac下ssh到远程服务器时中文乱码

    前言:mac本地的语言环境为英文,远程是支持中文的, 问题: 一开始是在iterm2下登录远程服务器更新数据库时发现中文注释不能正常显示,以为是iterms2下设置有问题,使用系统自带的termina ...

  4. openwrt生成的镜像放在哪里

    答:1.打包好之后是放在build_dir/target-$(cross-compile-toolchan-name)/linux-$(chip-series-name)_$(chip-arch)/t ...

  5. java -jar 启动jar包 带参数

    运行jar包时指定端口:java -jar xxx.jar --server.port=8088 server.port=8081 若命令行传入的server.port没有作用,服务仍然使用8081端 ...

  6. 初学Selenium遇到的那些坑

    一.遇到一个下拉选择框,可以点击继续选择: 所以click两次就可以了: 二.国际话问题 bdId.selectByIndex(index);//index位下拉框内容的下标,从0开始,  数组形式[ ...

  7. 不小心把sudoer改错了的补救方法

    原本是感觉每次 sudo command 都要输入密码太费事了,就想把密码去掉.好了怎么去掉呢,自然是修改 /etc/sudoers 可是不小心修改错了,结果悲剧出现了:由于是在非root用户模式下, ...

  8. Attribute 'items' must be an array, a Collection or a Map错误解决!

    唉!真的要说一句话叫做论一串代码的重要性!就是如此的气人!气的牙根痒痒! 前几天刚刚写过SpringMVC之ModelAndView的 jsp值在浏览页面不显示的问题!也是因为这一串代码,但是这一次一 ...

  9. 1-23-shell脚本之-if流程控制语句和for循环语句的使用

    大纲: 1.逻辑判断 2.if流程控制语句 3.for循环控制语句   ---------------------------------------------- 在开始之前,先了解一下逻辑判断符号 ...

  10. 51nod-1179-最大的gcd(数学)

    1179 最大的最大公约数  题目来源: SGU 基准时间限制:1 秒 空间限制:131072 KB 分值: 40 难度:4级算法题  收藏  关注 给出N个正整数,找出N个数两两之间最大公约数的最大 ...