Question

我尝试用UX和动画进行一些测试。我想点击一个按钮来展开它，直到按钮具有其父布局的大小。这是我非常简单的界面：

我成功创建了自己的动画，它只是一个简单的类，它接受了开始X，结束X，开始Y和结束Y.这是类：

import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Transformation;

public class ExpandAnimation extends Animation {
    protected final View view;
    protected float perValueH, perValueW;
    protected final int originalHeight, originalWidth;

    public ExpandAnimation(View view, int fromHeight, int toHeight, int fromWidth, int toWidth) {
        this.view = view;
        this.originalHeight = fromHeight;
        this.originalWidth = fromWidth;
        this.perValueH = (toHeight - fromHeight);
        this.perValueW = (toWidth - fromWidth);
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        view.getLayoutParams().height = (int) (originalHeight + perValueH * interpolatedTime);
        view.getLayoutParams().width = (int) (originalWidth + (perValueW * interpolatedTime)*2);
        view.requestLayout();
    }

    @Override
    public boolean willChangeBounds() {
        return true;
    }
}

动画非常好，按预期工作：

这是我的主循环：

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
    private Button left;

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

        left = (Button) findViewById(R.id.left);
        left.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        left.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                ViewGroup parent = (ViewGroup) view.getParent();
                ExpandAnimation animation = new ExpandAnimation(view, view.getBottom(), parent.getTop(), view.getLeft(), parent.getRight());
                animation.setDuration(3000);
                animation.setFillAfter(true);
                view.startAnimation(animation);
            }
        });
    }
}

但我有3个主要问题：

首先，文字消失了，我不知道为什么......
另一方面，我希望我的动画能够超越其他人的观点，但是当我尝试它不起作用时，我怎么能达到这个目的呢？
最后但并非最不重要的是，在我的动画结束时，按钮消失了，只有一个丑陋的人工制品......我怎么能避免这个？

修改：我的布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="MainActivity">

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:weightSum="3"
        android:padding="15dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:gravity="bottom">

        <Button
            android:id="@+id/left"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Retenter"
            android:textSize="15dp"
            android:textColor="#FFF"
            android:background="#FF33CC44" />

    </LinearLayout>
</RelativeLayout>

Edit2：出现在动画末尾的人工制品是由方法setLayerType（View.LAYER_TYPE_SOFTWARE，null）引起的。

Answer 1

@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
    view.getLayoutParams().height = (int) (originalHeight + perValueH * interpolatedTime);
    view.getLayoutParams().width = (int) (originalWidth + (perValueW * interpolatedTime));
    view.requestLayout();
}

删除* 2将在下面显示。

Android按钮单击时展开动画

1 个答案: