Show and Hide Android Views While Scroll the Screen With Animation Effect

 Nowadays users are interacting with material design application. Material design applications are eye catching app which uses some effects like animation and material color to their app. If you are looking to make show and hide a view with a scroll or slide down and up screen with animate effect to android image view, text view or custom view, you are in right place. In this tutorial, you will learn to show and hide any android view when scroll/slide the screen with animation effect.

Here all these animations are made only by using XML code, you not need to have knowledge of java programming during this time.

Android Example: How to Show and Hide a View with a Slide Up/Down Screen with Animation

First things you have to do is open build.gradle file of your app and add compile 'com.github.flavienlaurent.discrollview:library:0.0.2@aar' as project dependency. Build.gradle file will look like below.

Now we will be working in XML layout file and all things will be done here. Open your project XML layout file and change your root layout to com.flavienlaurent.discrollview.lib.DiscrollView and add a new widgetcom.flavienlaurent.discrollview.lib.DiscrollViewContent inside that layout with layout_height and layout_width match_parent attributes. All content/widgets/views that you want to animate goes inside second widget with different attributes. Following is the complete content of sample project example you can paste below code to your project XML layout file.

res/layout/animated_scrolling_android_imageview.xml

	<com.flavienlaurent.discrollview.lib.DiscrollView xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:discrollve="http://schemas.android.com/apk/res-auto"
	xmlns:tools="http://schemas.android.com/tools"
	android:id="@+id/android_animated_discroll_view_layout"
	android:layout_width="match_parent"
	android:layout_height="match_parent">
	<com.flavienlaurent.discrollview.lib.DiscrollViewContent
	android:id="@+id/discroll_view_content_layout"
	android:layout_width="match_parent"
	android:layout_height="match_parent">
	<TextView
	android:id="@+id/text_view"
	android:layout_width="match_parent"
	android:layout_height="600dp"
	android:background="@android:color/white"
	android:fontFamily="serif"
	android:gravity="center"
	android:padding="25dp"
	android:text="Scroll Down the Screen..."
	android:textColor="@android:color/black"
	android:textSize="68sp"
	tools:visibility="gone" />
	<View
	android:id="@+id/animated_custom_view_color"
	android:layout_width="match_parent"
	android:layout_height="200dp"
	discrollve:discrollve_alpha="true"
	discrollve:discrollve_fromBgColor="#3cac32"
	discrollve:discrollve_threshold="0.3"
	discrollve:discrollve_toBgColor="#0869a6" />
	<ImageView
	android:id="@+id/animated_imageview_images"
	android:layout_width="200dp"
	android:layout_height="120dp"
	android:layout_marginBottom="16dp"
	android:layout_marginTop="16dp"
	android:src="@drawable/ic_launcher"
	discrollve:discrollve_alpha="true"
	discrollve:discrollve_translation="fromLeft|fromBottom" />
	<View
	android:id="@+id/animated_color"
	android:layout_width="match_parent"
	android:layout_height="200dp"
	discrollve:discrollve_fromBgColor="#ac7b32"
	discrollve:discrollve_toBgColor="#7b1d1d" />
	<ImageView
	android:layout_width="220dp"
	android:layout_height="110dp"
	android:layout_gravity="right"
	android:layout_marginBottom="16dp"
	android:layout_marginTop="16dp"
	android:src="@drawable/ic_launcher"
	discrollve:discrollve_translation="fromRight" />
	<TextView
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:fontFamily="serif"
	android:gravity="center"
	android:padding="20dp"
	android:text="Show and Hide Android Views: TextView, ImageView, CustomView, Buttons etc with animation effect."
	android:textSize="18sp"
	discrollve:discrollve_alpha="true"
	discrollve:discrollve_translation="fromBottom" />
	<ImageView
	android:layout_width="wrap_content"
	android:layout_height="200dp"
	android:layout_gravity="center"
	android:layout_margin="20dp"
	android:layout_marginBottom="16dp"
	android:layout_marginTop="16dp"
	android:src="@drawable/android_logo_icon"
	discrollve:discrollve_scaleX="true"
	discrollve:discrollve_scaleY="true" />
	<View
	android:layout_width="match_parent"
	android:layout_height="100dp"
	discrollve:discrollve_alpha="true"
	discrollve:discrollve_fromBgColor="#3cac32"
	discrollve:discrollve_threshold="0.3"
	discrollve:discrollve_toBgColor="#0869a6" />
	</com.flavienlaurent.discrollview.lib.DiscrollViewContent>
	</com.flavienlaurent.discrollview.lib.DiscrollView>

 Following is the default code of java activity file.

src/AnimatedAndroidTextViewEffect.java

 *
Now, run your Show and Hide Android Views When Scroll the Screen With Animation Effect application and scroll down and up the screen you will see different views with different animation effect. This will look like the below gif demo: 

* Xem chi tiết tại :  http://www.viralandroid.com/2016/02/show-and-hide-android-views-when-scroll-the-screen-with-animation-effect.html