0

Dans mon application Android, j'utilise un CircularReveal pour afficher un RelativeLayout gris auparavant invisible, qui occupe tout l'écran, lorsqu'un bouton est cliqué. Le problème est que le bouton est placé dans le coin inférieur droit, et l'animation, à partir de là, ne révèle qu'une petite partie du RelativeLayout. Le reste devient visible sans aucune animation.Android - Circular Reveal ne remplit pas tout l'espace

Mon code est le suivant:

layout/activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       xmlns:fab="http://schemas.android.com/apk/res-auto" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent"> 

    <RelativeLayout android:id="@+id/cover_rl" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="@color/fab_material_blue_grey_500" 
     android:alpha="0.7" 
     android:elevation="2dp" 
     android:layout_below="@id/tool_bar" 
     android:visibility="invisible" /> 

    <com.software.shell.fab.ActionButton 
     android:id="@+id/fab_speeddial_action1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:stateListAnimator="@drawable/fab_animator" 
     android:layout_gravity="center_vertical" 
     android:elevation="6dp" 
     android:layout_alignParentRight="true" 
     android:layout_marginRight="24dp" 
     android:layout_marginBottom="24dp" 
     android:layout_above="@id/fab_speeddial_action2" 
     fab:type="MINI" 
     fab:button_color="@color/colorAccent" 
     fab:button_colorPressed="@color/fab_color_pressed" 
     fab:image="@drawable/ic_done_24px" 
     fab:shadow_color="#BF360C" 
     fab:shadow_radius="1.0dp" 
     fab:shadow_xOffset="0.5dp" 
     fab:shadow_yOffset="1.0dp" 
     fab:show_animation="@anim/fab_roll_from_down" /> 

</RelativeLayout> 

MainActivity.java

public class MainActivity extends AppCompatActivity { 
     private boolean wasFABPressed; 

     @Override 
     protected void onCreate(Bundle savedInstanceState) { 
      RelativeLayout coverRl = (RelativeLayout) findViewById(R.id.cover_rl); 
      ActionButton actionButton = (ActionButton) findViewById(R.id.fab_speeddial_action1); 

      actionButton.setOnClickListener(new View.OnClickListener() { 
    if(wasFABPressed) { 
     if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { 
      //El centro de la animación de revelar es el botón 
      float x = actionButton.getX(); 
      float y = actionButton.getY(); 

      int cx = (int) (x + (x + actionButton.getWidth()))/2; 
      int cy = (int) (y + (y - actionButton.getHeight()))/2; 

      int finalRadius = Math.max(coverRl.getWidth(), coverRl.getHeight())/2; 

      Animator anim = ViewAnimationUtils.createCircularReveal(coverRl, cx, cy, finalRadius, 0); 

      anim.addListener(new AnimatorListenerAdapter() { 
       @Override 
       public void onAnimationEnd(Animator animation) { 
        super.onAnimationEnd(animation); 
        coverRl.setVisibility(View.INVISIBLE); 
       } 
      }); 
      anim.start(); 
     } 
    }else{ 
     if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { 
      //El centro de la animación de revelar es el botón 
      float x = actionButton.getX(); 
      float y = actionButton.getY(); 

      int cx = (int) (x + (x + actionButton.getWidth()))/2; 
      int cy = (int) (y + (y - actionButton.getHeight()))/2; 

      int finalRadius = Math.max(coverRl.getWidth(), coverRl.getHeight())/2; 

      Animator anim = ViewAnimationUtils.createCircularReveal(coverRl, cx, cy, 0, finalRadius); 
      anim.setInterpolator(new AccelerateDecelerateInterpolator()); 
      coverRl.setVisibility(View.VISIBLE); 
      anim.start(); 
     } 
    } 

    wasFABPressed = !wasFABPressed; 
}); 

Répondre

1

Vous utilisez:

int finalRadius = Math.max(coverRl.getWidth(), coverRl.getHeight())/2; 

Ceci est essentiellement la moitié de le rayon de la vue finale que vous voulez montrer. Ainsi, la révélation circulaire fonctionnera pour la moitié de la vue et l'autre moitié de la vue apparaîtra alors sans aucune animation. Donc, vous devez utiliser ceci:

int finalRadius = Math.max(coverRl.getWidth(), coverRl.getHeight()); 

Pour le finalRadius. Lorsque vous utilisez circulaire révéler du centre de la vue alors que vous devez Devide par 2. Vous pouvez également utiliser:

int finalRadius = Math.hypot(coverRl.getWidth(), coverRl.getHeight()); 

Comme si le bouton est dans le coin à droite. Math.hypot renvoie une hypoténuse.