android - 倒计时应用程序动画

Question

我正在创建倒计时应用程序。我完成了所有代码并且一切正常，但我是 android 动画的新手。我需要将以下动画应用到我的应用程序。我尝试使用滑入/滑出，但效果不佳我还尝试了一些其他动画，但与下面的动画相比没有什么不同。

一旦按下播放按钮，计时器启动，然后再次按下暂停按钮，暂停图标下方的 textView 显示当前倒计时时间。如果再次按下计数重新开始。我只是在寻找我已经完成的所有其他代码的动画。我有一个 ImageButton 显示图标，每个计时器用户按下播放/暂停和 TextView 显示倒数计时器和另一个 TextView 当用户按下时显示当前计时器按暂停按钮。无论如何我可以将这个动画实现到应用程序吗？

所以任何帮助都会被挪用，因为我是 android 动画的新手。谢谢!

这是 xml:

 <FrameLayout
        android:layout_width="228dp"
        android:layout_height="228dp"
        android:layout_marginTop="7dp"
        android:layout_marginLeft="7dp"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="8dp"
        android:id="@+id/circlea"
        android:visibility="visible"

        android:background="@drawable/circle">

 <ImageButton
     android:layout_width="142dp"
     android:layout_height="142dp"
     android:layout_marginTop="43dp"
     android:layout_marginBottom="43dp"
     android:layout_marginLeft="43dp"
    android:id="@+id/play"
     android:background="#000"
     android:layout_marginRight="43dp"
     android:src="@mipmap/icon"
     android:visibility="visible" />
        <TextView
            android:layout_width="134dp"
            android:layout_height="73dp"
            android:text=""
            android:textColor="#FFFFFF"
            android:textSize="55sp"
            android:layout_marginTop="78dp"
            android:layout_marginStart="48dp"
            android:id="@+id/countText"
            android:fontFamily="sans-serif-light"
            android:background="#000"
            android:visibility="invisible" />
        <TextView
            android:layout_marginTop="180dp"
            android:layout_marginLeft="90dp"
            android:text=""
            android:id="@+id/pusetext"
            android:textSize="24sp"
            android:textColor="#1EFFFFFF"
            android:layout_width="61dp"
            android:layout_height="32dp" />

    </FrameLayout>

Java:

//some code
 super.onCreate(savedInstanceState);
play=(ImageButton)findViewById(R.id.play);
pausetext=(TextView) findViewById(R.id.pusetext);
CountText=(TextView)findViewById(R.id.countText);
play.OnClickListener startListener = new View.OnClickListener() {//first public void onClick( View v ){
 play.setVisibility(View.INVISIBLE);
 CountText.setVisibility(View.VISIBLE);

ObjectAnimator slideDownAnimTextView = ObjectAnimator.ofFloat(CountText, "translationY", -(CountText.getTop() + CountText.getHeight()), 0);
            slideDownAnimTextView.start();
}
CountText.setOnClickListener
 public void onClick( View v ){//pause click
play.setVisibility(View.VISIBLE);
ObjectAnimator slideDownAnimPlayButton = ObjectAnimator.ofFloat(play, "translationY", -(play.getTop() + play.getHeight()), 0);

            ObjectAnimator scaleDownAnimTextViewX = ObjectAnimator.ofFloat(CountText, "scaleX", 1f, 0.5f);
            ObjectAnimator scaleDownAnimTextViewY = ObjectAnimator.ofFloat(CountText, "scaleY", 1f, 0.5f);
            AnimatorSet animatorSet = new AnimatorSet();
            animatorSet.setDuration(1000);
            animatorSet.playTogether(slideDownAnimPlayButton,scaleDownAnimTextViewX,scaleDownAnimTextViewY);
            animatorSet.start();
}
 play.setOnClickListener
public void onClick(View view) {resume click
play.setVisibility(View.INVISIBLE);
            CountText.setVisibility(View.VISIBLE);
}
CountText.setOnClickListener(new View.OnClickListener() //pause click agine
                @Override
                public void onClick(View view) {

//some code

Answer 1

您可以使用 HTextView库实现动画的第一部分(显示文本)。然后，使用 ObjectAnimator 向下滑动和缩放文本，并向下滑动播放按钮(使用 AnimatorSet 将它们一起播放)。

这是一个示例代码(当然，您应该根据需要更改值)-

ObjectAnimator slideDownAnimPlayButton = ObjectAnimator.ofFloat(play, "translationY", -(CountText.getTop()), 0); 
ObjectAnimator slideDownAnimTextView = ObjectAnimator.ofFloat(CountText, "translationY",0, (CountText.getTop() )); 
ObjectAnimator scaleDownAnimTextViewX = ObjectAnimator.ofFloat(CountText, "scaleX", 1f, 0.5f); 
ObjectAnimator scaleDownAnimTextViewY = ObjectAnimator.ofFloat(CountText, "scaleY", 1f, 0.5f);
AnimatorSet animatorSet = new AnimatorSet();
animatorSet.setDuration(1000);
animatorSet.playTogether(slideDownAnimPlayButton,slideDownAnimTextView,scaleDownAnimTextViewX,scaleDownAnimTextViewY);
animatorSet.start();

编辑:现在看到你的新代码，第一个文字动画的问题是你从onCreate()调用它，所以View还没有绘制，也就是说他没有有效的高度或顶部参数。您可以通过给动画一个小延迟或使用 ViewTreeObserver 来解决它。请参阅以下示例 -

延迟启动动画 -

new Handler().postDelayed(new Runnable() {
    @Override
    public void run() {
        ObjectAnimator slideDownAnimTextView = ObjectAnimator.ofFloat(CountText, "translationY", -(CountText.getTop() + CountText.getHeight()), 0);
        slideDownAnimTextView.start();
    }
}, 300);

或者，也许更好的方法是使用 ViewTreeObserver -

CountText.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {
        CountText.getViewTreeObserver().removeOnGlobalLayoutListener(this);
        ObjectAnimator slideDownAnimTextView = ObjectAnimator.ofFloat(CountText, "translationY", -(CountText.getTop() + CountText.getHeight()), 0);
        slideDownAnimTextView.start();
    }
});