Question

我刚刚为自己探索过Vectors，现在想要按下按钮的示例动画：

圈子和嘀嗒声有轻微的轻松输出，并且在移动到最终位置之前蜱变得更大。

我在After Effects中创建了这个动画，并找到了一个非常酷的工具，可以将此权限导出到Android中作为json文件： https://github.com/airbnb/lottie-android

但是这个方法会在我的应用程序中使用另一个插件，那些动画会比Vector Drawable使用更多的空间，而Vector比我想的导入动画更具可扩展性？

那么可以用矢量Drawables做这样的动画吗？或者我对lottie插件好吗？？

修改

所以我想出了以下的解决方案：

YouTube Screen Recording

我用pngs制作了它，但它也适用于矢量，但它真的很修饰。代码：

的java：

public class TestActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_test);

//The light-green transition between the 2 buttons:

    final Button imageView = (Button) findViewById(R.id.imageView); 
//ImageView won't get over a button in the XML


//The green button with tick:

    final Button button_ok = (Button) findViewById(R.id.button_ok);

//The yellow button:

    final Button button = (Button) findViewById(R.id.button);


    button.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View view, MotionEvent motionEvent) {

            show(button_ok, imageView,button, motionEvent);
            return false;
        }
    });
    button_ok.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View view, MotionEvent motionEvent) {

            show(button, null,button_ok, motionEvent);
            return false;
        }
    });


}

// To reveal a previously invisible view using this effect:
private void show(final View view, final View circle, final View tobegone, final MotionEvent me) {

    final Button imageView = (Button) findViewById(R.id.imageView);

    if (circle==null){


        // get the final radius for the clipping circle
        int finalRadius = Math.max(view.getWidth(), view.getHeight());

        // create the animator for this view (the start radius is zero)
        Animator anim = ViewAnimationUtils.createCircularReveal(view, (int) me.getX(), (int) me.getY(),
                0, finalRadius);
        anim.setDuration(100);
        anim.setInterpolator(new FastOutSlowInInterpolator());

        // make the view invisible when the animation is done
        anim.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                imageView.setVisibility(View.INVISIBLE);
                tobegone.setVisibility(View.INVISIBLE);
            }
        });

        // make the view visible and start the animation
        view.setVisibility(View.VISIBLE);
        anim.start();

        return;
    }


    // get the final radius for the clipping circle
    int finalRadiusCircle = Math.max(view.getWidth(), view.getHeight());

    // create the animator for this view (the start radius is zero)
    Animator animcircle = ViewAnimationUtils.createCircularReveal(circle, (int) me.getX(), (int) me.getY(),
            0, finalRadiusCircle);
    animcircle.setDuration(500);
    animcircle.setInterpolator(new FastOutSlowInInterpolator());

    // make the view visible and start the animation
    circle.setVisibility(View.VISIBLE);
    animcircle.start();



    // get the final radius for the clipping circle
    int finalRadius = Math.max(view.getWidth(), view.getHeight());

    // create the animator for this view (the start radius is zero)
    Animator anim = ViewAnimationUtils.createCircularReveal(view, (int) me.getX(), (int) me.getY(),
            0, finalRadius);
    anim.setDuration(1000);
    anim.setInterpolator(new FastOutSlowInInterpolator());

    // make the view invisible when the animation is done
    anim.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            super.onAnimationEnd(animation);
            tobegone.setVisibility(View.INVISIBLE);
        }
    });

    // make the view visible and start the animation
    view.setVisibility(View.VISIBLE);
    anim.start();



    Handler handler = new Handler();

    final Runnable r = new Runnable() {
        public void run() {


        }
    };

    handler.postDelayed(r, 200);

}
}

XML：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#39000000"
tools:layout_editor_absoluteY="81dp"
tools:layout_editor_absoluteX="0dp">

<Button
    android:id="@+id/button"
    android:layout_width="300dp"
    android:layout_height="75dp"
    android:background="@mipmap/add_button_v2"
    tools:layout_editor_absoluteX="42dp"
    tools:layout_editor_absoluteY="420dp" />

<Button
    android:id="@+id/imageView"
    android:layout_width="300dp"
    android:layout_height="75dp"
    android:background="@mipmap/add_button_v2"
    android:backgroundTint="#974caf50"
    android:backgroundTintMode="src_over"
    tools:layout_editor_absoluteX="42dp"
    tools:layout_editor_absoluteY="420dp" />

<Button
    android:id="@+id/button_ok"
    android:layout_width="300dp"
    android:layout_height="75dp"
    android:background="@mipmap/ok_button"
    tools:layout_editor_absoluteX="42dp"
    tools:layout_editor_absoluteY="420dp" />

有没有更好的解决方案？或者我能用这个滚动吗？

如何用圆形显示动画更改按钮背景？

0 个答案: