Circular Revelar no funciona cuando la gravedad FAB es inferior

Estoy trabajando en morphing un botón flotante de la acción (FAB) a una barra de herramientas y las cosas funcionan suavemente y perfectamente con el código siguiente:

Archivo de diseño:

<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="sg.com.saurabh.designlibraryexpirements.ToolbarMorphActivity"> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="top|right" android:layout_marginTop="@dimen/activity_vertical_margin" android:layout_marginRight="@dimen/activity_vertical_margin" android:layout_marginBottom="@dimen/activity_vertical_margin" android:src="@drawable/ic_add" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" style="@style/ToolBarTheme" android:layout_height="?attr/actionBarSize" android:layout_gravity="top" android:layout_marginTop="@dimen/activity_vertical_margin" android:layout_marginBottom="@dimen/activity_vertical_margin" android:visibility="invisible" tools:visibility="visible" /> </FrameLayout> 

actividad:

 package sg.com.saurabh.designlibraryexpirements; import android.animation.Animator; import android.os.Bundle; import android.os.Handler; import android.support.design.widget.FloatingActionButton; import android.support.v4.view.animation.FastOutLinearInInterpolator; import android.support.v4.view.animation.LinearOutSlowInInterpolator; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.Toolbar; import android.view.View; import android.view.ViewAnimationUtils; import android.view.animation.AccelerateInterpolator; import android.view.animation.AnticipateOvershootInterpolator; public class ToolbarMorphActivity extends AppCompatActivity { Toolbar toolbar; FloatingActionButton fab; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_toolbar_morph); toolbar = (Toolbar) findViewById(R.id.toolbar); fab = (FloatingActionButton) findViewById(R.id.fab); fab.setOnClickListener(mFabClickListener); } private View.OnClickListener mFabClickListener = new View.OnClickListener() { @Override public void onClick(View v) { fab.animate() .rotationBy(45) .setInterpolator(new AnticipateOvershootInterpolator()) .setDuration(250) .start(); new Handler().postDelayed(new Runnable() { @Override public void run() { fab.setVisibility(View.GONE); } },50); revealToolbar(); } }; private void revealToolbar() { toolbar.setVisibility(View.VISIBLE); int x = (int)fab.getX() + fab.getWidth()/2; int y = (int)fab.getY() + fab.getHeight()/2; Animator animator = ViewAnimationUtils.createCircularReveal(toolbar, x, y, 0, toolbar.getWidth()) .setDuration(400); animator.setInterpolator(new FastOutLinearInInterpolator()); animator.start(); } private void dismissToolbar() { int x = (int)fab.getX() + fab.getWidth()/2; int y = (int)fab.getY() + fab.getHeight()/2; Animator animator = ViewAnimationUtils.createCircularReveal(toolbar, x, y, toolbar.getWidth(), 0) .setDuration(400); animator.setInterpolator(new LinearOutSlowInInterpolator()); animator.addListener(new Animator.AnimatorListener() { @Override public void onAnimationStart(Animator animation) { } @Override public void onAnimationEnd(Animator animation) { toolbar.setVisibility(View.INVISIBLE); } @Override public void onAnimationCancel(Animator animation) { } @Override public void onAnimationRepeat(Animator animation) { } }); animator.start(); new Handler().postDelayed(new Runnable() { @Override public void run() { fab.setVisibility(View.VISIBLE); fab.animate() .rotationBy(-45) .setInterpolator(new AccelerateInterpolator()) .setDuration(100) .start(); } },200); } @Override public void onBackPressed() { if(toolbar.getVisibility() == View.VISIBLE) { dismissToolbar(); } else super.onBackPressed(); } } 

La circular revela funciona como se esperaba para el diseño anterior. Sin embargo la cosa rompe para arriba cuando cambie la layout_gravity del layout_gravity del fab y la barra de herramientas a la bottom vez de la top . La animación de rotación funciona y, a continuación, la barra de herramientas sólo aparece sin la animación de revelar circular. Estoy completamente perplejo por la forma en que se rompe la circular revelar animación.

Introduzca aquí la descripción de la imagen

La solución para usted sería reemplazar:

 private void revealToolbar() { .... int x = (int)fab.getX() + fab.getWidth()/2; int y = (int)fab.getY() + fab.getHeight()/2; .... } 

por

  private void revealToolbar() { ... int x = (int)fab.getX() + fab.getWidth()/2; int y = fab.getHeight()/2; ... } 

La razón es que createCircularReveal está tomando los parámetros centerY y centerX como coordenadas del centro del círculo de animación, en relación con la vista (es decir, Toolbar , en nuestro caso).

Ver método ViewAnimationUtils.createCircularReveal definición :

  ........ * @param view The View will be clipped to the animating circle. * @param centerX The x coordinate of the center of the animating circle, relative to * <code>view</code>. * @param centerY The y coordinate of the center of the animating circle, relative to * <code>view</code>. * @param startRadius The starting radius of the animating circle. * @param endRadius The ending radius of the animating circle. */ 
  • El botón de acción flotante aparece sobre el cajón de navegación
  • Implementación diferente para un botón de acción flotante en cada fragmento de una actividad
  • cómo hacer clic en el botón de acción flotante en un fragmento?
  • Bloqueo de sombra de botón de acción flotante en los márgenes de vista
  • Ajustar el tamaño del icono del botón de acción flotante (fab)
  • Mi FloatingActionButton tiene algunas líneas extrañas que salen de él en 4.4 y menor
  • Cómo eliminar la sombra circundante FloatingActionButton?
  • Cómo animar FloatingActionButton de la nueva biblioteca de soporte de diseño
  • Color FAB para el fondo No cambia en los dispositivos de versión de Gingerbread
  • Ejemplo de FloatingActionButton con la biblioteca de soporte
  • Botón de acción flotante en una actividad - ¿cómo anclar a una vista de reciclaje en un fragmento?
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.