FloatingText 是一个能够在任何控件之上执行漂浮效果动画的控件,
目前已有的漂浮效果有 '位移漂浮' ,'缩放漂浮','曲线路径漂浮',更重要的是 FloatingText 能够自定义漂浮效果.
需要在 Android 3.0 以上
- 使用 FloatingText.FloatingTextBuilder 去创建一个FloatingText,通过FloatingTextBuilder可以配置下面几个属性:
FloatingText floatingText = new FloatingText.FloatingTextBuilder(Activity)
.textColor(Color.RED) // 漂浮字体的颜色
.textSize(100) // 浮字体的大小
.textContent("+1000") // 浮字体的内容
.offsetX(100) // FloatingText 相对其所贴附View的水平位移偏移量
.offsetY(100) // FloatingText 相对其所贴附View的垂直位移偏移量
.floatingAnimatorEffect(FloatingAnimator) // 漂浮动画
.floatingPathEffect(FloatingPathEffect) // 漂浮的路径
.build();
floatingText.attach2Window(); //将FloatingText贴附在Window上
2.启动漂浮效果
floatingText.startFloating(View); // 传入一个View,FloatingText 就会相对于这个View执行漂浮效果
FloatingText的坐标依赖于你所贴附的View 即:startFloating(View)中的View.
通过实现 FloatingAnimator
接口可以实现自定义漂浮动画:
public interface FloatingAnimator {
public void applyFloatingAnimation(FloatingTextView view);
}
ReboundFloatingAnimator
实现了 FloatingAnimator 并提供回弹功能,ReboundFloatingAnimator 使用 Facebook 的回弹动画库 Rebound。
- 使用
createSpringByBouncinessAndSpeed
配置回弹动画的弹力和速度,并创建Spring。 - 使用
createSpringByTensionAndFriction
配置回弹动画的张力和摩擦力,并创建Spring - 调用
transition(float progress, float startValue, float endValue)
并传入当前动画的进度,动画的起始值,结束值可以获取当前的动画值
目前库内的 ScaleFloatingAnimator ,TranslateFloatingAnimator,BaseFloatingPathAnimator都是实现了 ReboundFloatingAnimator
。
例如 缩放回弹效果: ScaleFloatingAnimator
public class ScaleFloatingAnimator extends ReboundFloatingAnimator {
public long duration;
public ScaleFloatingAnimator() {
duration = 1000;
}
public ScaleFloatingAnimator(long duration) {
this.duration = duration;
}
@Override
public void applyFloatingAnimation(final FloatingTextView view) {
Spring scaleAnim = createSpringByBouncinessAndSpeed(10, 15)
.addListener(new SimpleSpringListener() {
@Override
public void onSpringUpdate(Spring spring) {
float transition = transition((float) spring.getCurrentValue(), 0.0f, 1.0f);
view.setScaleX(transition);
view.setScaleY(transition);
}
});
ValueAnimator alphaAnimator = ObjectAnimator.ofFloat(1.0f, 0.0f);
alphaAnimator.setDuration(duration);
alphaAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
view.setAlpha((Float) valueAnimator.getAnimatedValue());
}
});
scaleAnim.setEndValue(1f);
alphaAnimator.start();
}
}
通过实现 FloatingPathEffect
和 FloatingPathAnimator
可以自定义路径动画
FloatingPath
代表浮动路径
public interface FloatingPathEffect {
abstract FloatingPath getFloatingPath(FloatingTextView floatingTextView);
}
使用 Path 创建路径,并调用 FloatingPath.create(Path path, boolean forceClose) 创建一个漂浮路径。 其中 forceClose 代表是否对路径进行闭合处理,一般情况下为 false。
例如:CurveFloatingPathEffect 实现了曲线路径效果:
public class CurveFloatingPathEffect implements FloatingPathEffect {
@Override
public FloatingPath getFloatingPath(FloatingTextView floatingTextView) {
Path path = new Path();
path.moveTo(0, 0);
path.quadTo(-100, -200, 0, -300);
path.quadTo(200, -400, 0, -500);
return FloatingPath.create(path, false);
}
}
当使用 FloatingPathEffect
定义完 路径后,就可以实现 BaseFloatingPathAnimator
来执行路径动画
例如 CurvePathFloatingAnimator
的效果是曲线漂浮动画:
public class CurvePathFloatingAnimator extends BaseFloatingPathAnimator {
@Override
public void applyFloatingPathAnimation(final FloatingTextView view, float start, float end) {
ValueAnimator translateAnimator = ObjectAnimator.ofFloat(start, end);
translateAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
float value = (float) valueAnimator.getAnimatedValue();
float pos[] = getFloatingPosition(value);
float x = pos[0];
float y = pos[1];
view.setTranslationX(x);
view.setTranslationY(y);
}
});
translateAnimator.setDuration(3000);
translateAnimator.setStartDelay(50);
translateAnimator.start();
}
}
-
在
applyFloatingPathAnimation(final FloatingTextView view, float start, float end)
实现路径动画。参数 start 代表路径的开始位置,end代表路径的结束位置. -
通过
getFloatingPosition(float progress)
可以获取当前路径的位置信息 [0]代表x值,[1]代表y值