FloatingActionButton图标动画(Android FAB src可绘制动画)

时间:2015-07-18 03:38:04

标签: android animation icons floating-action-button

我试图找到有关如何创建FAB(设计支持库)的图标动画的文档,经过一段时间的搜索,我无法找到有关它的任何信息以及android中的AnimationDrawable引用即使该课程是ImageView的孩子,开发人员也不会为FAB工作。

但设法得到一个工作正常的解决方法。

2 个答案:

答案 0 :(得分:14)

我使用的技术类似于DrawableAnimation文档中公开的技术,并使用Property Animation API文档。

首先,我使用ValueAnimator类,以及一个int数组,其中包含您将在动画中使用的drawable的id。

    final int[] ids = {R.drawable.main_button_1,R.drawable.main_button_2,R.drawable.main_button_3,R.drawable.main_button_4,R.drawable.main_button_5,R.drawable.main_button_6, R.drawable.main_button_7};
    fab = (FloatingActionButton) findViewById(R.id.yourFabID);
    valueAnimator = ValueAnimator.ofInt(0, ids.length - 1).setDuration(yourAnimationTime);
    valueAnimator.setInterpolator( new LinearInterpolator() /*your TimeInterpolator*/ );

然后设置一个AnimationUpdateListener,并使用方法FloatinActionButton.setImageDrawable(Drawable yourDrawable)定义图标行为的变化。

然而,ValueAnimator默认更新每个可用帧(取决于硬件中的负载),但如果已经绘制了图标,我们不需要重绘图标,这就是我使用变量“i”的原因;因此,一旦图标被下一个图标替换,代码就会等到下一个图标被绘制的时候。 (时间取决于您定义的插补器)

valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        int i = -1;
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            int animatedValue = (int) animation.getAnimatedValue();
            if(i!=animatedValue) {
                fab.setImageDrawable(getResources().getDrawable(ids[animatedValue]));
                i = animatedValue;
            }
        }
    });

使用方法ValueAnimator.reverse();

向后播放动画时也很有用

我知道这不是一个专业的解决方案,但它是我唯一能够解决支持PropertyAnimation的所有API的工具。如果您知道更好的解决方案,请在此处发布,如果不是,我希望这篇文章有用

答案 1 :(得分:1)

与将background用于AnimationDrawable的其他视图一样,您可以实现FAB的src可绘制动画。

有关一般视图的背景可绘制动画,请参见Use AnimationDrawable

但是,您无法致电getBackground()来获取FAB的src

请使用getDrawable()

示例:

        FloatingActionButton loginButton = findViewById(R.id.loginButton);
        loginAnimation = (AnimationDrawable) loginButton.getDrawable();

        loginButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                loginAnimation.start();
            }
        });