对于连锁动画，虽然可以针对单个设计动画达到连锁动画的目的，但是太繁琐。Rebound当中是提供了连锁动画功能的。
先来看一下连锁动画的基本用法,为了看出效果，我这边使用了3个imageView
基本代码
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
img1 = findViewById(R.id.img1);
img2 = findViewById(R.id.img2);
img3 = findViewById(R.id.img3);
img1.setOnClickListener(this);
img2.setOnClickListener(this);
img3.setOnClickListener(this);
}
@Override
public void onClick(View v) {
SpringChain springChain = SpringChain.create();
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img1.setScaleX(value);
img1.setScaleY(value);
}
});
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img2.setScaleX(value);
img2.setScaleY(value);
}
});
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img3.setScaleX(value);
img3.setScaleY(value);
}
});
springChain.getAllSprings().get(0).setEndValue(1);
springChain.getAllSprings().get(1).setEndValue(1);
springChain.getAllSprings().get(2).setEndValue(1);
}用法上和单个用法基本一样都是通过SpringListener，另外也要设置所有的Spring的EndValue，当然StartValue也可以设置，这边不设置就默认0开始。
效果图:
发现第一个img动画最快，下面依次递减。原来Rebound中有这样一个设计，动画链当中有一个主动画，其他的为辅动画。不难看出，这边主动画是第一个，后面两个为辅。
再来个用法
@Override
public void onClick(View v) {
SpringChain springChain = SpringChain.create(40,6,80,5);//注意这一块与上面不同
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img1.setScaleX(value);
img1.setScaleY(value);
}
});
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img2.setScaleX(value);
img2.setScaleY(value);
}
});
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img3.setScaleX(value);
img3.setScaleY(value);
}
});
springChain.getAllSprings().get(0).setEndValue(1);
springChain.getAllSprings().get(1).setEndValue(1);
springChain.getAllSprings().get(2).setEndValue(1);
}这边使用了SpringChain.create(40,6,80,5);这个构造方法。
看下原代码public static SpringChain create( int mainTension, int mainFriction, int attachmentTension, int attachmentFriction) { return new SpringChain(mainTension, mainFriction, attachmentTension, attachmentFriction); }
顺便看一下无参的public static SpringChain create() { return new SpringChain(); } private SpringChain() { this( DEFAULT_MAIN_TENSION, DEFAULT_MAIN_FRICTION, DEFAULT_ATTACHMENT_TENSION, DEFAULT_ATTACHMENT_FRICTION); } private static final int DEFAULT_MAIN_TENSION = 40; private static final int DEFAULT_MAIN_FRICTION = 6; private static final int DEFAULT_ATTACHMENT_TENSION = 70; private static final int DEFAULT_ATTACHMENT_FRICTION = 10;
原来无参构造函数也是调用的有参构造，40,6,70,10都是默认值。
效果图:
大概研究了一下这些参数的意义
mainTension 主动画的弹力
mainFriction 主动画的阻力
attachmentTension 辅助动画的弹力
attachmentFriction 辅助动画的阻力
而且主动画较快运行，而其他动画依次延迟了些
@Override
public void onClick(View v) {
SpringChain springChain = SpringChain.create(40,6,10,1);
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img1.setScaleX(value);
img1.setScaleY(value);
}
});
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img2.setScaleX(value);
img2.setScaleY(value);
}
});
springChain.addSpring(new SimpleSpringListener(){
@Override
public void onSpringUpdate(Spring spring) {
float value = (float) spring.getCurrentValue();
img3.setScaleX(value);
img3.setScaleY(value);
}
});
springChain.getAllSprings().get(0).setEndValue(1);
springChain.getAllSprings().get(1).setEndValue(1);
springChain.getAllSprings().get(2).setEndValue(1);
springChain.setControlSpringIndex(1);//这边与上面不同，设置了主动画索引位置，为第二个动画
}
效果图:
原来以主动画为中心，动画会进行延迟扩散。