2016-12-13 84 views
1

因此,我們試圖製作一個動畫,在FAB消失並打開工具欄之前移動FAB。問題是當我運行TranslationAnimation時,FAB消失,然後從屏幕滑出。 fromxDelta和FromDelta從來沒有像我期望的那樣行事。翻譯動畫從屏幕開始而不是它所屬的位置

任何人都可以指出我做錯了什麼或幫助我瞭解這個調用的工作原理嗎?

private void circularReveal(View toolbar, View fab) { 
    final View view1 = toolbar; 

    // get the center for the clipping circle 
    int cx = (toolbar.getLeft() + toolbar.getRight())/2; 
    int cy = (toolbar.getTop() + toolbar.getBottom())/2; 

    // get the final radius for the clipping circle 
    int finalRadius = Math.max(toolbar.getWidth(), toolbar.getHeight()); 

    // create the animator for this view (the start radius is zero) 
    final SupportAnimator anim = ViewAnimationUtils.createCircularReveal(toolbar, cx, cy, 0, finalRadius); 
    //todo create an animation to move the fab. 

    TranslateAnimation translateAnimation = new TranslateAnimation(Animation.ABSOLUTE, 0f, 
                   Animation.ABSOLUTE , -100f, 
                   Animation.ABSOLUTE , 0f, 
                   Animation.ABSOLUTE , -100f); 
    translateAnimation.setDuration(2000L); 
    translateAnimation.setFillAfter(true); 
    Animation.AnimationListener animationListener = new Animation.AnimationListener() { 

     @Override 
     public void onAnimationStart(Animation animation) { 

     } 

     @Override 
     public void onAnimationEnd(Animation animation) { 
      view1.setVisibility(View.VISIBLE); 
      anim.start(); 
     } 

     @Override 
     public void onAnimationRepeat(Animation animation) { 

     } 
    }; 
    translateAnimation.setAnimationListener(animationListener); 
    fab.startAnimation(translateAnimation); 
} 

編輯我的代碼片段清理了一些變量名。

+0

你怎麼稱呼這個方法? circularReveal(fab,toolbar); ?因爲您在名爲工具欄的視圖上應用translateAnimation。 –

+0

該方法是從 onClickListener調用的,該onClickListener在片段onCreatView()上的Fab上設置。 –

回答

1

因此,我們正試圖製作一個動畫,在其移動FAB之前它會消失並打開一個工具欄。

您的代碼讀取其他方式。它看起來像是在你的View上應用了一個名爲'toolbar'的TranslateAnimation,並且在你的FloatingActionButton上使用了一個圓形的Reveal。

反正我猜你正在努力實現這樣的事情:

private void circularReveal(final View view, View toolbar) { 

    // get the center for the clipping circle 
    int cx = (toolbar.getLeft() + toolbar.getRight())/2; 
    int cy = (toolbar.getTop() + toolbar.getBottom())/2; 

    // get the final radius for the clipping circle 
    int finalRadius = Math.max(toolbar.getWidth(), toolbar.getHeight()); 

    // create the animator for this view (the start radius is zero) 
    final Animator anim = ViewAnimationUtils.createCircularReveal(toolbar, cx, cy, 0, finalRadius); 

    view.animate() 
      .translationX(-100) 
      .translationY(-100) 
      .setDuration(2000) 
      .setListener(new Animator.AnimatorListener() { 
       @Override 
       public void onAnimationStart(Animator animation) { 

       } 

       @Override 
       public void onAnimationEnd(Animator animation) { 
        view.setVisibility(View.INVISIBLE); // set this to INVISIBLE if you want your FAB to dissapear 
        anim.start(); 
       } 

       @Override 
       public void onAnimationCancel(Animator animation) { 

       } 

       @Override 
       public void onAnimationRepeat(Animator animation) { 

       } 
      }); 

} 

這使FAB稍微向左和向上的工具欄顯示和FAB自敗了。

以FAB作爲第一個參數調用此方法,並以ToolBar作爲第二個參數。

我遺漏了TranslateAnimation並使用ViewPropertyAnimator,因爲TranslateAnimation並不真正移動視圖,而只是屏幕上的像素,而ViewPropertyAnimator會更改視圖的實際位置。 TranslateAnimation的問題在於,您仍然可以點擊FAB所在的舊位置,它仍會觸發FAB OnClickListener。

+0

謝謝我清理這些變量名稱。我試用了ViewPropertyAnimator,就像在你的例子中那樣,它使得晶圓廠從屏幕上消失,只有在兩秒鐘之後重新出現在新的點上。 –

+0

所以我必須在我的片段佈局xml的兩個xml父項中設置屬性android:animateLayoutChanges =「true」。一旦我做到了,動畫顯示正確。謝謝你的幫助。 –

相關問題