MPAndroidChart 教程:动画 Animations(十)
来源:互联网 发布:彩卡网络下单系统 编辑:程序博客网 时间:2024/04/28 03:24
其余文章索引:
MPAndroidChart 教程:概述
MPAndroidChart 教程:开始 Getting Started(一)
MPAndroidChart 教程:与图表进行手势交互 Interaction with the Chart(二)
MPAndroidChart 教程:坐标轴,X轴,Y轴,Labels(三)
MPAndroidChart 教程:设置数据,设置颜色(四)
MPAndroidChart 教程:数据格式器 ValueFormatter(五)
MPAndroidChart 教程:图表的具体设置 Specific chart settings(六)
MPAndroidchart 教程:图例 Legend(七)
MPAndroidChart 教程:动态和实时数据 Dynamic & Realtime Data(八)
MPAndroidChart 教程:修改视窗 Modifying the Viewport(九)
MPAndroidChart 教程:动画 Animations(十)
MPAndroidChart 教程:MarkerView(十一)
MPAndroidChart 教程:ChartData类,ChartData子类, DataSet类,DataSet子类(十二)
时间仓促,难免有错误,有的话希望大家在评论中指出,谢谢。
源码:范例代码在线查看或下载
一、效果图
1) LineChart 效果图
// 设置动画 chart.animateX(8000); // 图1 chart.animateY(8000); // 图2 chart.animateXY(8000, 8000); // 图3 chart.animateY(8000, Easing.EasingOption.EaseInElastic ); // 图4
2) BarChart 效果图
// 设置动画 chart.animateX(8000); // 图1 chart.animateY(8000); // 图2 chart.animateXY(8000, 8000); // 图3 chart.animateY(8000, Easing.EasingOption.EaseInSine); // 图4
3) PieChart 效果图
// 设置动画 chart.animateX(8000); // 图1 chart.animateY(8000); // 图2 chart.animateXY(8000,8000); // 图3 chart.animateY(8000, Easing.EasingOption.EaseOutBounce); // 图4
二、概述
MPAndroidChart 的动画机制只在Android API 11 (Android 3.0.x)
和以上有效。
在低于 Android 3.0.x 的版本中动画不会执行(但不会引起 crash)。
所有图表类型都支持动画,可以用来创建/建立图表在一个很棒的方法。三种不同的动画方法存在,动画,或者x轴和y轴分别:
animateX(int durationMillis)
: 水平轴的图表值动画,这意味着在指定的时间内从左到右 建立图表。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()
方法。
三、ChartAnimator 动画源码分析
/** * Object responsible for all animations in the Chart. ANIMATIONS ONLY WORK FOR * API LEVEL 11 (Android 3.0.x) AND HIGHER. */@SuppressLint("NewApi")public class ChartAnimator { /** object that is updated upon animation update */ private AnimatorUpdateListener mListener; public ChartAnimator() {} public ChartAnimator(AnimatorUpdateListener listener) { mListener = listener; } /** the phase that is animated and influences the drawn values on the y-axis */ protected float mPhaseY = 1f; /** the phase that is animated and influences the drawn values on the x-axis */ protected float mPhaseX = 1f; // 下面的动画方法}
1) animateX( … ) 方法的源码
/** * Animates the rendering of the chart on the x-axis with the specified * animation time. If animate(...) is called, no further calling of * invalidate() is necessary to refresh the chart. * * @param durationMillis */ public void animateX(int durationMillis) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorX = ObjectAnimator.ofFloat(this, "phaseX", 0f, 1f); animatorX.setDuration(durationMillis); animatorX.addUpdateListener(mListener); animatorX.start(); } public void animateX(int durationMillis, Easing.EasingOption easing) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorX = ObjectAnimator.ofFloat(this, "phaseX", 0f, 1f); animatorX.setInterpolator(Easing.getEasingFunctionFromOption(easing)); animatorX.setDuration(durationMillis); animatorX.addUpdateListener(mListener); animatorX.start(); } public void animateX(int durationMillis, EasingFunction easing) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorX = ObjectAnimator.ofFloat(this, "phaseX", 0f, 1f); animatorX.setInterpolator(easing); animatorX.setDuration(durationMillis); animatorX.addUpdateListener(mListener); animatorX.start(); }
2) animateY( … ) 方法的源码
/** * Animates the rendering of the chart on the y-axis with the specified * animation time. If animate(...) is called, no further calling of * invalidate() is necessary to refresh the chart. * * @param durationMillis */ public void animateY(int durationMillis) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorY = ObjectAnimator.ofFloat(this, "phaseY", 0f, 1f); animatorY.setDuration(durationMillis); animatorY.addUpdateListener(mListener); animatorY.start(); } public void animateY(int durationMillis, Easing.EasingOption easing) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorY = ObjectAnimator.ofFloat(this, "phaseY", 0f, 1f); animatorY.setInterpolator(Easing.getEasingFunctionFromOption(easing)); animatorY.setDuration(durationMillis); animatorY.addUpdateListener(mListener); animatorY.start(); } public void animateY(int durationMillis, EasingFunction easing) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorY = ObjectAnimator.ofFloat(this, "phaseY", 0f, 1f); animatorY.setInterpolator(easing); animatorY.setDuration(durationMillis); animatorY.addUpdateListener(mListener); animatorY.start(); }
3) animateXY( … ) 方法的源码
/** * Animates the drawing / rendering of the chart on both x- and y-axis with * the specified animation time. If animate(...) is called, no further * calling of invalidate() is necessary to refresh the chart. * * @param durationMillisX * @param durationMillisY */ public void animateXY(int durationMillisX, int durationMillisY) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorY = ObjectAnimator.ofFloat(this, "phaseY", 0f, 1f); animatorY.setDuration( durationMillisY); ObjectAnimator animatorX = ObjectAnimator.ofFloat(this, "phaseX", 0f, 1f); animatorX.setDuration( durationMillisX); // make sure only one animator produces update-callbacks (which then // call invalidate()) if (durationMillisX > durationMillisY) { animatorX.addUpdateListener(mListener); } else { animatorY.addUpdateListener(mListener); } animatorX.start(); animatorY.start(); } public void animateXY(int durationMillisX, int durationMillisY, Easing.EasingOption easingX, Easing.EasingOption easingY) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorY = ObjectAnimator.ofFloat(this, "phaseY", 0f, 1f); animatorY.setInterpolator(Easing.getEasingFunctionFromOption(easingY)); animatorY.setDuration( durationMillisY); ObjectAnimator animatorX = ObjectAnimator.ofFloat(this, "phaseX", 0f, 1f); animatorX.setInterpolator(Easing.getEasingFunctionFromOption(easingX)); animatorX.setDuration( durationMillisX); // make sure only one animator produces update-callbacks (which then // call invalidate()) if (durationMillisX > durationMillisY) { animatorX.addUpdateListener(mListener); } else { animatorY.addUpdateListener(mListener); } animatorX.start(); animatorY.start(); } public void animateXY(int durationMillisX, int durationMillisY, EasingFunction easingX, EasingFunction easingY) { if (android.os.Build.VERSION.SDK_INT < 11) return; ObjectAnimator animatorY = ObjectAnimator.ofFloat(this, "phaseY", 0f, 1f); animatorY.setInterpolator(easingY); animatorY.setDuration( durationMillisY); ObjectAnimator animatorX = ObjectAnimator.ofFloat(this, "phaseX", 0f, 1f); animatorX.setInterpolator(easingX); animatorX.setDuration( durationMillisX); // make sure only one animator produces update-callbacks (which then // call invalidate()) if (durationMillisX > durationMillisY) { animatorX.addUpdateListener(mListener); } else { animatorY.addUpdateListener(mListener); } animatorX.start(); animatorY.start(); }
四、缓动动画 (Animation easing)
这个库可以让你对动画应用”缓动函数”。
您可以选择以下预定义的静态 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) 以下时0,总是使用
Easing.EasingOption
。
2) 自定义缓动函数(在 Android 3.0 自定义缓动函数会使应用 crash):
public void animateY(int durationmillis, EasingFunction function);
- Create your own easing functions by creating your own easing-function class and implementing the
EasingFunction
interface :
/** * 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); }
- Then call it this way ( be aware, this will not run below Android 3.0 and crash ) :
// animate both axes with easing mChart.animateY(3000, new MyEasingFunction());
五、Easing.EasingOption 所有效果图
1,2) Linear , EaseInQuad
3,4) EaseOutQuad , EaseInOutQuad
5,6) EaseInCubic , EaseOutCubic
7,8) EaseInOutCubic , EaseInQuart
9,10) EaseOutQuart , EaseInOutQuart
11,12) EaseInSine , EaseOutSine
13,14) EaseInOutSine , EaseInExpo
15,16) EaseOutExpo , EaseInOutExpo
17,18) EaseInCirc , EaseOutCirc
19,20) EaseInOutCirc , EaseInElastic
21,22) EaseOutElastic , EaseInOutElastic
23,24) EaseInBack , EaseOutBack
25,26) EaseInOutBack , EaseInBounce
27,28) EaseOutBounce , EaseInOutBounce
本节完。
- MPAndroidChart 教程:动画 Animations(十)
- MPAndroidChart 教程:动画 Animations(十)
- MPAndroidChart 教程:动画 Animations(十)
- Android动画(Animations)
- 动画Animations
- 【IOS】动画总结:UIView动画(Animations)
- MPAndroidChart 教程:MarkerView(十一)
- MPAndroidChart 教程:MarkerView(十一)
- 翻译:iOS视图控制器编程指南(十)——自定义过渡动画(Customizing the Transition Animations)
- Android 布局动画(Layout Animations)
- android动画效果之Animations(代码实现动画)
- 安卓动画之补间动画(Tween Animations)
- 安卓动画之帧动画(Frame Animations)
- MPAndroidChart 教程:开始 Getting Started(一)
- MPAndroidChart 教程:数据格式器 ValueFormatter(五)
- MPAndroidchart 教程:图例 Legend(七)
- MPAndroidChart 教程:开始 Getting Started(一)
- MPAndroidChart 教程:数据格式器 ValueFormatter(五)
- Face Detection using OpenCV Haarcascades in Android
- 最新AndroidStudio使用教程
- npoi操作excel导出和合并(二)
- Modern C++读书笔记
- ubuntu中apt-get安装与默认路径
- MPAndroidChart 教程:动画 Animations(十)
- js打印object信息
- android jni开发初
- UITableView的关键内容
- 谈谈KMP算法
- 使用Vundle管理配置Vim基本插件
- Spring一IOC(设值注入)
- C++中placement new操作符(经典)
- Unsupported major.minor version 51.0