Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

How to work with Android listener application

We will learn the way to use Android listener application explaining about each and every step to come to an outcome.

Let us see the steps to reach the outcome we are focussing on and download and import the project.

Step 1: You need to Open the Eclipse and then initiate a new Android project which is targeted for Android 1.6 or higher. You should be renaming the startup activity Main.java.

Step 2: We will be making use of a small PNG image that is being created in GIMP as shown in Figure A below that is a simple gradient. You need to create a /drawable directory in the /res folder and then store the image there.

Displaying a gradient for our tutorial

Figure 1: Displaying a gradient for our tutorial

Step3: Now we need to come up with a new directory in the /res folder called /anim and here we will be placing the actual animations. For the purpose of this tutorial, we have created four XML animations that are all transformations. The objective is to move our gradient image left to right on the display having a “blip” in the middle.

Listing 1: xform_left_to_right_begin.xml

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
 android:interpolator="@android:anim/linear_interpolator"
 android:fromXDelta="5%p"
android:toXDelta="50%p"
 android:fromYDelta="50%p"
android:toYDelta="50%p"
 android:fillBefore="true"
android:duration="900"
android:fillAfter="true"/>
xform_to_peek.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
 android:interpolator="@android:anim/linear_interpolator"
 android:fromXDelta="50%p"
android:toXDelta="60%p"
 android:fromYDelta="50%p"
android:toYDelta="30%p"
 android:fillBefore="true"
android:duration="200"
android:fillAfter="true"/>
xform_from_peek.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
 android:interpolator="@android:anim/linear_interpolator"
 android:fromXDelta="60%p"
android:toXDelta="70%p"
 android:fromYDelta="30%p"
android:toYDelta="50%p"
 android:fillBefore="true"
android:duration="200"
android:fillAfter="true"/>
xform_left_to_right_end.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
 android:interpolator="@android:anim/linear_interpolator"
 android:fromXDelta="70%p"
android:toXDelta="90%p"
 android:fromYDelta="50%p"
android:toYDelta="50%p"
 android:fillBefore="true"
android:duration="400"
android:fillAfter="true"/>

Step 4: The final resource we will be placing is our layout. You need to incorporate a main.xml file in the /res/layout folder. The contents are nothing but a text view and an image view tucked inside of a linear layout.

Listing 2: main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 android:textSize="16sp"
 android:padding="25dip"
 android:textColor="#ffffff"
 android:text="Animation Listener Demo"
 android:layout_gravity="center"
 android:gravity="center"/>
<ImageView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:background="@drawable/heartbeat"
 android:id="@+id/blip"/>
</LinearLayout>

Step5: Now we are ready for the /src folder and the Main.java. These actually lie behind our layout. We need to extend activity and execute animation listener and also there will be a requirement of couple of class-level variables.

Listing 3: Main.java

package com.authorwjf.beep;
import android.app.Activity;
import android.os.Bundle;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.Animation.AnimationListener;
import android.widget.ImageView;
public class Main extends Activity implements AnimationListener {
private int state_machine = 0;
private Animation mAnim = null;
}

Step6: The time is now to override both the on create and the activity on stop since in case the on stop case is not handled properly, the application can behave unpredictably in case there is any interruption like a phone call.

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mAnim = AnimationUtils.loadAnimation(this, R.anim.xform_left_to_right_begin);
mAnim.setAnimationListener(this);
ImageView img = (ImageView)findViewById(R.id.blip);
img.clearAnimation();
img.setAnimation(mAnim);
img.startAnimation(mAnim);
}
@Override
protectedvoid onStop() {
super.onStop();
try {
ImageView img = (ImageView)findViewById(R.id.blip);
img.clearAnimation();
mAnim.setAnimationListener(null);
} catch (Exception e) {
//log
}
}

Step7: We have reached to our final step now where we will implement the Android listener callback. In our tutorial, we are only concerned only about loading a new animation when the current one ends but there is still a requirement to override both the on start and on repeat functions.

@Override
publicvoid onAnimationEnd(Animation a) {
a.setAnimationListener(null);
switch (state_machine) {
case 0:
a = AnimationUtils.loadAnimation(this, R.anim.xform_to_peek);
state_machine=1;
break;
case 1:
a = AnimationUtils.loadAnimation(this, R.anim.xform_from_peek);
state_machine=2;
break;
case 2:
a = AnimationUtils.loadAnimation(this, R.anim.xform_left_to_right_end);
state_machine=3;
break;
case 3:
a = AnimationUtils.loadAnimation(this, R.anim.xform_left_to_right_begin);
state_machine=0;
break;
}
a.setAnimationListener(this);
ImageView img = (ImageView)findViewById(R.id.blip);
img.clearAnimation();
img.setAnimation(a);
img.startAnimation(a);
}
@Override
public void onAnimationRepeat(Animation arg0) {
}
@Override
public void onAnimationStart(Animation arg0) {
}

We are now ready with our application to be compiled and run as shown in below figure. Don try to run this on an actual Android device because running this on the emulator would make the animations to be a bit jerky.

Displaying the outcome

Figure 2: Displaying the outcome

In case you get a chance to run it as is, spend out a few time to play with the timing variables in the /anim folder for the reason that some of the awesome effects can be produced. In the end, you will find that Android’s listener application is a great tool that can be of great support to the digital quiver.

Conclusion

We learned the way to use Android listener application explaining about each and every step to come to an outcome.



Software developer with more than 5 years of development on Java, HTML, CSS.

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login