中心矢量与动画 [英] Center vector with animation

问题描述

单击后，我试图将其缩放为更大的矢量，但它的位置始终在视口区域的左上角，但我想使其居中，而动画应使其从底部的中心.我正在使用数据透视，但无济于事.这是我的代码:

I have vector which I'm trying to scale into bigger after click on it, but its position is always in the top left corner of viewport area but I want to have it in the center, and animation should make it bigger from center of the bottom. I'm using pivot but it doesn't help. This is my code:

活动:

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_baloon);
  androidImageView = (ImageView) findViewById(R.id.animated);
  if (androidImageView != null) {
    androidImageView.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View v) {
        if (isBig) {
          animateDown();
          isBig = false;
        } else {
          animateUp();
          isBig = true;
        }
      }
    });
  }
}

private void animateUp() {
  ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(androidImageView, "scaleX", 1.5f);
  ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(androidImageView, "scaleY", 1.5f);

  scaleDownX.setDuration(300);
  scaleDownY.setDuration(300);

  AnimatorSet scaleDown = new AnimatorSet();


  scaleDown.play(scaleDownX).with(scaleDownY);
  scaleDown.start();
}

private void animateDown() {
  ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(androidImageView, "scaleX", 1.0f);
  ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(androidImageView, "scaleY", 1.0f);

  scaleDownX.setDuration(300);
  scaleDownY.setDuration(300);

  AnimatorSet scaleDown = new AnimatorSet();

  scaleDown.play(scaleDownX).with(scaleDownY);
  scaleDown.start();
}

布局:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/black"
    >
<RelativeLayout
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        android:background="@android:color/white"
        >

<ImageView
            android:id="@+id/animated"
            android:layout_width="100dp"
            app:srcCompat="@drawable/animated_baloon"
            android:layout_height="100dp"
            android:layout_centerInParent="true"
            />
</RelativeLayout>

vector:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="48dp"
    android:viewportHeight="327.5"
    android:viewportWidth="262.36"
    android:width="48dp"

    >
<group
        android:name="android"
        android:pivotX="163.75"
        android:pivotY="131.18"
        >
    <path
            android:fillColor="#FDC500"
            android:pathData="M-0.01,32.82a32.81,32.81 0,1 1,65.61 0c0,28.94 -32.8,49.04 -32.8,49.04S-0.01,61.77 -0.01,32.82Z"
            />
</group>

推荐答案

您需要使用视口的高度和宽度，而不是android:height和width.

You need to use the viewport height and width, not the android:heightand width.

<vector xmlns:android="http://schemas.android.com/apk/res/android"
  android:height="24dp"
  android:viewportHeight="81.875"
  android:viewportWidth="32.795"
  android:width="24dp">

  <!--  <group name="dot_name"
      pivotX="viewportHeight / 2"
      pivotY="viewportWidth / 2">  Calculate the values by yourself, write the calucalted values in there. This moves the reference point to the middle -->

  <group name="dot_name"
         pivotX="40.9375"
         pivotY="viewportWidth / 2">

    <path
        android:fillColor="#FF000000"
        android:pathData="M-0.01,32.82a32.81,32.81 0,1 1,65.61 0c0,28.94 -32.8,49.04 -32.8,49.04S-0.01,61.77 -0.01,32.82Z" />

  </group>

</vector>

这篇关于中心矢量与动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！