动画:缩放按钮以扩展到屏幕顶部
Animation: Scaling Button to extend to top of screen
我有一个像这样的简单布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@android:color/white"
android:orientation="vertical" >
<TextView
android:id="@+id/tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="My TextView" />
<Button
android:id="@+id/button"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Button" />
</LinearLayout>
单击此按钮后,我将 TextView 设置为超出屏幕顶部的动画。我用这段代码这样做:
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends ActionBarActivity {
TextView tv;
Animation mSlideOutTop;
Button button;
boolean in = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv = (TextView) findViewById(R.id.tv);
button = (Button) findViewById(R.id.button);
mSlideOutTop = AnimationUtils.loadAnimation(this, R.anim.slide_out_top);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
in = true;
tv.startAnimation(mSlideOutTop);
tv.setVisibility(View.INVISIBLE);
}
});
}
}
我的动画在哪里 slide_out_top.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="600"
android:fromYDelta="0%"
android:toYDelta="-100%" />
</set>
所以我的问题是:当 TextView 以动画形式离开屏幕时,我需要将按钮扩展到屏幕顶部。现在,TextView 动画消失了,它原来的 space 仍然是空的,像这样:
关于如何做到这一点有什么想法吗?谢谢!
要完成您想要做的事情,请在滑出动画结束时将 TextView 的可见性设置为 GONE。类似于:
tv.setVisibility(View.GONE);
使用 GONE 而不是 INVISIBLE 将 Android 执行布局操作,就好像视图不存在一样,谢天谢地,这是实现您正在寻找的最容易可逆的方式 - 换句话说, 您可以稍后将其设置回 VISIBLE,按钮将 return 恢复为原始大小。
然后您只需要找出一种方法来为该方法调用计时。一种方法是将它放在一个 Runnable 中并调用 Handler.postDelayed(theRunnable, 600);
,尽管我个人更喜欢使用 ViewPropertyAnimators,因为你可以为它们分配一个 Runnable 以在它们结束时执行(调用 ViewPropertyAnimator.withEndAction(theRunnable);
来执行此操作)并且它会计算给你。
这样做,您的动画代码将如下所示:
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv = (TextView) findViewById(R.id.tv);
button = (Button) findViewById(R.id.button);
// mSlideOutTop not used
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
animateRemoval(v);
in = true;
// Do NOT set visibility to ANYTHING in here
}
});
}
private void animateRemoval(final View toRemove) {
// The method .animate() creates a ViewPropertyAnimator.
toRemove.animate()
.setDuration(600) // Previously defined in slide_out_top.xml
.translationY(1000) // Tweak this number to fit the direction/amplitude, I'm talking a wild guess
.withEndAction(new Runnable() { // Stuff in here runs AFTER the animation.
@Override
public void run() {
// It is critical that this method be executed AFTER the animation, because it
// will cause a layout to occur, and executing layouts during animation is bad news bears.
toRemove.setVisibility(View.GONE);
}
});
}
我有一个像这样的简单布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@android:color/white"
android:orientation="vertical" >
<TextView
android:id="@+id/tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="My TextView" />
<Button
android:id="@+id/button"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Button" />
</LinearLayout>
单击此按钮后,我将 TextView 设置为超出屏幕顶部的动画。我用这段代码这样做:
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.TextView;
public class MainActivity extends ActionBarActivity {
TextView tv;
Animation mSlideOutTop;
Button button;
boolean in = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv = (TextView) findViewById(R.id.tv);
button = (Button) findViewById(R.id.button);
mSlideOutTop = AnimationUtils.loadAnimation(this, R.anim.slide_out_top);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
in = true;
tv.startAnimation(mSlideOutTop);
tv.setVisibility(View.INVISIBLE);
}
});
}
}
我的动画在哪里 slide_out_top.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="600"
android:fromYDelta="0%"
android:toYDelta="-100%" />
</set>
所以我的问题是:当 TextView 以动画形式离开屏幕时,我需要将按钮扩展到屏幕顶部。现在,TextView 动画消失了,它原来的 space 仍然是空的,像这样:
关于如何做到这一点有什么想法吗?谢谢!
要完成您想要做的事情,请在滑出动画结束时将 TextView 的可见性设置为 GONE。类似于:
tv.setVisibility(View.GONE);
使用 GONE 而不是 INVISIBLE 将 Android 执行布局操作,就好像视图不存在一样,谢天谢地,这是实现您正在寻找的最容易可逆的方式 - 换句话说, 您可以稍后将其设置回 VISIBLE,按钮将 return 恢复为原始大小。
然后您只需要找出一种方法来为该方法调用计时。一种方法是将它放在一个 Runnable 中并调用 Handler.postDelayed(theRunnable, 600);
,尽管我个人更喜欢使用 ViewPropertyAnimators,因为你可以为它们分配一个 Runnable 以在它们结束时执行(调用 ViewPropertyAnimator.withEndAction(theRunnable);
来执行此操作)并且它会计算给你。
这样做,您的动画代码将如下所示:
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv = (TextView) findViewById(R.id.tv);
button = (Button) findViewById(R.id.button);
// mSlideOutTop not used
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
animateRemoval(v);
in = true;
// Do NOT set visibility to ANYTHING in here
}
});
}
private void animateRemoval(final View toRemove) {
// The method .animate() creates a ViewPropertyAnimator.
toRemove.animate()
.setDuration(600) // Previously defined in slide_out_top.xml
.translationY(1000) // Tweak this number to fit the direction/amplitude, I'm talking a wild guess
.withEndAction(new Runnable() { // Stuff in here runs AFTER the animation.
@Override
public void run() {
// It is critical that this method be executed AFTER the animation, because it
// will cause a layout to occur, and executing layouts during animation is bad news bears.
toRemove.setVisibility(View.GONE);
}
});
}