在写动画相关的需求时,我总是忘记动画移动的规则,写了移动多少位置,但是效果和想象中的不一样。原因是对坐标系以及有些规则不是很了解。
首先了解一下动画世界里面的坐标规则:
首先动画的坐标系是以左上角为原点,无论是屏幕的左上角还是布局本身的左上角,反正就是左上角。然后往下来,往右来,数值都是加一。我想看到这里你心里已经默默地比划好了一套正确的坐标系了。
- 绝对坐标
很明显是以屏幕左上角为原点,绝对坐标。比如一个布局的左上角在(50, 50),让其移动–> [100, 100]–>[-30, -30] 这样的轨迹(简写哈,意思是先向X向Y移动100, 100, 再向X向Y移动-30,-30。 移动个 [100, 100], 再移动个[-30, -30], 记住每次都是移动到原点的某个位置,,例如第一次[100, 100] 就是移动到相对屏幕左上角位置的 100, 100 位置,以此类推下去,最终位置是整个屏幕的 -30,-30。 - 相对于自己
相对于自己,也就是相对于自己布局的左上角,以上一条介绍的为例,还是那个布局,原点是(50, 50), 让其移动[100, 100]–>[-30,-30],结果会变成 (150, 150) , 然后此时的布局左上角坐标其实变成了150,150。之后再移动(-30, -30)结果是 (120,120). - 相对于父布局
相对于父布局,也很简单。假设当前控件的父布局左上角坐标是 (20,20), 那么以父布局原点为标准,同样移动[100,100]–> [-30,-30]结果会成为(120,120), (-10, -10)
看吧,对比的坐标系不同,结果大不同。所以即使你不懂具体的规则,只要你记住这三种坐标系的特点,写代码的时候,即使现象不正常,也是可以反推过去,究竟依据的是那种相对方式计算的
那么如果有什么方式让我们一眼看出是用的什么依据就更好了。然而目前我还没有摸清规律啊啊啊!
属性动画
xml中的属性动画
首先有一种简略的方式可以看出使用的那种相对依据的:
当值为"50",表示使用绝对位置定位
当值为"50%",表示使用相对于控件本身定位
当值为"50%p",表示使用相对于控件的父控件定位
但是有的时候你看不出来啥,例如下方的xml,说实话,遇到这种情况,试一下,再按照以前的方式反推即可。
1
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="200">
<objectAnimator
android:propertyName="translationY"
android:duration="200"
android:valueFrom="500dp"
android:valueTo="0dp"
android:interpolator="@android:anim/bounce_interpolator" />
</set>
这种情况,我也是反推出来的,此时的 value其实用的是相对于View自身的坐标。500 是相对于布局左上角的向下500dp,0就是相对于原来布局左上角的0dp位置。其实正好是一个从下往上弹出的动画。明白了吧!!
以后出了新的需求碰到了再总结!
ObjectAnimator这个类
用到这种类的时候,我们一般这样写:
ObjectAnimator animator = ObjectAnimator.ofFloat(getmRootView(), "translationX", 0, -rootWidth, -rootWidth + w);
animator.setDuration(300)
.setInterpolator(new AccelerateDecelerateInterpolator());
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
boolean isInvisibility = false;
@Override
public void onAnimationUpdate(ValueAnimator animation) {
if (animation.getAnimatedFraction() >= 0.5 && !isInvisibility) {
mRightBackImage.setVisibility(View.VISIBLE);
mContentPanel.setVisibility(View.INVISIBLE);
isInvisibility = true;
}
}
});
animator.start();
无论是哪种相对路径,针对的都是最开始的右上角坐标。没有什么过程可言。
首先我也不讲杂七杂八的了,这里面的属性参数,用的是相对坐标,是相对于自己的
但是我经常忘了属性的名称怎么写,不过有个很便捷的方法就是,搜索RenderNode类 nSetTranslationX()方法附近,这里面有所有属性所对应的名字,类型。