2016-09-29 74 views
1

我正在创建倒计时应用。我完成了所有的代码和它的所有工作很好,但我是新的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 

回答

2

可以使用HTextView库来实现动画(显示文本)的第一部分。 然后,使用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(); 
    } 
}); 
+0

编辑GIF请看看。谢谢 –

+0

现在有点不清楚,但看起来你只需要扭转动画的第二部分。我建议使用'objectAnimtor.reverse()'。 – Tofira

+0

什么属性我可以用来缩放一个TextView与objectAnimtor下滑动画?一个代码是非常有用的。谢谢 –