Android Tutorials

Android animation example on TextView.

You just have to create an new activity and needs some animation xml files as follow.

Copy below code in your main activity class file.

MainActivity.class

package com.example.mihir.animationall;
/*        Mihir*/import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends Activity implements Animation.AnimationListener {

    TextView txtMessage;
    Button btnStart,btnStop,blink,zoomin,zoomout,rotate,move,slideup,slidedown,bounce,sa,ta;

    // Animation

Animation animFadein,animFadeout,animBlink,animZoomIn,animZoomOut,animRotate,animMove,
                animSlideUp,animSlideDown,animBounce,animSA,animTA;

    @Override    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub

super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        txtMessage = (TextView) findViewById(R.id.txtMessage);
        btnStart = (Button) findViewById(R.id.btnStart);
        btnStop = (Button) findViewById(R.id.btnStop);
        blink = (Button) findViewById(R.id.blink);
        zoomin = (Button) findViewById(R.id.zoomin);
        zoomout = (Button) findViewById(R.id.zoomout);
        rotate = (Button) findViewById(R.id.rotate);
        move = (Button) findViewById(R.id.move);
        slideup = (Button) findViewById(R.id.slideup);
        slidedown = (Button) findViewById(R.id.slidedown);
        bounce = (Button) findViewById(R.id.bounce);
        sa = (Button) findViewById(R.id.sa);
        ta = (Button) findViewById(R.id.ta);

        // load the animation        
animFadein = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fade_in);
        animFadeout = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fade_out);
        animBlink = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.blink);
        animZoomIn = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.zoomin);
        animZoomOut = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.zoomout);
        animRotate = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate);
        animMove = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.move);
        animSlideUp = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slideup);
        animSlideDown = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slidedown);
        animBounce = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.bounce);
        animSA = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.sa);
        animTA = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.ta);

        // set animation listener        animFadein.setAnimationListener(this);
        animFadeout.setAnimationListener(this);
        animBlink.setAnimationListener(this);
        animZoomIn.setAnimationListener(this);
        animZoomOut.setAnimationListener(this);
        animRotate.setAnimationListener(this);
        animMove.setAnimationListener(this);
        animSlideUp.setAnimationListener(this);
        animSlideUp.setAnimationListener(this);
        animSlideDown.setAnimationListener(this);
        animBounce.setAnimationListener(this);
        animSA.setAnimationListener(this);
        animTA.setAnimationListener(this);


        // button click event

btnStart.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.VISIBLE);

                // start the animation

txtMessage.startAnimation(animFadein);
            }
        });

        btnStop.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animFadeout);
            }
        });

        blink.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animBlink);
            }
        });

        zoomin.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animZoomIn);
            }
        });

        zoomout.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animZoomOut);
            }
        });

        rotate.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animRotate);
            }
        });

        move.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animMove);
            }
        });

        slideup.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animSlideUp);
            }
        });
        slidedown.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animSlideDown);
            }
        });
        bounce.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animBounce);
            }
        });
        sa.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animSA);
            }
        });
        ta.setOnClickListener(new View.OnClickListener() {

            @Override            public void onClick(View v) {
                txtMessage.setVisibility(View.INVISIBLE);

                // start the animation

txtMessage.startAnimation(animTA);
            }
        });
    }

    @Override    public void onAnimationEnd(Animation animation) {
        // Take any action after completing the animation        // check for fade in animation    }

    @Override    public void onAnimationRepeat(Animation animation) {
        // TODO Auto-generated method stub    }

    @Override    public void onAnimationStart(Animation animation) {
        // TODO Auto-generated method stub    }
}

copy following code in your main activity layout file.

activity_main.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"   
android:paddingBottom="@dimen/activity_vertical_margin"   
android:paddingLeft="@dimen/activity_horizontal_margin"   
android:paddingRight="@dimen/activity_horizontal_margin"   
android:paddingTop="@dimen/activity_vertical_margin"   
tools:context="com.example.mihir.animationall.MainActivity">


<Button       
android:layout_width="wrap_content" 
android:layout_height="wrap_content"  
android:text="Fade In"       
android:id="@+id/btnStart"        
android:layout_above="@+id/zoomin"  
android:layout_alignParentLeft="true" 
android:layout_alignParentStart="true" />

<TextView        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:textSize="25dp"        
android:text="Animated Text"        
android:id="@+id/txtMessage"        
android:visibility="invisible"       
android:layout_alignParentTop="true"       
android:layout_centerHorizontal="true"        
android:layout_marginTop="104dp" />

<Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="Fade out"        
android:id="@+id/btnStop"        
android:layout_above="@+id/zoomout"        
android:layout_alignRight="@+id/zoomout"        
android:layout_alignEnd="@+id/zoomout" />

<Button
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="Blink"        
android:id="@+id/blink"        
android:layout_alignBottom="@+id/btnStop"        
android:layout_toRightOf="@+id/btnStop"        
android:layout_toEndOf="@+id/btnStop" />

<Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="ZoomIn"        
android:id="@+id/zoomin"        
android:layout_above="@+id/move"        
android:layout_alignParentLeft="true"        
android:layout_alignParentStart="true" />

<Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="Zoomout"        
android:id="@+id/zoomout"        
android:layout_alignBottom="@+id/zoomin"        
android:layout_toRightOf="@+id/zoomin"        
android:layout_toEndOf="@+id/zoomin" />

    <Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="rotate"        
android:id="@+id/rotate"        
android:layout_alignBottom="@+id/zoomout"        
android:layout_toRightOf="@+id/btnStop"        
android:layout_toEndOf="@+id/btnStop" />

    <Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="Move"        
android:id="@+id/move"        
android:layout_above="@+id/bounce"        
android:layout_alignParentLeft="true"        
android:layout_alignParentStart="true" />

    <Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="slideup"        
android:id="@+id/slideup"        
android:layout_alignBottom="@+id/move"        
android:layout_toRightOf="@+id/move"        
android:layout_toEndOf="@+id/move" />

    <Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="slidedown"        
android:id="@+id/slidedown"        
android:layout_alignBottom="@+id/slideup"        
android:layout_toRightOf="@+id/slideup"        
android:layout_toEndOf="@+id/slideup" />

    <Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="bounce"        
android:id="@+id/bounce"        
android:layout_above="@+id/ta"        
android:layout_alignParentLeft="true"        
android:layout_alignParentStart="true" />

    <Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="Sequential Animation"        
android:id="@+id/sa"        
android:layout_alignTop="@+id/bounce"        
android:layout_toRightOf="@+id/bounce"        
android:layout_toEndOf="@+id/bounce" />

    <Button        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="Together Animation"        
android:id="@+id/ta"        
android:layout_alignParentBottom="true"        
android:layout_alignParentLeft="true"        
android:layout_alignParentStart="true" />
    
</RelativeLayout>

Now you have to create Animation directory under the recourse directory as shown in below image.






My animation directory would be "anim" under anim directory you have to create

an animation xml files, there are different types of animations, so create them all to try it.



fade_in.xml


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true" >

    <alpha        
android:duration="1000"        
android:fromAlpha="0.0"        
android:interpolator="@android:anim/accelerate_interpolator"        
android:toAlpha="1.0" />

</set>

fade_out.xml


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="false" >

    <alpha        
android:duration="1000"        
android:fromAlpha="1.0"        
android:interpolator="@android:anim/accelerate_interpolator"        
android:toAlpha="0.0" />

</set>

move.xml


<?xml version="1.0" encoding="utf-8"?>
<set    xmlns:android="http://schemas.android.com/apk/res/android"    
android:interpolator="@android:anim/linear_interpolator"    
android:fillAfter="true">

    <translate       
android:fromXDelta="0%p"        
android:toXDelta="15%p"       
android:duration="800" />
</set>

blink.xml

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

bounce.xml


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true"   
android:interpolator="@android:anim/bounce_interpolator">

    <scale       
android:duration="500"        
android:fromXScale="1.0"       
android:fromYScale="0.0"        
android:toXScale="1.0"       
android:toYScale="1.0" />

</set>

rotate.xml


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate 
android:fromDegrees="0"        
android:toDegrees="360"        
android:pivotX="50%"        
android:pivotY="50%"        
android:duration="600"        
android:repeatMode="restart"        
android:repeatCount="infinite"        
android:interpolator="@android:anim/cycle_interpolator"/>

</set>

slideup.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true" >

    <scale        
android:duration="500"        
android:fromXScale="1.0"        
android:fromYScale="1.0"        
android:interpolator="@android:anim/linear_interpolator"        
android:toXScale="1.0"        
android:toYScale="0.0" />

</set>

slidedown.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true">

    <scale        
android:duration="500"        
android:fromXScale="1.0"        
android:fromYScale="0.0"        
android:interpolator="@android:anim/linear_interpolator"        
android:toXScale="1.0"        
android:toYScale="1.0" />

</set>

zoomin.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true" >
    <scale        
xmlns:android="http://schemas.android.com/apk/res/android"        
android:duration="1000"        
android:fromXScale="1"        
android:fromYScale="1"        
android:pivotX="50%"        
android:pivotY="50%"        
android:toXScale="3"        
android:toYScale="3" >
    </scale>

</set>

zoomout.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true" >

    <scale        
xmlns:android="http://schemas.android.com/apk/res/android"        
android:duration="1000"        
android:fromXScale="1.0"        
android:fromYScale="1.0"        
android:pivotX="50%"        
android:pivotY="50%"        
android:toXScale="0.5"        
android:toYScale="0.5" >
    </scale>

</set>

sa.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true"    
android:interpolator="@android:anim/linear_interpolator" >
    <!-- Use startOffset to give delay between animations -->    
<!-- Move -->    
<translate        
android:duration="800"        
android:fillAfter="true"        
android:fromXDelta="0%p"        
android:startOffset="300"        
android:toXDelta="75%p" />
    <translate        
android:duration="800"        
android:fillAfter="true"        
android:fromYDelta="0%p"        
android:startOffset="1100"        
android:toYDelta="70%p" />
    <translate        


android:duration="800"        
android:fillAfter="true"        
android:fromXDelta="0%p"        
android:startOffset="1900"        
android:toXDelta="-75%p" />
    <translate        
android:duration="800"        
android:fillAfter="true"        
android:fromYDelta="0%p"        
android:startOffset="2700"        
android:toYDelta="-70%p" />

    <!-- Rotate 360 degrees -->    
<rotate        
android:duration="1000"        
android:fromDegrees="0"        
android:interpolator="@android:anim/cycle_interpolator"        
android:pivotX="50%"        
android:pivotY="50%"        
android:startOffset="3800"        
android:repeatCount="infinite"        
android:repeatMode="restart"        
android:toDegrees="360" />

</set>

ta.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"    
android:fillAfter="true"    
android:interpolator="@android:anim/linear_interpolator" >

    <scale        
xmlns:android="http://schemas.android.com/apk/res/android"        
android:duration="4000"        
android:fromXScale="1"        
android:fromYScale="1"        
android:pivotX="50%"        
android:pivotY="50%"        
android:toXScale="4"        
android:toYScale="4" >
    </scale>

    <!-- Rotate 180 degrees -->    
<rotate        
android:duration="500"        
android:fromDegrees="0"        
android:pivotX="50%"        
android:pivotY="50%"        
android:repeatCount="infinite"        
android:repeatMode="restart"        
android:toDegrees="360" />

</set>
So here is complete code now you can try on your own..

Android Tutorials

Wednesday 19 October 2016

No comments:

Post a Comment

CCAvenue Payment Gateway Android Integration

Search This Blog