在 Android 使用动画,除了属性动画比较好用,还有 Facebook-Rebound 的动画效果,今天就来通过几个小的动画效果来初步了解以下 Facebook-Rebound 。下面是效果图:
效果十分的酷炫,下面就来看一下如何实现的;上面一共有三个动画效果,下面就来分别看一下
Facebook-Rebound 官网:http://facebook.github.io/rebound/
GitHub 下载地址:https://github.com/wuqingsen/Facebook-Rebound
1. Facebook-Rebound 第一种动画效果
在使用前~需要添加 Gradle :
compile 'com.facebook.rebound:rebound:0.3.8'
//Facebook-Rebound
private void One() {
ViewGroup viewGroup = (ViewGroup) findViewById(R.id.chain_layout);
viewGroup.setVisibility(View.VISIBLE);
//创建SpringChain对象
SpringChain springChain = SpringChain.create();
//获取到子控件
int childCount = viewGroup.getChildCount();
for (int i = 0; i < childCount; i++) {
final View view = viewGroup.getChildAt(i);
springChain.addSpring(new SimpleSpringListener() {
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
//只设置沿X轴
view.setTranslationX(value);
}
});
}
List<Spring> springs = springChain.getAllSprings();
for (int i = 0; i < springs.size(); i++) {
springs.get(i).setCurrentValue(1080);
}
//setControlSpringIndex:从第几个子view开始
springChain.setControlSpringIndex(0);
//设置结束的位置,
springChain.getControlSpring().setEndValue(0);
}
代码中加入上面方法并调用方法即可;
2. Facebook-Rebound 第二种动画效果:弹簧效果
//Facebook-Rebound弹簧
private void Two() {
//创建SpringSystem对象
SpringSystem springSystem = SpringSystem.create();
//添加到弹簧系统
Spring spring = springSystem.createSpring();
spring.setCurrentValue(1.0f);
//tension(拉力)值改成100(拉力值越小,晃动越慢),friction(摩擦力)值改成1(摩擦力越小,弹动大小越明显)
spring.setSpringConfig(SpringConfig.fromOrigamiTensionAndFriction(100, 1));
//与上面一样,回弹效果更明显,但速度慢
// spring.setSpringConfig(new SpringConfig(100, 1));
spring.addListener(new SimpleSpringListener() {
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
float scale = 1f - (value * 0.5f);
imageView.setScaleX(scale);
imageView.setScaleY(scale);
}
});
spring.setEndValue(0.1f);
}
复制上面的方法并调用即可,上面的大部分属性在注释中已经写明白了,还有很多属性,我也并不是很懂,要深入探索~~
3. 属性动画实现弹簧的效果
在上面效果图中就可以看出,Facebook-Rebound 弹簧效果要比属性动画实现的效果要好多了,所以这里也不多说了,但属性动画还是比较常用的,想了解更多属性动画
//属性动画
private void Three() {
/**
* 五个参数:
* 1.要放大/缩小的控件
* 2.方向:scaleX为沿X轴缩放,scaleY为沿Y轴缩放
* 3.开始的大小:1.0f为原图开始
* 4.放大/缩小的倍数:1.5f为放大1.5倍
* 5.结束的大小:1.0f为原图结束
*/
ObjectAnimator animatorX = ObjectAnimator.ofFloat(imageView, "scaleX", 1.0f, 1.5f, 1f);
ObjectAnimator animatorY = ObjectAnimator.ofFloat(imageView, "scaleY", 1.0f, 1.5f, 1f);
AnimatorSet set = new AnimatorSet();
//动画持续时间
set.setDuration(1000);
//动画弹动的速度,越大越慢
set.setInterpolator(new SpringScaleInterpolator(0.3f));
//X轴和Y轴同时开始
set.playTogether(animatorX, animatorY);
//动画开始
set.start();
}
代码中加入上面方法并调用方法即可;