how to make view visible and gone with some animation?

Question

I have a relative layout, I need to show that view when network connectivity is not there and gone that view when connection came back, I need to do it like youtube. YT will show the popup in bottom with green color and after sometimes the view slide down. Thanks in advance I am new to this. I can't find any equivalent answer in StackOverflow

<RelativeLayout

    android:id="@+id/dashboard_xmpp_connection_status_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:animateLayoutChanges="true"
    android:visibility="gone">

    <TextView
        android:id="@+id/dashboard_xmpp_connection_text"
        android:layout_width="match_parent"
        android:layout_height="33dp"
        android:animateLayoutChanges="true"
        style="@style/Connection_status"
        android:text="@string/msg_no_internet" />

</RelativeLayout>

Does this answer your question? [Show and hide a View with a slide up/down animation](https://stackoverflow.com/questions/19765938/show-and-hide-a-view-with-a-slide-up-down-animation) — Md. Asaduzzaman, Dec 05 '19 at 07:18

score 0 · Answer 1 · answered Dec 05 '19 at 06:37

    binding.filter.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if (binding.filterExams.getVisibility() == View.VISIBLE) {
                Animation slide_down = AnimationUtils.loadAnimation(binding.filterExams.getRootView().getContext(),
                        R.anim.slide_up_filter);
                slide_down.setAnimationListener(new Animation.AnimationListener() {
                    @Override
                    public void onAnimationStart(Animation animation) {

                    }

                    @Override
                    public void onAnimationEnd(Animation animation) {
                        binding.filterExams.setVisibility(View.GONE);
                    }

                    @Override
                    public void onAnimationRepeat(Animation animation) {

                    }
                });
                binding.filterExams.startAnimation(slide_down);

            } else {
                binding.filterExams.setVisibility(View.VISIBLE);
                Animation slide_down = AnimationUtils.loadAnimation(binding.filterExams.getRootView().getContext(),
                        R.anim.slide_down);

                binding.filterExams.startAnimation(slide_down);

            }
        }
    });

you can add animation file in xml file for e.g

here i used slide down and up animation

slide_up_filter.xml

   <?xml version="1.0" encoding="utf-8"?>
  <set xmlns:android="http://schemas.android.com/apk/res/android" 
   android:interpolator="@android:anim/linear_interpolator">
    <scale
    android:duration="250"
    android:fromXScale="1.0"
    android:fromYScale="1.0"
    android:toXScale="1.0"
    android:toYScale="0.0" />
  </set>

slide_down.xml

 <?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android" 
android:interpolator="@android:anim/linear_interpolator">
<scale
    android:duration="250"
    android:fromXScale="1.0"
    android:fromYScale="0.0"
    android:toXScale="1.0"
    android:toYScale="1.0" />
 </set>

like this there are sevaral animation

fade_in.xml

<?xml version="1.0" encoding="utf-8"?>
 <set xmlns:android="http://schemas.android.com/apk/res/android" 
android:interpolator="@android:anim/linear_interpolator">
 <alpha
    android:duration="2000"
    android:fromAlpha="0.1"
    android:toAlpha="1.0">
 </alpha>
 </set>

 fade_out.xml

 <?xml version="1.0" encoding="utf-8"?>
 <alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromAlpha="1.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="0.0" />

Ankita · Answer 2 · 2019-12-05T07:02:30.750

You can use Transition API which is available in Support(androidx) package.

To use this you have to call TransitionManager.geginDelayedTransition method and change the visibility of the view to visible and gone as per the requirement.

  private void slideView(boolean show) {
        Transition transition = new Slide(Gravity.BOTTOM);
        transition.setDuration(600);
        transition.addTarget(R.id.id_of_relative_layout);

        TransitionManager.beginDelayedTransition(id_of_relative_layout, transition);
        if(show){
           relativeView.setVisibility(View.VISIBLE);
        }
        else{
           relativeView.setVisibility(View.GONE);
        }
   }

Call slideView() function on the action from where you want to perform it.

For more deatil follow this - Show and hide a View with a slide up/down animation

id of relative layout or you can say view which you want to animate/show-hide. — Ankita, Dec 05 '19 at 07:03

Nagendran P · Answer 3 · 2019-12-05T07:05:25.840

so you can use LottieAnimationView

your app gradle file

implementation 'com.airbnb.android:lottie:3.0.7'//2.7.0

go this website sign and download free lottie json file

please click

   step 1:put this download lottie json file to android studio assets folder

your layout file

  <FrameLayout

    android:id="@+id/dashboard_xmpp_connection_status_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:animateLayoutChanges="true"
    android:visibility="gone">

    <com.airbnb.lottie.LottieAnimationView
         android:id="@+id/showAnimations"
         android:layout_gravity="center"
         android:layout_height="66dp"
         android:layout_width="56dp"
         android:visibility="gone"
         app:lottie_autoPlay="true"
         app:lottie_loop="false"
        app:lottie_fileName="animsix.json" <!--please put your download  json file -->
                />        


</FrameLayout>



 MainActivity


LottieAnimationView showLottie=findViewById(R.id.showAnimations);   

 if("network is available"){
    showLottie.setVisibility(View.GONE);
   }else{
    showLottie.setVisibility(View.VISIBLE);
    }

score 0 · Answer 4 · answered Dec 05 '19 at 07:16

You could simply use fade in animation for text view like this.

void fadeIn() {
    textView.setVisibility(View.VISIBLE);
    textView.setAlpha(0);
    int duration = getResources().getInteger(android.R.integer.config_mediumAnimTime);
    textView.animate().alpha(1).setDuration(duration);
}

textView.animate() returns ViewPropertyAnimator which contains various methods to customize animations.

Visit this for more details

how to make view visible and gone with some animation?

4 Answers4