倒数app动画

时间:2016-09-29 06:06:03

标签: android android-animation

我正在创建倒计时应用。我完成了所有代码,它的工作非常好,但我是Android动画的新手。我需要将以下动画应用到我的应用程序中。我试过使用幻灯片输入/输出,但它不能正常工作我也尝试过其他一些动画,但是下面的动画比较没什么。

一旦按下播放按钮,计时器就会启动,然后再次按下一个暂停按钮,暂停图标下的textView我们有当前的倒计时时间。如果再次按下计数再次开始。我只是在寻找动画我已经完成的所有其他代码。 我有一个ImageButton显示每个计时器用户按下播放/暂停的图标,TextView显示倒数计时器,另一个TextView显示当用户按下暂停按钮时的当前计时器。无论如何我可以将此动画实施到app?

所以任何帮助都会被挪用,因为我是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

1 个答案:

答案 0 :(得分:2)

您可以使用java.sql.Time库来实现动画的第一部分(显示文本)。 然后,使用ObjectAnimator s向下滑动和缩放文本,然后向下滑动播放按钮(使用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()调用它,因此尚未绘制视图,这意味着他没有有效的高度或顶部参数。 您可以通过给动画稍微延迟或使用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();
    }
});