studio ocultar mostrar layouts hacer elementos ejemplos como animacion activity android animation android-animation

mostrar - ocultar textview android studio



Muestra y oculta una vista con una animaciĆ³n de diapositivas arriba/abajo (10)

Aquí está mi solución. Simplemente obtenga una referencia a su vista y llame a este método:

public static void animateViewFromBottomToTop(final View view){ view.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { view.getViewTreeObserver().removeOnGlobalLayoutListener(this); final int TRANSLATION_Y = view.getHeight(); view.setTranslationY(TRANSLATION_Y); view.setVisibility(View.GONE); view.animate() .translationYBy(-TRANSLATION_Y) .setDuration(500) .setStartDelay(200) .setListener(new AnimatorListenerAdapter() { @Override public void onAnimationStart(final Animator animation) { view.setVisibility(View.VISIBLE); } }) .start(); } }); }

No hay necesidad de hacer nada mas =)

Tengo un LinearLayout que quiero mostrar u ocultar con una Animation que empuja el diseño hacia arriba o hacia abajo cada vez que cambio su visibilidad.

He visto algunas muestras por ahí pero ninguna de ellas satisface mis necesidades.

He creado dos archivos xml para las animaciones, pero no sé cómo iniciarlas cuando cambio la visibilidad de un LinearLayout .


Con la nueva API de animación que se introdujo en Android 3.0 (Honeycomb) es muy sencillo crear tales animaciones.

Deslizando una View hacia abajo por una distancia:

view.animate().translationY(distance);

Más tarde, puede deslizar la View nuevo a su posición original de esta manera:

view.animate().translationY(0);

También puedes combinar fácilmente múltiples animaciones. La siguiente animación deslizará una View hacia abajo por su altura y la fundirá al mismo tiempo:

// Prepare the View for the animation view.setVisibility(View.VISIBLE); view.setAlpha(0.0f); // Start the animation view.animate() .translationY(view.getHeight()) .alpha(1.0f) .setListener(null);

Luego puede atenuar la View hacia atrás y deslizarla de nuevo a su posición original. También configuramos un AnimatorListener para que podamos configurar la visibilidad de la View en GONE una vez que la animación haya finalizado:

view.animate() .translationY(0) .alpha(0.0f) .setListener(new AnimatorListenerAdapter() { @Override public void onAnimationEnd(Animator animation) { super.onAnimationEnd(animation); view.setVisibility(View.GONE); } });


Estaba teniendo problemas para entender y aplicar la respuesta aceptada. Necesitaba un poco más de contexto. Ahora que lo he descubierto, aquí hay un ejemplo completo:

MainActivity.java

public class MainActivity extends AppCompatActivity { Button myButton; View myView; boolean isUp; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); myView = findViewById(R.id.my_view); myButton = findViewById(R.id.my_button); // initialize as invisible (could also do in xml) myView.setVisibility(View.INVISIBLE); myButton.setText("Slide up"); isUp = false; } // slide the view from below itself to the current position public void slideUp(View view){ view.setVisibility(View.VISIBLE); TranslateAnimation animate = new TranslateAnimation( 0, // fromXDelta 0, // toXDelta view.getHeight(), // fromYDelta 0); // toYDelta animate.setDuration(500); animate.setFillAfter(true); view.startAnimation(animate); } // slide the view from its current position to below itself public void slideDown(View view){ TranslateAnimation animate = new TranslateAnimation( 0, // fromXDelta 0, // toXDelta 0, // fromYDelta view.getHeight()); // toYDelta animate.setDuration(500); animate.setFillAfter(true); view.startAnimation(animate); } public void onSlideViewButtonClick(View view) { if (isUp) { slideDown(myView); myButton.setText("Slide up"); } else { slideUp(myView); myButton.setText("Slide down"); } isUp = !isUp; } }

actividad_mail.xml

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout 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="com.example.slideview.MainActivity"> <Button android:id="@+id/my_button" android:layout_centerHorizontal="true" android:layout_marginTop="100dp" android:onClick="onSlideViewButtonClick" android:layout_width="150dp" android:layout_height="wrap_content"/> <LinearLayout android:id="@+id/my_view" android:background="#a6e1aa" android:orientation="vertical" android:layout_alignParentBottom="true" android:layout_width="match_parent" android:layout_height="200dp"> </LinearLayout> </RelativeLayout>

Notas

  • Gracias a este artículo por señalarme en la dirección correcta. Fue más útil que las otras respuestas en esta página.
  • Si desea comenzar con la vista en pantalla, entonces no la inicialice como INVISIBLE .
  • Ya que lo estamos animando completamente fuera de la pantalla, no es necesario volverlo a poner en INVISIBLE . Sin embargo, si no está animando completamente fuera de la pantalla, puede agregar una animación alfa y configurar la visibilidad con un AnimatorListenerAdapter .
  • Documentos de animación de propiedad

La solución más sencilla: establezca android:animateLayoutChanges="true" en el contenedor que contiene sus vistas.

Para ponerlo en algún contexto: si tiene un diseño como el siguiente, todos los cambios de visibilidad en las vistas en este contenedor se animarán automáticamente.

<LinearLayout android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" android:animateLayoutChanges="true" > <Views_which_change_visibility> </LinearLayout>

Puede encontrar más detalles sobre esto en Animating Layout Changes - Android Developer


Puede iniciar la Animation correcta cuando cambie la visibilidad de LinearLayout creando una nueva subclase de LinearLayout y anulando setVisibility() para iniciar las Animations . Considera algo como esto:

public class SimpleViewAnimator extends LinearLayout { private Animation inAnimation; private Animation outAnimation; public SimpleViewAnimator(Context context) { super(context); } public void setInAnimation(Animation inAnimation) { this.inAnimation = inAnimation; } public void setOutAnimation(Animation outAnimation) { this.outAnimation = outAnimation; } @Override public void setVisibility(int visibility) { if (getVisibility() != visibility) { if (visibility == VISIBLE) { if (inAnimation != null) startAnimation(inAnimation); } else if ((visibility == INVISIBLE) || (visibility == GONE)) { if (outAnimation != null) startAnimation(outAnimation); } } super.setVisibility(visibility); } }


Tuve un caso de esquina donde la altura de mi vista aún era zero así que ...

import android.animation.Animator; import android.animation.AnimatorListenerAdapter; import android.view.View; public final class AnimationUtils { public static void slideDown(final View view) { view.animate() .translationY(view.getHeight()) .alpha(0.f) .setListener(new AnimatorListenerAdapter() { @Override public void onAnimationEnd(Animator animation) { // superfluous restoration view.setVisibility(View.GONE); view.setAlpha(1.f); view.setTranslationY(0.f); } }); } public static void slideUp(final View view) { view.setVisibility(View.VISIBLE); view.setAlpha(0.f); if (view.getHeight() > 0) { slideUpNow(view); } else { // wait till height is measured view.post(new Runnable() { @Override public void run() { slideUpNow(view); } }); } } private static void slideUpNow(final View view) { view.setTranslationY(view.getHeight()); view.animate() .translationY(0) .alpha(1.f) .setListener(new AnimatorListenerAdapter() { @Override public void onAnimationEnd(Animator animation) { view.setVisibility(View.VISIBLE); view.setAlpha(1.f); } }); } }


Usa esta clase:

public class ExpandCollapseExtention { public static void expand(View view) { view.setVisibility(View.VISIBLE); final int widthSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); final int heightSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); view.measure(widthSpec, heightSpec); ValueAnimator mAnimator = slideAnimator(view, 0, view.getMeasuredHeight()); mAnimator.start(); } public static void collapse(final View view) { int finalHeight = view.getHeight(); ValueAnimator mAnimator = slideAnimator(view, finalHeight, 0); mAnimator.addListener(new Animator.AnimatorListener() { @Override public void onAnimationEnd(Animator animator) { view.setVisibility(View.GONE); } @Override public void onAnimationStart(Animator animation) { } @Override public void onAnimationCancel(Animator animation) { } @Override public void onAnimationRepeat(Animator animation) { } }); mAnimator.start(); } private static ValueAnimator slideAnimator(final View v, int start, int end) { ValueAnimator animator = ValueAnimator.ofInt(start, end); animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator valueAnimator) { int value = (Integer) valueAnimator.getAnimatedValue(); ViewGroup.LayoutParams layoutParams = v.getLayoutParams(); layoutParams.height = value; v.setLayoutParams(layoutParams); } }); return animator; } }


puede deslizar hacia arriba y hacia abajo cualquier vista o diseño utilizando el siguiente código en la aplicación de Android

boolean isClicked=false; LinearLayout mLayoutTab = (LinearLayout)findViewById(R.id.linearlayout); if(isClicked){ isClicked = false; mLayoutTab.animate() .translationYBy(120) .translationY(0) .setDuration(getResources().getInteger(android.R.integer.config_mediumAnimTime)); }else{ isClicked = true; mLayoutTab.animate() .translationYBy(0) .translationY(120) .setDuration(getResources().getInteger(android.R.integer.config_mediumAnimTime)); }


Kotlin

Basado en la answer , aquí hay una forma elegante de usar la extensión Ver:

fun View.slideUp(duration: Int = 500) { visibility = View.VISIBLE val animate = TranslateAnimation(0f, 0f, this.height.toFloat(), 0f) animate.duration = duration.toLong() animate.fillAfter = true this.startAnimation(animate) } fun View.slideDown(duration: Int = 500) { visibility = View.VISIBLE val animate = TranslateAnimation(0f, 0f, 0f, this.height.toFloat()) animate.duration = duration.toLong() animate.fillAfter = true this.startAnimation(animate) }

Y luego, donde quiera que quiera usarlo, solo necesita myView.slideUp() o myView.slideDown()


if (filter_section.getVisibility() == View.GONE) { filter_section.animate() .translationY(filter_section.getHeight()).alpha(1.0f) .setListener(new AnimatorListenerAdapter() { @Override public void onAnimationStart(Animator animation) { super.onAnimationStart(animation); filter_section.setVisibility(View.VISIBLE); filter_section.setAlpha(0.0f); } }); } else { filter_section.animate() .translationY(0).alpha(0.0f) .setListener(new AnimatorListenerAdapter() { @Override public void onAnimationEnd(Animator animation) { super.onAnimationEnd(animation); filter_section.setVisibility(View.GONE); } }); }