[Guide] Adding Animations To Your Application [Part 2]

Search This thread

Saurabh Shah

Senior Member
Jun 15, 2013
115
169
Bangalore
www.thehackwall.com
Adding Aminations To Give Your Application A Cool Strike :good:

This is the second part of my previous post .

I have mentioned two more Cool Effects here.


Check Out Part 1 Adding Animations To Your Application[Part 1]

[Note: Assuming the package name to be package.name.here and created a folder named anim in /res/.

ZoomIn Effect

Code:
[B]Java Code[/B] [ZoomInActivity.java]

[QUOTE]
package package.name.here;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageView;

public class ZoomInActivity extends Activity implements AnimationListener {

	ImageView imgPoster;
	Button btnStart;

	// Animation
	Animation animZoomIn;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_zoom_in);

		imgPoster = (ImageView) findViewById(R.id.imgLogo);
		btnStart = (Button) findViewById(R.id.btnStart);

		// load the animation
		animZoomIn = AnimationUtils.loadAnimation(getApplicationContext(),
				R.anim.zoom_in);
		
		// set animation listener
		animZoomIn.setAnimationListener(this);

		// button click event
		btnStart.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				// start the animation
				imgPoster.startAnimation(animZoomIn);
			}
		});

	}

	@Override
	public void onAnimationEnd(Animation animation) {
		// Take any action after completing the animation

		// check for zoom in animation
		if (animation == animZoomIn) {			
		}

	}

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

	}

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

	}

}

[B]XML Code[/B] [activity_zoom_in.xml in res/layout folder]

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000000"
    android:gravity="center">
    
    <ImageView android:id="@+id/imgLogo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/image"
        android:layout_centerInParent="true"/>
    
    <Button android:id="@+id/btnStart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Start Animation"
        android:layout_marginTop="30dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="20dp"/>
    
</RelativeLayout>

[B]XML Code[/B] [zoom_in.xml in res/anim folder]

<?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>

[B][COLOR="orange"]NOTE: Here image is a png file kept in res/drawable-hdpi  folder.[/COLOR][/B][/QUOTE]

ZoomOut Effect

Code:
[B]Java Code[/B] [ZoomOutActivity.java]
[QUOTE]

package package.name.here

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageView;

public class ZoomOutActivity extends Activity implements AnimationListener {

	ImageView imgPoster;
	Button btnStart;

	// Animation
	Animation animZoomOut;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_zoom_out);

		imgPoster = (ImageView) findViewById(R.id.imgLogo);
		btnStart = (Button) findViewById(R.id.btnStart);

		// load the animation
		animZoomOut = AnimationUtils.loadAnimation(getApplicationContext(),
				R.anim.zoom_out);
		
		// set animation listener
		animZoomOut.setAnimationListener(this);

		// button click event
		btnStart.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				// start animation
				imgPoster.startAnimation(animZoomOut);
			}
		});

	}

	@Override
	public void onAnimationEnd(Animation animation) {
		// Take any action after completing the animation

		// check for zoom in animation
		if (animation == animZoomOut) {	
		}

	}

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

	}

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

	}

}

[B]XML Code[/B] [activity_zoom_out.xml in res/layout folder]

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000000"
    android:gravity="center">
    
    <ImageView android:id="@+id/imgLogo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/image"
        android:layout_centerInParent="true"/>
    
    <Button android:id="@+id/btnStart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Start Animation"
        android:layout_marginTop="30dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="20dp"/>
    
</RelativeLayout>

[B]XML Code[/B] [zoom_out.xml in res/anim folder]

<?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>[/QUOTE]

Please correct me if the code goes wrong somewhere.


Part 3 Coming Soon :fingers-crossed:


Saurabh Shah
----------------------------------------------------------------

Hit Thanks :good:
 
Last edited:

Top Liked Posts

  • There are no posts matching your filters.
  • 19
    Adding Aminations To Give Your Application A Cool Strike :good:

    This is the second part of my previous post .

    I have mentioned two more Cool Effects here.


    Check Out Part 1 Adding Animations To Your Application[Part 1]

    [Note: Assuming the package name to be package.name.here and created a folder named anim in /res/.

    ZoomIn Effect

    Code:
    [B]Java Code[/B] [ZoomInActivity.java]
    
    [QUOTE]
    package package.name.here;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.view.View;
    import android.view.animation.Animation;
    import android.view.animation.Animation.AnimationListener;
    import android.view.animation.AnimationUtils;
    import android.widget.Button;
    import android.widget.ImageView;
    
    public class ZoomInActivity extends Activity implements AnimationListener {
    
    	ImageView imgPoster;
    	Button btnStart;
    
    	// Animation
    	Animation animZoomIn;
    
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		// TODO Auto-generated method stub
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.activity_zoom_in);
    
    		imgPoster = (ImageView) findViewById(R.id.imgLogo);
    		btnStart = (Button) findViewById(R.id.btnStart);
    
    		// load the animation
    		animZoomIn = AnimationUtils.loadAnimation(getApplicationContext(),
    				R.anim.zoom_in);
    		
    		// set animation listener
    		animZoomIn.setAnimationListener(this);
    
    		// button click event
    		btnStart.setOnClickListener(new View.OnClickListener() {
    
    			@Override
    			public void onClick(View v) {
    				// start the animation
    				imgPoster.startAnimation(animZoomIn);
    			}
    		});
    
    	}
    
    	@Override
    	public void onAnimationEnd(Animation animation) {
    		// Take any action after completing the animation
    
    		// check for zoom in animation
    		if (animation == animZoomIn) {			
    		}
    
    	}
    
    	@Override
    	public void onAnimationRepeat(Animation animation) {
    		// TODO Auto-generated method stub
    
    	}
    
    	@Override
    	public void onAnimationStart(Animation animation) {
    		// TODO Auto-generated method stub
    
    	}
    
    }
    
    [B]XML Code[/B] [activity_zoom_in.xml in res/layout folder]
    
    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#000000"
        android:gravity="center">
        
        <ImageView android:id="@+id/imgLogo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/image"
            android:layout_centerInParent="true"/>
        
        <Button android:id="@+id/btnStart"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Start Animation"
            android:layout_marginTop="30dp"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="20dp"/>
        
    </RelativeLayout>
    
    [B]XML Code[/B] [zoom_in.xml in res/anim folder]
    
    <?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>
    
    [B][COLOR="orange"]NOTE: Here image is a png file kept in res/drawable-hdpi  folder.[/COLOR][/B][/QUOTE]

    ZoomOut Effect

    Code:
    [B]Java Code[/B] [ZoomOutActivity.java]
    [QUOTE]
    
    package package.name.here
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.view.View;
    import android.view.animation.Animation;
    import android.view.animation.Animation.AnimationListener;
    import android.view.animation.AnimationUtils;
    import android.widget.Button;
    import android.widget.ImageView;
    
    public class ZoomOutActivity extends Activity implements AnimationListener {
    
    	ImageView imgPoster;
    	Button btnStart;
    
    	// Animation
    	Animation animZoomOut;
    
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		// TODO Auto-generated method stub
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.activity_zoom_out);
    
    		imgPoster = (ImageView) findViewById(R.id.imgLogo);
    		btnStart = (Button) findViewById(R.id.btnStart);
    
    		// load the animation
    		animZoomOut = AnimationUtils.loadAnimation(getApplicationContext(),
    				R.anim.zoom_out);
    		
    		// set animation listener
    		animZoomOut.setAnimationListener(this);
    
    		// button click event
    		btnStart.setOnClickListener(new View.OnClickListener() {
    
    			@Override
    			public void onClick(View v) {
    				// start animation
    				imgPoster.startAnimation(animZoomOut);
    			}
    		});
    
    	}
    
    	@Override
    	public void onAnimationEnd(Animation animation) {
    		// Take any action after completing the animation
    
    		// check for zoom in animation
    		if (animation == animZoomOut) {	
    		}
    
    	}
    
    	@Override
    	public void onAnimationRepeat(Animation animation) {
    		// TODO Auto-generated method stub
    
    	}
    
    	@Override
    	public void onAnimationStart(Animation animation) {
    		// TODO Auto-generated method stub
    
    	}
    
    }
    
    [B]XML Code[/B] [activity_zoom_out.xml in res/layout folder]
    
    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#000000"
        android:gravity="center">
        
        <ImageView android:id="@+id/imgLogo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/image"
            android:layout_centerInParent="true"/>
        
        <Button android:id="@+id/btnStart"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Start Animation"
            android:layout_marginTop="30dp"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="20dp"/>
        
    </RelativeLayout>
    
    [B]XML Code[/B] [zoom_out.xml in res/anim folder]
    
    <?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>[/QUOTE]

    Please correct me if the code goes wrong somewhere.


    Part 3 Coming Soon :fingers-crossed:


    Saurabh Shah
    ----------------------------------------------------------------

    Hit Thanks :good: